I am currently working on creating a tree structure using the vue-orgchart library (link)
Everything is functioning correctly, but I am interested in changing the green background color of the node (ignoring the white portion).
https://i.sstatic.net/EEcdX.png
You can locate the CSS styles in this link.
Upon inspection, I discovered that the green color is defined as: #42b983. It is easily identifiable in the CSS file:
.orgchart .node .title {
text-align: center;
font-size: 12px;
font-weight: 300;
height: 20px;
line-height: 20px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
background-color: #42b983;
color: #fff;
border-radius: 4px 4px 0 0;
}
The straightforward solution would be to modify it as follows:
background-color: linear-gradient(#66cccc, #3399cc);
However, unexpectedly, I encounter:
https://i.sstatic.net/sQ2oZ.png
Upon testing the use of any other color (omitting the linear-gradient), the change is successful.
I've utilized this style (linear-gradient) in other areas of the website without issues, so it does not appear to be a browser-related problem (currently using Chrome).
Any suggestions on how to resolve this particular issue?