dotfiles
My PC Dotfiles & Websitegit clone https://github.com/maydayv7/dotfiles
site/sass/_syntax.scss (6136B)
1@import "variables";
2
3// Giallo structural classes
4.giallo-l {
5 display: inline-block;
6 min-height: 1lh;
7 width: 100%;
8}
9
10.giallo-ln {
11 display: inline-block;
12 user-select: none;
13 margin-right: 0.4em;
14 padding: 0.4em;
15 min-width: 3ch;
16 text-align: right;
17 opacity: 0.8;
18}
19
20// Base code block
21.z-code {
22 color: var(--color);
23 background-color: var(--accent-alpha-20);
24}
25
26// Highlighted lines
27.z-hl {
28 background-color: var(--accent-alpha-20);
29}
30
31// Comments
32.highlight .c,
33.highlight .ch,
34.highlight .cm,
35.highlight .cp,
36.highlight .cpf,
37.highlight .c1,
38.highlight .cs,
39.z-comment {
40 color: var(--color);
41 opacity: 0.6;
42 font-style: italic;
43}
44
45// Keywords
46.highlight .k,
47.highlight .kd,
48.highlight .kn,
49.highlight .kp,
50.highlight .kr,
51.highlight .kt,
52.highlight .o,
53.highlight .ow,
54.z-keyword {
55 color: var(--accent-alpha-70);
56}
57
58// Storage
59.z-storage {
60 color: var(--accent);
61}
62
63.z-storage.z-type {
64 color: var(--accent-secondary);
65}
66
67.z-storage.z-modifier {
68 color: var(--accent);
69 font-weight: bold;
70}
71
72// Constants
73.highlight .m,
74.highlight .mb,
75.highlight .mf,
76.highlight .mh,
77.highlight .mi,
78.highlight .il,
79.highlight .mo,
80.z-constant {
81 color: var(--accent-alpha-70);
82}
83
84.z-constant.z-character {
85 color: var(--accent-secondary-alpha-70);
86 font-weight: bold;
87}
88
89// Strings
90.highlight .s,
91.highlight .sa,
92.highlight .sb,
93.highlight .sc,
94.highlight .dl,
95.highlight .sd,
96.highlight .s2,
97.highlight .se,
98.highlight .sh,
99.highlight .si,
100.highlight .sx,
101.highlight .sr,
102.highlight .s1,
103.highlight .ss,
104.z-string {
105 color: var(--color);
106}
107
108.z-string.highlight .c,
109.highlight .ch,
110.highlight .cm,
111.highlight .cp,
112.highlight .cpf,
113.highlight .c1,
114.highlight .cs,
115.z-comment {
116 color: var(--color);
117 opacity: 0.6;
118}
119
120.z-string.z-regexp {
121 color: var(--accent-secondary-alpha-70);
122}
123
124// Variables
125.highlight .nv,
126.highlight .vc,
127.highlight .vg,
128.highlight .vi,
129.z-variable {
130 color: var(--accent-secondary);
131 font-weight: bold;
132}
133
134.z-variable.z-language {
135 color: var(--accent);
136}
137
138.z-variable.z-other {
139 color: var(--color);
140}
141
142.z-variable.z-other.z-constant,
143.z-variable.z-other.z-enummember {
144 color: var(--accent-secondary-alpha-70);
145 font-weight: bold;
146}
147
148.z-variable.z-parameter {
149 color: var(--color);
150}
151
152.z-variable.z-parameter.z-function {
153 color: var(--color);
154}
155
156// Entities
157.z-entity {
158 color: var(--accent-secondary-alpha-70);
159}
160
161.highlight .nc,
162.highlight .no,
163.highlight .nd,
164.highlight .ne,
165.highlight .nl,
166.highlight .nf,
167.highlight .fm,
168.z-entity.z-name {
169 color: var(--accent-secondary-alpha-70);
170 font-weight: bold;
171}
172
173.highlight .nt,
174.z-entity.z-name.z-tag {
175 color: var(--accent-alpha-70);
176 font-weight: normal;
177}
178
179.z-entity.z-name.highlight .m,
180.highlight .mb,
181.highlight .mf,
182.highlight .mh,
183.highlight .mi,
184.highlight .il,
185.highlight .mo,
186.z-constant {
187 color: var(--accent-secondary-alpha-70);
188 font-weight: bold;
189}
190
191.highlight .na,
192.z-entity.z-other.z-attribute-name {
193 color: var(--accent-secondary);
194 font-style: italic;
195}
196
197// Support
198.z-support {
199 color: var(--accent-alpha-70);
200}
201
202.z-support.highlight .m,
203.highlight .mb,
204.highlight .mf,
205.highlight .mh,
206.highlight .mi,
207.highlight .il,
208.highlight .mo,
209.z-constant {
210 color: var(--accent-alpha-70);
211}
212
213.z-support.highlight .nv,
214.highlight .vc,
215.highlight .vg,
216.highlight .vi,
217.z-variable {
218 color: var(--accent-secondary);
219}
220
221.z-support.z-type,
222.z-support.z-class {
223 color: var(--color);
224}
225
226// Punctuation
227.z-punctuation.z-definition.highlight .s,
228.highlight .sa,
229.highlight .sb,
230.highlight .sc,
231.highlight .dl,
232.highlight .sd,
233.highlight .s2,
234.highlight .se,
235.highlight .sh,
236.highlight .si,
237.highlight .sx,
238.highlight .sr,
239.highlight .s1,
240.highlight .ss,
241.z-string {
242 color: var(--color);
243}
244
245.z-punctuation.z-definition.highlight .c,
246.highlight .ch,
247.highlight .cm,
248.highlight .cp,
249.highlight .cpf,
250.highlight .c1,
251.highlight .cs,
252.z-comment {
253 color: var(--color);
254 opacity: 0.6;
255}
256
257.z-punctuation.z-definition.z-tag {
258 color: var(--accent);
259 font-weight: bold;
260}
261
262.z-punctuation.z-definition.highlight .nv,
263.highlight .vc,
264.highlight .vg,
265.highlight .vi,
266.z-variable {
267 color: var(--accent-secondary-alpha-70);
268}
269
270.z-punctuation.z-separator.z-key-value {
271 color: var(--accent-alpha-70);
272 font-weight: bold;
273}
274
275.z-punctuation.z-definition.z-deleted {
276 color: var(--accent);
277}
278
279.z-punctuation.z-definition.z-inserted {
280 color: var(--accent-secondary);
281}
282
283// Meta
284.z-meta.z-property-name {
285 color: var(--accent-secondary);
286}
287
288.z-meta.z-module-reference {
289 color: var(--accent-secondary-alpha-70);
290 font-weight: bold;
291}
292
293.z-meta.z-separator {
294 color: var(--accent-alpha-70);
295 font-weight: bold;
296}
297
298// Source
299.z-source {
300 color: var(--color);
301}
302
303.z-source.z-regexp {
304 color: var(--accent-secondary-alpha-70);
305}
306
307// Invalid
308.z-invalid {
309 color: var(--color);
310 background-color: var(--accent-secondary);
311}
312
313.z-invalid.z-broken,
314.z-invalid.z-deprecated,
315.z-invalid.z-illegal,
316.z-invalid.z-unimplemented {
317 color: var(--color);
318 background-color: transparent;
319}
320
321// Markup
322.z-markup.z-heading {
323 color: var(--accent-secondary);
324 font-weight: bold;
325}
326
327.z-markup.z-quote {
328 color: var(--accent-secondary-alpha-70);
329}
330
331.z-markup.z-italic {
332 font-style: italic;
333}
334
335.z-markup.z-bold {
336 font-weight: bold;
337}
338
339.z-markup.z-underline {
340 text-decoration: underline;
341}
342
343.z-markup.z-strikethrough {
344 text-decoration: line-through;
345}
346
347.highlight .gd,
348.z-markup.z-deleted {
349 color: var(--accent);
350}
351
352.highlight .gi,
353.z-markup.z-inserted {
354 color: var(--accent-secondary);
355}
356
357.z-markup.z-changed {
358 color: var(--accent-alpha-70);
359}
360
361.z-markup.z-inline.z-raw {
362 color: var(--accent-secondary-alpha-70);
363}
364
365// Diff
366.z-meta.z-diff.z-range {
367 color: var(--accent-secondary);
368 font-weight: bold;
369}
370
371.z-meta.z-diff.z-header {
372 color: var(--accent-secondary-alpha-70);
373}
374
375.z-meta.z-diff.z-header.z-from-file {
376 color: var(--accent);
377}
378
379.z-meta.z-diff.z-header.z-to-file {
380 color: var(--accent-secondary);
381}
382
383// Misc
384.z-carriage-return {
385 color: var(--background);
386 background-color: var(--accent);
387 font-style: italic;
388 text-decoration: underline;
389}
390
391.z-message.z-error {
392 color: var(--accent);
393}