Skip to content

Commit 6b4aa1a

Browse files
AriPerkkioAriPerkkio
committed
refactor: remove unused theme vars
1 parent 10e2a2e commit 6b4aa1a

1 file changed

Lines changed: 58 additions & 134 deletions

File tree

‎theme.css‎

Lines changed: 58 additions & 134 deletions
Original file line numberDiff line numberDiff line change
@@ -1,152 +1,76 @@
1+
/*
2+
* - Most colors are from VitePress and Vite docs site
3+
* - "--vpt" prefix stands for vite-plugin-tutorial
4+
*/
5+
16
:root[data-theme="light"] {
27
/* Light mode colors */
3-
--vp-c-gray-1: #dddde3;
4-
--vp-c-gray-2: #e4e4e9;
5-
--vp-c-gray-3: #ebebef;
6-
--vp-c-gray-soft: rgba(142, 150, 170, 0.14);
7-
8-
--vp-c-indigo-1: #3451b2;
9-
--vp-c-indigo-2: #3a5ccc;
10-
--vp-c-indigo-3: #5672cd;
11-
--vp-c-indigo-soft: rgba(100, 108, 255, 0.14);
12-
13-
--vp-c-purple-1: #6f42c1;
14-
--vp-c-purple-2: #7e4cc9;
15-
--vp-c-purple-3: #8e5cd9;
16-
--vp-c-purple-soft: rgba(159, 122, 234, 0.14);
17-
18-
--vp-c-green-1: #18794e;
19-
--vp-c-green-2: #299764;
20-
--vp-c-green-3: #30a46c;
21-
--vp-c-green-soft: rgba(16, 185, 129, 0.14);
22-
23-
--vp-c-yellow-1: #915930;
24-
--vp-c-yellow-2: #946300;
25-
--vp-c-yellow-3: #9f6a00;
26-
--vp-c-yellow-soft: rgba(234, 179, 8, 0.14);
27-
28-
--vp-c-red-1: #b8272c;
29-
--vp-c-red-2: #d5393e;
30-
--vp-c-red-3: #e0575b;
31-
--vp-c-red-soft: rgba(244, 63, 94, 0.14);
32-
33-
--vp-c-sponsor: #db2777;
34-
35-
--vp-c-bg: #ffffff;
36-
--vp-c-bg-alt: #f6f6f7;
37-
--vp-c-bg-elv: #ffffff;
38-
--vp-c-bg-soft: #f6f6f7;
39-
40-
--vp-c-border: #c2c2c4;
41-
--vp-c-divider: #e2e2e3;
42-
--vp-c-gutter: #e2e2e3;
43-
44-
--vp-c-text-1: rgba(60, 60, 67);
45-
--vp-c-text-2: rgba(60, 60, 67, 0.78);
46-
--vp-c-text-3: rgba(60, 60, 67, 0.56);
47-
48-
--vp-c-brand-1: var(--vp-c-indigo-1);
8+
--vpt-gray-soft: rgba(142, 150, 170, 0.14);
9+
--vpt-indigo-1: #3451b2;
10+
--vpt-bg: #ffffff;
11+
--vpt-bg-alt: #f6f6f7;
12+
--vpt-border: #c2c2c4;
13+
--vpt-text-1: rgba(60, 60, 67);
4914
}
5015

