• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1:root {
2  --code-font: Consolas, Monaco, Menlo, monospace;
3  --background-color: #000000;
4  --surface-color-rgb: 18, 18, 18;
5  --surface-color: rgb(var(--surface-color-rgb));
6  --primary-color: #bb86fc;
7  --secondary-color: #03dac6;
8  --on-surface-color: #ffffff;
9  --on-background-color: #f5f0f0;
10  --on-primary-color: #000000;
11  --on-secondary-color: #000000;
12  --default-color: #9b6edc;
13  --error-color: #cf6679;
14  --map-background-color: #5e5454;
15  --timeline-background-color: #1f1f1f;
16  --file-reader-background-color: #ffffff80;
17  --file-reader-border-color: #ffffff;
18  --red: #dc6eae;
19  --green: #aedc6e;
20  --yellow: #eeff41;
21  --blue: #6e77dc;
22  --orange: #dc9b6e;
23  --violet: #d26edc;
24  --border-color-rgb: 128, 128, 128;
25  --border-color: rgba(var(--border-color-rgb), 0.2);
26  scrollbar-color:  rgba(128, 128, 128, 0.5)  rgba(0, 0, 0, 0.0);
27}
28
29::-webkit-scrollbar, ::-webkit-scrollbar-track, ::-webkit-scrollbar-corner {
30  background-color: rgba(0, 0, 0, 0.0);
31}
32::-webkit-scrollbar, ::-webkit-scrollbar-track {
33  width: 10px;
34  height: 10px;
35}
36::-webkit-scrollbar-thumb {
37  background-color: rgba(128, 128, 128, 0.5);
38  border-radius: 8px;
39  cursor: pointer;
40}
41::-webkit-scrollbar-thumb:hover {
42  background-color: rgba(128, 128, 128, 0.8);
43}
44
45body {
46  font-family: sans-serif;
47  font-size: 14px;
48  color: var(--on-background-color);
49  margin: 10px 10px 0 10px;
50  background-color: var(--background-color);
51}
52
53h3 {
54  margin-block-end: 0.3em;
55}
56
57section {
58  margin-bottom: 10px;
59}
60
61kbd {
62  color: var(--on-primary-color);
63  background-color: var(--primary-color);
64  border-radius: 3px;
65  border: 1px solid var(--on-primary-color);
66  display: inline-block;
67  font-size: .9em;
68  font-weight: bold;
69  padding: 0px 4px 2px 4px;
70  white-space: nowrap;
71}
72
73kbd, code, pre {
74  font-family: var(--code-font);
75}
76
77a {
78  color: var(--primary-color);
79  text-decoration: none;
80}
81a:hover {
82  color: var(--secondary-color);
83}
84a:link {
85  color: var(--secondary-color);
86}
87
88dl {
89  display: grid;
90  grid-template-columns: min-content auto;
91  grid-gap: 5px;
92}
93dt {
94  text-align: right;
95  white-space: nowrap;
96}
97dd {
98  margin: 0;
99}
100
101.panel {
102  background-color: var(--surface-color);
103  color: var(--on-surface-color);
104  padding: 10px;
105  border-radius: 10px;
106  border: 3px solid var(--border-color);
107  overflow: hidden;
108}
109
110.panelBody {
111  position: relative;
112  max-height: 800px;
113  overflow-y: scroll;
114  margin: 0 -10px -10px 0;
115}
116
117.panel > h2, .panelTitle {
118  margin: -10px -10px 0 -10px;
119  padding: 5px 10px 5px 10px;
120  background-color: var(--border-color);
121  border-radius: 7px 7px 0 0;
122  font-weight: 400;
123}
124
125.panel > select {
126  width: calc(100% + 20px);
127  margin: 0 -10px 10px -10px;
128}
129
130.panel > .selection {
131  display: flex;
132  margin: 0 -10px 0 -10px;
133}
134.panel > .selection input {
135  display: none;
136}
137
138.panel > .selection label {
139  flex: 1;
140  padding: 5px;
141  cursor: pointer;
142  background-color: var( --surface-color);
143  font-weight: normal;
144  text-align: center;
145}
146.panel > .selection label ~ label {
147  border-left: 2px var(--border-color) solid;
148}
149
150.panel > .selection label:hover {
151  background-color: var(--primary-color);
152}
153.panel > .selection [type=radio]:checked + label {
154  background-color: var(--border-color);
155}
156
157.panel > .selection  select {
158  flex: 1;
159  width: 50%;
160}
161
162button {
163  cursor: pointer;
164}
165input,
166select,
167button {
168  background-color: var(--surface-color);
169  color: var(--on-surface-color);
170  border: 2px solid rgba(var(--border-color-rgb), 0.4);
171  border-radius: 5px;
172  padding: 2px;
173}
174input:hover,
175select:hover,
176button:hover {
177  border: 2px solid rgba(var(--border-color-rgb), 0.6);
178}
179
180.colorbox {
181  display: inline-block;
182  width: 8px;
183  height: 8px;
184  border: 2px var(--background-color) solid;
185  border-radius: 50%;
186}
187
188.primary {
189  background-color: var(--default-color);
190}
191
192.red {
193  background-color: var(--red);
194}
195
196.green {
197  background-color: var(--green);
198}
199
200.yellow {
201  background-color: var(--yellow);
202  color: var(--map-background-color);
203}
204
205.blue {
206  background-color: var(--blue);
207}
208
209.orange {
210  background-color: var(--orange);
211}
212
213.violet {
214  background-color: var(--violet);
215  color: var(--map-background-color);
216}
217
218.success {
219  background-color: var(--secondary-color);
220}
221
222.failure {
223  background-color: var(--error-color);
224}
225
226.highlight {
227  background-color: var(--primary-color);
228  color: var(--on-primary-color);
229}
230
231button:hover,
232.clickable:hover,
233.mark:hover,
234.clickable:active,
235.mark:active {
236  border-radius: 3px;
237  background-color: var(--primary-color);
238  color: var(--on-primary-color);
239  cursor: pointer;
240}
241
242
243.legend {
244  position: absolute;
245  right: 0px;
246  top: 0px;
247  background-color: var(--surface-color);
248  border-radius: 5px;
249  border: 3px solid var(--border-color);
250  padding: 0 10px 0 10px;
251}
252.legend dt  {
253  font-family: var(--code-font);
254}
255.legend h3 {
256  margin-top: 10px;
257}
258
259.panelCloserLabel {
260  float: left;
261  cursor: zoom-out;
262  margin: 0 5px 0 0;
263  transition: transform 0.2s ease-out;
264  user-select: none;
265}
266.panelCloserInput {
267  display: none;
268}
269.panel .panelCloserInput:checked ~ .panelCloserLabel,
270.panelCloserInput:checked ~ .panelCloserLabel {
271  cursor: zoom-in;
272  transform: rotate(-90deg);
273  display: inherit;
274}
275.panel .panelCloserInput:checked ~ h2 {
276  display: inherit;
277  border-radius: 7px;
278  margin-bottom: -20px;
279  padding-bottom: 10px;
280}
281.panelCloserInput:checked ~ * {
282  display: none;
283}
284