-
Notifications
You must be signed in to change notification settings - Fork 9
/
Graph Customization.css
121 lines (100 loc) 路 3.22 KB
/
Graph Customization.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
:root{
/*----------------------------------------------------------------
COLORS
----------------------------------------------------------------*/
--red: #ff5582;
--pink: #f2b3cf;
--fairpink: #eed3e1;
--yellow: #fff3a3;
--linen: #fcecec;
--paleblue: #b5d3ff;
--purple: #d2b3ff;
--palegreen: #bbfabb;
--cornflower-blue: #a1c4fd;
--light-cornflower-blue: #adccff;
--duskblue: #a2acc3;
--darkbrown: #34343d;
--pureblack: #000000;
--royalblue: #7288da;
/*----------------------------------------------------------------
BOLD COLORS
----------------------------------------------------------------*/
--boldpink: #fe53bb;
--boldpurple: #7322e6;
--boldred: #ff5555;
--boldyellow: #ffff00;
--boldorange: #ffb86c;
--boldgreen: #85ffa4;
--boldblue: #99e7ff;
--boldlightpink: #ffbaeb;
/*----------------------------------------------------------------
PASTEL COLORS
----------------------------------------------------------------*/
--pastelyellow: #fcf4c9;
--pastelcoral: #ffe896;
--pastelpink: #fbcdf2;
--pastelpurple: #e8befa;
--pastelperiwinkle: #abbfff;
--pastelgreen: #bbf3c0;
}
.theme-dark{
/*----------------------------------------------------------------
DARK THEME GRAPH
----------------------------------------------------------------*/
--graph-line: var(--background-modifier-border);
--graph-line-highlight: var(--linen);
--graph-circle-outline: var(--boldlightpink);
--graph-fill-attachment: var(--royalblue);
--graph-circle-fill: var(--cornflower-blue);
--graph-circle-fill-highlight: var(--boldblue);
--graph-circle-fill-unresolved: #ffa6e5;
--graph-fill-tag: var(--boldorange);
--graph-arrow: var(--boldpink);
}
.theme-light{
/*----------------------------------------------------------------
LIGHT THEME GRAPH
----------------------------------------------------------------*/
--graph-line: var(--text-faint);
--graph-line-highlight: var(--fairpink);
--graph-circle-outline: var(--boldlightpink);
--graph-fill-attachment: var(--boldpurple);
--graph-circle-fill: var(--royalblue);
--graph-circle-fill-highlight: var(--boldblue);
--graph-circle-fill-unresolved: var(--boldpink);
--graph-fill-tag: var(--boldblue);
--graph-arrow: var(--boldpurple);
}
/*----------------------------------------------------------------
GRAPH CUSTOMIZATION
----------------------------------------------------------------*/
.theme-dark .graph-view.color-fill-tag {
color: var(--graph-fill-tag);
}
.theme-light .graph-view.color-fill-tag {
color: var(--graph-fill-tag);
}
.graph-view.color-fill-attachment {
color: var(--graph-fill-attachment) !important;
}
.graph-view.color-fill-unresolved {
color: var(--graph-circle-fill-unresolved);
opacity: 100%;
}
.graph-view.color-arrow {
color: var(--graph-arrow);
opacity: 70%;
}
.graph-view.color-line {
color: var(--graph-line);
opacity: 0.8;
}
.graph-view.color-line-highlight {
color: var(--graph-line-highlight);
}
.graph-view.color-fill {
color: var(--graph-circle-fill);
}
.graph-view.color-fill-highlight {
color: var(--graph-circle-fill-highlight);
}