Skip to content

Commit 9b48e8f

Browse files
committed
docs: update syntax colors
1 parent 47020b9 commit 9b48e8f

File tree

1 file changed

+163
-159
lines changed

1 file changed

+163
-159
lines changed

packages/docs/src/styles/_prism.scss

Lines changed: 163 additions & 159 deletions
Original file line numberDiff line numberDiff line change
@@ -6,163 +6,167 @@ https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+cli
66
* @author Rose Pritchard
77
*/
88

9-
:root,
10-
[data-coreui-theme="light"] {
11-
// --base00: #fff;
12-
// --base01: #f5f5f5;
13-
--base02: #c8c8fa;
14-
--base03: #565c64;
15-
--base04: #666;
16-
--base05: #333;
17-
--base06: #fff;
18-
--base07: #{$teal-700}; // #9a6700
19-
--base08: #{mix($red-500, $red-600, 50%)}; // #bc4c00
20-
--base09: #{$cyan-700}; // #087990
21-
--base0A: #{$purple-500}; // #795da3
22-
--base0B: #{$blue-700}; // #183691
23-
--base0C: #{$blue-700}; // #183691
24-
--base0D: #{$purple-500}; // #795da3
25-
--base0E: #{$pink-600}; // #a71d5d
26-
--base0F: #333;
9+
:root,
10+
[data-coreui-theme="light"] {
11+
// --base00: #fff;
12+
// --base01: #f5f5f5;
13+
--base02: #c8c8fa;
14+
--base03: #565c64;
15+
--base04: #666;
16+
--base05: #333;
17+
--base06: #fff;
18+
--base07: #{$teal-700}; // #9a6700
19+
--base08: #{mix($red-500, $red-600, 50%)}; // #bc4c00
20+
--base09: #{$cyan-700}; // #087990
21+
--base0A: #{$purple-500}; // #795da3
22+
--base0B: #{$blue-700}; // #183691
23+
--base0C: #{$blue-700}; // #183691
24+
--base0D: #{$purple-500}; // #795da3
25+
--base0E: #{$pink-600}; // #a71d5d
26+
--base0F: #333;
2727
}
28-
29-
@include color-mode(dark, true) {
30-
// --base00: #282c34;
31-
// --base01: #353b45;
32-
--base02: #3e4451;
33-
--base03: #868e96;
34-
--base04: #868e96;
35-
--base05: #abb2bf;
36-
--base06: #b6bdca;
37-
--base07: #{$orange-300}; // #d19a66
38-
--base08: #{$cyan-300};
39-
--base09: #{$orange-300}; // #d19a66
40-
--base0A: #{$yellow-200}; // #e5c07b
41-
--base0B: #{$teal-300}; // #98c379
42-
--base0C: #{$teal-300}; // #56b6c2
43-
--base0D: #{$blue-300}; // #61afef
44-
--base0E: #{$indigo-200}; // #c678dd
45-
--base0F: #{$red-300}; // #be5046
46-
47-
.language-diff .gd {
48-
color: $red-400;
49-
}
50-
.language-diff .gi {
51-
color: $green-400;
52-
}
53-
}
54-
55-
code[class*='language-'],
56-
pre[class*='language-'] {
57-
background: none;
58-
font-family: var(--cui-font-monospace);
59-
font-size: .875em;
60-
text-align: left;
61-
white-space: pre;
62-
63-
-moz-tab-size: 4;
64-
-o-tab-size: 4;
65-
tab-size: 4;
66-
67-
-webkit-hyphens: none;
68-
-moz-hyphens: none;
69-
-ms-hyphens: none;
70-
hyphens: none;
71-
}
72-
73-
pre[class*='language-']:not(.language-sass):not(.language-text):not(.language-css) {
74-
overflow: scroll;
75-
max-height: 500px;
76-
}
77-
78-
.token.comment,
79-
.token.block-comment,
80-
.token.prolog,
81-
.token.doctype,
82-
.token.cdata {
83-
color: var(--base03);
84-
}
85-
86-
.token.tag {
87-
color: var(--base08);
88-
}
89-
90-
.token.attr-name,
91-
.token.namespace,
92-
.token.deleted {
93-
color: var(--base0A);
94-
}
95-
96-
.token.punctuation {
97-
color: var(--base05);
98-
}
99-
100-
.token.function-name {
101-
color: var(--base0A);
102-
}
103-
104-
.token.boolean,
105-
.token.number,
106-
.token.function {
107-
color: var(--base09);
108-
}
109-
110-
.token.property,
111-
.token.class-name,
112-
.token.constant,
113-
.token.symbol {
114-
color: var(--base0A);
115-
}
116-
117-
.token.selector,
118-
.token.important,
119-
.token.atrule,
120-
.token.keyword,
121-
.token.builtin {
122-
color: var(--base0E);
123-
}
124-
125-
.token.string,
126-
.token.char,
127-
.token.attr-value,
128-
.token.regex,
129-
.token.variable {
130-
color: var(--base0C);
131-
}
132-
133-
.token.operator,
134-
.token.entity,
135-
.token.url {
136-
color: var(--base05);
137-
}
138-
139-
.token.important,
140-
.token.bold {
141-
font-weight: bold;
142-
}
143-
.token.italic {
144-
font-style: italic;
145-
}
146-
147-
.token.entity {
148-
cursor: help;
149-
}
150-
151-
.token.inserted {
152-
color: green;
153-
}
154-
155-
.language-bash,
156-
.language-sh {
157-
.token-line::before {
158-
color: var(--base03);
159-
content: "$ ";
160-
user-select: none;
161-
}
162-
}
163-
164-
.language-powershell::before {
165-
color: var(--base0C);
166-
content: "PM> ";
167-
user-select: none;
168-
}
28+
29+
@include color-mode(dark, true) {
30+
// --base00: #282c34;
31+
// --base01: #353b45;
32+
--base02: #3e4451;
33+
--base03: #868e96;
34+
--base04: #868e96;
35+
--base05: #abb2bf;
36+
--base06: #b6bdca;
37+
--base07: #{$orange-300}; // #d19a66
38+
--base08: #{$cyan-300};
39+
--base09: #{$orange-300}; // #d19a66
40+
--base0A: #{$yellow-200}; // #e5c07b
41+
--base0B: #{$teal-300}; // #98c379
42+
--base0C: #{$teal-300}; // #56b6c2
43+
--base0D: #{$blue-300}; // #61afef
44+
--base0E: #{$indigo-200}; // #c678dd
45+
--base0F: #{$red-300}; // #be5046
46+
47+
.language-diff .gd {
48+
color: $red-400;
49+
}
50+
.language-diff .gi {
51+
color: $green-400;
52+
}
53+
}
54+
55+
code[class*='language-'],
56+
pre[class*='language-'] {
57+
background: none;
58+
font-family: var(--cui-font-monospace);
59+
font-size: .875em;
60+
text-align: left;
61+
white-space: pre;
62+
63+
-moz-tab-size: 4;
64+
-o-tab-size: 4;
65+
tab-size: 4;
66+
67+
-webkit-hyphens: none;
68+
-moz-hyphens: none;
69+
-ms-hyphens: none;
70+
hyphens: none;
71+
}
72+
73+
pre[class*='language-']:not(.language-sass):not(.language-text):not(.language-css) {
74+
overflow: scroll;
75+
max-height: 500px;
76+
}
77+
78+
.token.comment,
79+
.token.block-comment,
80+
.token.prolog,
81+
.token.doctype,
82+
.token.cdata {
83+
color: var(--base03);
84+
}
85+
86+
.token.tag {
87+
color: var(--base08);
88+
}
89+
90+
.token.attr-name,
91+
.token.namespace,
92+
.token.deleted {
93+
color: var(--base0A);
94+
}
95+
96+
.token.punctuation {
97+
color: var(--base05);
98+
}
99+
100+
.token.function-name {
101+
color: var(--base0A);
102+
}
103+
104+
.token.boolean,
105+
.token.number,
106+
.token.function {
107+
color: var(--base09);
108+
}
109+
110+
.token.class-name,
111+
.token.maybe-class-name {
112+
color: var(--base08);
113+
}
114+
115+
.token.property,
116+
.token.constant,
117+
.token.symbol {
118+
color: var(--base0A);
119+
}
120+
121+
.token.selector,
122+
.token.important,
123+
.token.atrule,
124+
.token.keyword,
125+
.token.builtin {
126+
color: var(--base0E);
127+
}
128+
129+
.token.string,
130+
.token.char,
131+
.token.attr-value,
132+
.token.regex,
133+
.token.variable {
134+
color: var(--base0C);
135+
}
136+
137+
.token.operator,
138+
.token.entity,
139+
.token.url {
140+
color: var(--base05);
141+
}
142+
143+
.token.important,
144+
.token.bold {
145+
font-weight: bold;
146+
}
147+
.token.italic {
148+
font-style: italic;
149+
}
150+
151+
.token.entity {
152+
cursor: help;
153+
}
154+
155+
.token.inserted {
156+
color: green;
157+
}
158+
159+
.language-bash,
160+
.language-sh {
161+
.token-line::before {
162+
color: var(--base03);
163+
content: "$ ";
164+
user-select: none;
165+
}
166+
}
167+
168+
.language-powershell::before {
169+
color: var(--base0C);
170+
content: "PM> ";
171+
user-select: none;
172+
}

0 commit comments

Comments
 (0)