5116
:root[data-theme="dark"] {
5217
/* Dark mode colors */
53-
--vp-c-gray-1: #515c67;
54-
--vp-c-gray-2: #414853;
55-
--vp-c-gray-3: #32363f;
56-
--vp-c-gray-soft: rgba(101, 117, 133, 0.16);
57-
58-
--vp-c-indigo-1: #a8b1ff;
59-
--vp-c-indigo-2: #5c73e7;
60-
--vp-c-indigo-3: #3e63dd;
61-
--vp-c-indigo-soft: rgba(100, 108, 255, 0.16);
62-
63-
--vp-c-purple-1: #c8abfa;
64-
--vp-c-purple-2: #a879e6;
65-
--vp-c-purple-3: #8e5cd9;
66-
--vp-c-purple-soft: rgba(159, 122, 234, 0.16);
67-
68-
--vp-c-green-1: #3dd68c;
69-
--vp-c-green-2: #30a46c;
70-
--vp-c-green-3: #298459;
71-
--vp-c-green-soft: rgba(16, 185, 129, 0.16);
72-
73-
--vp-c-yellow-1: #f9b44e;
74-
--vp-c-yellow-2: #da8b17;
75-
--vp-c-yellow-3: #a46a0a;
76-
--vp-c-yellow-soft: rgba(234, 179, 8, 0.16);
77-
78-
--vp-c-red-1: #f66f81;
79-
--vp-c-red-2: #f14158;
80-
--vp-c-red-3: #b62a3c;
81-
--vp-c-red-soft: rgba(244, 63, 94, 0.16);
82-
83-
--vp-c-bg: #1b1b1f;
84-
--vp-c-bg-alt: #161618;
85-
--vp-c-bg-elv: #202127;
86-
--vp-c-bg-soft: #202127;
87-
88-
--vp-c-border: #3c3f44;
89-
--vp-c-divider: #2e2e32;
90-
--vp-c-gutter: #000000;
91-
92-
--vp-c-text-1: rgba(255, 255, 245, 0.86);
93-
--vp-c-text-2: rgba(235, 235, 245, 0.6);
94-
--vp-c-text-3: rgba(235, 235, 245, 0.38);
95-
96-
--vp-c-brand-1: var(--vp-c-indigo-1);
97-
--vp-c-brand-2: var(--vp-c-indigo-2);
98-
--vp-c-brand-3: var(--vp-c-indigo-3);
99-
--vp-c-brand-soft: var(--vp-c-indigo-soft);
18+
--vpt-gray-soft: rgba(101, 117, 133, 0.16);
19+
--vpt-indigo-1: #a8b1ff;
20+
--vpt-bg: #1b1b1f;
21+
--vpt-bg-alt: #161618;
22+
--vpt-border: #3c3f44;
23+
--vpt-text-1: rgba(255, 255, 245, 0.86);
10024
}
10125

