1 |
|
2 |
|
3 |
|
4 | .mermaid .label {
|
5 | color: #333;
|
6 | }
|
7 | .node rect,
|
8 | .node circle,
|
9 | .node ellipse,
|
10 | .node polygon {
|
11 | fill: #eee;
|
12 | stroke: #999;
|
13 | stroke-width: 1px;
|
14 | }
|
15 | .edgePath .path {
|
16 | stroke: #666;
|
17 | stroke-width: 1.5px;
|
18 | }
|
19 | .edgeLabel {
|
20 | background-color: white;
|
21 | }
|
22 | .cluster rect {
|
23 | fill: #eaf2fb !important;
|
24 | rx: 4 !important;
|
25 | stroke: #26a !important;
|
26 | stroke-width: 1px !important;
|
27 | }
|
28 | .cluster text {
|
29 | fill: #333;
|
30 | }
|
31 | .actor {
|
32 | stroke: #999;
|
33 | fill: #eee;
|
34 | }
|
35 | text.actor {
|
36 | fill: #333;
|
37 | stroke: none;
|
38 | }
|
39 | .actor-line {
|
40 | stroke: #666;
|
41 | }
|
42 | .messageLine0 {
|
43 | stroke-width: 1.5;
|
44 | stroke-dasharray: "2 2";
|
45 | marker-end: "url(#arrowhead)";
|
46 | stroke: #333;
|
47 | }
|
48 | .messageLine1 {
|
49 | stroke-width: 1.5;
|
50 | stroke-dasharray: "2 2";
|
51 | stroke: #333;
|
52 | }
|
53 | #arrowhead {
|
54 | fill: #333;
|
55 | }
|
56 | #crosshead path {
|
57 | fill: #333 !important;
|
58 | stroke: #333 !important;
|
59 | }
|
60 | .messageText {
|
61 | fill: #333;
|
62 | stroke: none;
|
63 | }
|
64 | .labelBox {
|
65 | stroke: #999;
|
66 | fill: #eee;
|
67 | }
|
68 | .labelText {
|
69 | fill: white;
|
70 | stroke: none;
|
71 | }
|
72 | .loopText {
|
73 | fill: white;
|
74 | stroke: none;
|
75 | }
|
76 | .loopLine {
|
77 | stroke-width: 2;
|
78 | stroke-dasharray: "2 2";
|
79 | marker-end: "url(#arrowhead)";
|
80 | stroke: #999;
|
81 | }
|
82 | .note {
|
83 | stroke: #777700;
|
84 | fill: #ffa;
|
85 | }
|
86 | .noteText {
|
87 | fill: black;
|
88 | stroke: none;
|
89 | font-family: Arial, Helvetica, sans-serif;
|
90 | font-size: 14px;
|
91 | }
|
92 |
|
93 | .section {
|
94 | stroke: none;
|
95 | opacity: 0.2;
|
96 | }
|
97 | .section0 {
|
98 | fill: #7fb2e6;
|
99 | }
|
100 | .section2 {
|
101 | fill: #7fb2e6;
|
102 | }
|
103 | .section1,
|
104 | .section3 {
|
105 | fill: white;
|
106 | opacity: 0.2;
|
107 | }
|
108 | .sectionTitle0 {
|
109 | fill: #333;
|
110 | }
|
111 | .sectionTitle1 {
|
112 | fill: #333;
|
113 | }
|
114 | .sectionTitle2 {
|
115 | fill: #333;
|
116 | }
|
117 | .sectionTitle3 {
|
118 | fill: #333;
|
119 | }
|
120 | .sectionTitle {
|
121 | text-anchor: start;
|
122 | font-size: 11px;
|
123 | text-height: 14px;
|
124 | }
|
125 |
|
126 | .grid .tick {
|
127 | stroke: #e5e5e5;
|
128 | opacity: 0.3;
|
129 | shape-rendering: crispEdges;
|
130 | }
|
131 | .grid path {
|
132 | stroke-width: 0;
|
133 | }
|
134 |
|
135 | .today {
|
136 | fill: none;
|
137 | stroke: #d42;
|
138 | stroke-width: 2px;
|
139 | }
|
140 |
|
141 |
|
142 | .task {
|
143 | stroke-width: 2;
|
144 | }
|
145 | .taskText {
|
146 | text-anchor: middle;
|
147 | font-size: 11px;
|
148 | }
|
149 | .taskTextOutsideRight {
|
150 | fill: #333;
|
151 | text-anchor: start;
|
152 | font-size: 11px;
|
153 | }
|
154 | .taskTextOutsideLeft {
|
155 | fill: #333;
|
156 | text-anchor: end;
|
157 | font-size: 11px;
|
158 | }
|
159 |
|
160 | .taskText0,
|
161 | .taskText1,
|
162 | .taskText2,
|
163 | .taskText3 {
|
164 | fill: white;
|
165 | }
|
166 | .task0,
|
167 | .task1,
|
168 | .task2,
|
169 | .task3 {
|
170 | fill: #26a;
|
171 | stroke: #194c7f;
|
172 | }
|
173 | .taskTextOutside0,
|
174 | .taskTextOutside2 {
|
175 | fill: #333;
|
176 | }
|
177 | .taskTextOutside1,
|
178 | .taskTextOutside3 {
|
179 | fill: #333;
|
180 | }
|
181 |
|
182 | .active0,
|
183 | .active1,
|
184 | .active2,
|
185 | .active3 {
|
186 | fill: #eee;
|
187 | stroke: #194c7f;
|
188 | }
|
189 | .activeText0,
|
190 | .activeText1,
|
191 | .activeText2,
|
192 | .activeText3 {
|
193 | fill: #333 !important;
|
194 | }
|
195 |
|
196 | .done0,
|
197 | .done1,
|
198 | .done2,
|
199 | .done3 {
|
200 | stroke: #666;
|
201 | fill: #bbb;
|
202 | stroke-width: 2;
|
203 | }
|
204 | .doneText0,
|
205 | .doneText1,
|
206 | .doneText2,
|
207 | .doneText3 {
|
208 | fill: #333 !important;
|
209 | }
|
210 |
|
211 | .crit0,
|
212 | .crit1,
|
213 | .crit2,
|
214 | .crit3 {
|
215 | stroke: #b1361b;
|
216 | fill: #d42;
|
217 | stroke-width: 2;
|
218 | }
|
219 | .activeCrit0,
|
220 | .activeCrit1,
|
221 | .activeCrit2,
|
222 | .activeCrit3 {
|
223 | stroke: #b1361b;
|
224 | fill: #eee;
|
225 | stroke-width: 2;
|
226 | }
|
227 | .doneCrit0,
|
228 | .doneCrit1,
|
229 | .doneCrit2,
|
230 | .doneCrit3 {
|
231 | stroke: #b1361b;
|
232 | fill: #bbb;
|
233 | stroke-width: 2;
|
234 | cursor: pointer;
|
235 | }
|
236 | .doneCritText0,
|
237 | .doneCritText1,
|
238 | .doneCritText2,
|
239 | .doneCritText3 {
|
240 | fill: #333 !important;
|
241 | }
|
242 | .activeCritText0,
|
243 | .activeCritText1,
|
244 | .activeCritText2,
|
245 | .activeCritText3 {
|
246 | fill: #333 !important;
|
247 | }
|
248 | .titleText {
|
249 | text-anchor: middle;
|
250 | font-size: 18px;
|
251 | fill: #333;
|
252 | }
|
253 | g.classGroup text {
|
254 | fill: #999;
|
255 | stroke: none;
|
256 | font-family: 'trebuchet ms', verdana, arial;
|
257 | font-size: 10px;
|
258 | }
|
259 | g.classGroup rect {
|
260 | fill: #eee;
|
261 | stroke: #999;
|
262 | }
|
263 | g.classGroup line {
|
264 | stroke: #999;
|
265 | stroke-width: 1;
|
266 | }
|
267 | svg .classLabel .box {
|
268 | stroke: none;
|
269 | stroke-width: 0;
|
270 | fill: #eee;
|
271 | opacity: 0.5;
|
272 | }
|
273 | svg .classLabel .label {
|
274 | fill: #999;
|
275 | font-size: 10px;
|
276 | }
|
277 | .relation {
|
278 | stroke: #999;
|
279 | stroke-width: 1;
|
280 | fill: none;
|
281 | }
|
282 | .composition {
|
283 | fill: #999;
|
284 | stroke: #999;
|
285 | stroke-width: 1;
|
286 | }
|
287 | #compositionStart {
|
288 | fill: #999;
|
289 | stroke: #999;
|
290 | stroke-width: 1;
|
291 | }
|
292 | #compositionEnd {
|
293 | fill: #999;
|
294 | stroke: #999;
|
295 | stroke-width: 1;
|
296 | }
|
297 | .aggregation {
|
298 | fill: #eee;
|
299 | stroke: #999;
|
300 | stroke-width: 1;
|
301 | }
|
302 | #aggregationStart {
|
303 | fill: #eee;
|
304 | stroke: #999;
|
305 | stroke-width: 1;
|
306 | }
|
307 | #aggregationEnd {
|
308 | fill: #eee;
|
309 | stroke: #999;
|
310 | stroke-width: 1;
|
311 | }
|
312 | #dependencyStart {
|
313 | fill: #999;
|
314 | stroke: #999;
|
315 | stroke-width: 1;
|
316 | }
|
317 | #dependencyEnd {
|
318 | fill: #999;
|
319 | stroke: #999;
|
320 | stroke-width: 1;
|
321 | }
|
322 | #extensionStart {
|
323 | fill: #999;
|
324 | stroke: #999;
|
325 | stroke-width: 1;
|
326 | }
|
327 | #extensionEnd {
|
328 | fill: #999;
|
329 | stroke: #999;
|
330 | stroke-width: 1;
|
331 | }
|
332 | .node text {
|
333 | font-family: Arial, Helvetica, sans-serif;
|
334 | font-size: 14px;
|
335 | }
|
336 | div.mermaidTooltip {
|
337 | position: absolute;
|
338 | text-align: center;
|
339 | max-width: 200px;
|
340 | padding: 2px;
|
341 | font-family: Arial, Helvetica, sans-serif;
|
342 | font-size: 12px;
|
343 | background: #eaf2fb;
|
344 | border: 1px solid #26a;
|
345 | border-radius: 2px;
|
346 | pointer-events: none;
|
347 | z-index: 100;
|
348 | }
|