10226
:root {
103-
--tk-elements-app-backgroundColor: var(--vp-c-bg);
104-
--tk-elements-app-textColor: var(--vp-c-text-1);
105-
--tk-elements-app-linkColor: var(--vp-c-brand-1);
106-
--tk-elements-app-borderColor: var(--vp-c-border);
107-
108-
--tk-elements-content-textColor: var(--vp-c-text-1);
109-
--tk-elements-content-headingTextColor: var(--vp-c-text-1);
110-
111-
--tk-elements-fileTree-backgroundColor: var(--vp-c-bg);
112-
--tk-elements-fileTree-file-backgroundColor: var(--vp-c-bg);
113-
--tk-elements-fileTree-file-textColor: var(--vp-c-brand-1);
114-
--tk-elements-fileTree-file-textColorSelected: var(--vp-c-brand-1);
115-
116-
--tk-elements-topBar-backgroundColor: var(--vp-c-bg);
117-
--tk-elements-topBar-iconButton-backgroundColor: var(--vp-c-bg);
118-
119-
--tk-elements-breadcrumbs-navButton-iconColor: var(--vp-c-brand-1);
120-
--tk-elements-breadcrumbs-toggleButton-backgroundColor: var(--vp-c-bg);
121-
--tk-elements-breadcrumbs-toggleButton-textDividerColor: var(--vp-c-brand-1);
122-
--tk-elements-breadcrumbs-toggleButton-iconColor: var(--vp-c-brand-1);
123-
--tk-elements-breadcrumbs-dropdown-backgroundColor: var(--vp-c-bg);
124-
125-
--tk-elements-navCard-backgroundColor: var(--vp-c-bg);
126-
--tk-elements-navCard-textColor: var(--vp-c-brand-1);
127-
--tk-elements-navCard-textColorHover: var(--vp-c-brand-1);
128-
--tk-elements-navCard-borderColorHover: var(--vp-c-brand-1);
129-
--tk-elements-navCard-iconColorHover: var(--vp-c-brand-1);
130-
131-
--tk-elements-editPageLink-textColor: var(--vp-c-brand-1);
132-
--tk-elements-editPageLink-textColorHover: var(--vp-c-brand-1);
133-
--tk-elements-editPageLink-iconColor: var(--vp-c-brand-1);
134-
--tk-elements-editPageLink-iconColorHover: var(--vp-c-brand-1);
135-
136-
--tk-elements-editor-backgroundColor: var(--vp-c-bg);
137-
--tk-elements-editor-gutter-textColor: var(--vp-c-brand-1);
138-
--tk-elements-editor-gutter-backgroundColor: var(--vp-c-bg);
27+
--tk-elements-app-backgroundColor: var(--vpt-bg);
28+
--tk-elements-app-textColor: var(--vpt-text-1);
29+
--tk-elements-app-linkColor: var(--vpt-indigo-1);
30+
--tk-elements-app-borderColor: var(--vpt-border);
31+
32+
--tk-elements-content-textColor: var(--vpt-text-1);
33+
--tk-elements-content-headingTextColor: var(--vpt-text-1);
34+
35+
--tk-elements-fileTree-backgroundColor: var(--vpt-bg);
36+
--tk-elements-fileTree-file-backgroundColor: var(--vpt-bg);
37+
--tk-elements-fileTree-file-textColor: var(--vpt-indigo-1);
38+
--tk-elements-fileTree-file-textColorSelected: var(--vpt-indigo-1);
39+
40+
--tk-elements-topBar-backgroundColor: var(--vpt-bg);
41+
--tk-elements-topBar-iconButton-backgroundColor: var(--vpt-bg);
42+
43+
--tk-elements-breadcrumbs-navButton-iconColor: var(--vpt-indigo-1);
44+
--tk-elements-breadcrumbs-toggleButton-backgroundColor: var(--vpt-bg);
45+
--tk-elements-breadcrumbs-toggleButton-textDividerColor: var(--vpt-indigo-1);
46+
--tk-elements-breadcrumbs-toggleButton-iconColor: var(--vpt-indigo-1);
47+
--tk-elements-breadcrumbs-dropdown-backgroundColor: var(--vpt-bg);
48+
49+
--tk-elements-navCard-backgroundColor: var(--vpt-bg);
50+
--tk-elements-navCard-textColor: var(--vpt-indigo-1);
51+
--tk-elements-navCard-textColorHover: var(--vpt-indigo-1);
52+
--tk-elements-navCard-borderColorHover: var(--vpt-indigo-1);
53+
--tk-elements-navCard-iconColorHover: var(--vpt-indigo-1);
54+
55+
--tk-elements-editPageLink-textColor: var(--vpt-indigo-1);
56+
--tk-elements-editPageLink-textColorHover: var(--vpt-indigo-1);
57+
--tk-elements-editPageLink-iconColor: var(--vpt-indigo-1);
58+
--tk-elements-editPageLink-iconColorHover: var(--vpt-indigo-1);
59+
60+
--tk-elements-editor-backgroundColor: var(--vpt-bg);
61+
--tk-elements-editor-gutter-textColor: var(--vpt-indigo-1);
62+
--tk-elements-editor-gutter-backgroundColor: var(--vpt-bg);
13963
/* Fallback for #98 */
140-
--ts-elements-editor-gutter-backgroundColor: var(--vp-c-bg);
64+
--ts-elements-editor-gutter-backgroundColor: var(--vpt-bg);
14165

14266
a {
143-
--link-color: var(--vp-c-brand-1);
67+
--link-color: var(--vpt-indigo-1);
14468
}
14569

14670
pre,
14771
code {
148-
--code-background: var(--vp-c-bg-alt);
149-
--code-background-color: var(--vp-c-gray-soft);
150-
--code-color: var(--vp-c-brand-1);
72+
--code-background: var(--vpt-bg-alt);
73+
--code-background-color: var(--vpt-gray-soft);
74+
--code-color: var(--vpt-indigo-1);
15175
}
15276
}

0 commit comments

Comments
 (0)