Skip to content

Commit 7769a9a

Browse files
RalphHightowerRalphHightower
authored
Add files via upload
1 parent 283b9f7 commit 7769a9a

File tree

1 file changed

+361
-0
lines changed

1 file changed

+361
-0
lines changed

‎_sass/minima/skins/auto.scss‎

Lines changed: 361 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,361 @@
1+
@charset "utf-8";
2+
3+
// Default color scheme settings
4+
// These are overridden in classic.css and dark.scss
5+
6+
$color-scheme-auto: true !default;
7+
$color-scheme-dark: false !default;
8+
9+
10+
// Light mode
11+
// ----------
12+
13+
$lm-brand-color: #73000a !default;
14+
$lm-brand-color-light: lighten($lm-brand-color, 40%) !default;
15+
$lm-brand-color-dark: darken($lm-brand-color, 25%) !default;
16+
17+
$lm-site-title-color: $lm-brand-color-dark !default;
18+
19+
$lm-text-color: #363636 !default;
20+
$lm-background-color: #fdfdfd !default;
21+
$lm-code-background-color: #eeeeff !default;
22+
23+
$lm-link-base-color: #73000a !default;
24+
$lm-link-visited-color: darken($lm-link-base-color, 15%) !default;
25+
$lm-link-hover-color: $lm-text-color !default;
26+
27+
$lm-border-color-01: $lm-brand-color-light !default;
28+
$lm-border-color-02: lighten($lm-brand-color, 35%) !default;
29+
$lm-border-color-03: $lm-brand-color-dark !default;
30+
31+
$lm-table-text-color: #73000a !default;
32+
$lm-table-zebra-color: #fff2e3 !default;
33+
$lm-table-header-bg-color: #fff2e3 !default;
34+
$lm-table-header-border: #fff2e3 !default;
35+
$lm-table-border-color: #fff2e3 !default;
36+
37+
38+
// Syntax highlighting styles should be adjusted appropriately for every "skin"
39+
// ----------------------------------------------------------------------------
40+
41+
@mixin lm-highlight {
42+
.highlight {
43+
.c { color: #998; font-style: italic } // Comment
44+
.err { color: #a61717; background-color: #e3d2d2 } // Error
45+
.k { font-weight: bold } // Keyword
46+
.o { font-weight: bold } // Operator
47+
.cm { color: #998; font-style: italic } // Comment.Multiline
48+
.cp { color: #999; font-weight: bold } // Comment.Preproc
49+
.c1 { color: #998; font-style: italic } // Comment.Single
50+
.cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special
51+
.gd { color: #000; background-color: #fdd } // Generic.Deleted
52+
.gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
53+
.ge { font-style: italic } // Generic.Emph
54+
.gr { color: #a00 } // Generic.Error
55+
.gh { color: #999 } // Generic.Heading
56+
.gi { color: #000; background-color: #dfd } // Generic.Inserted
57+
.gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
58+
.go { color: #888 } // Generic.Output
59+
.gp { color: #555 } // Generic.Prompt
60+
.gs { font-weight: bold } // Generic.Strong
61+
.gu { color: #aaa } // Generic.Subheading
62+
.gt { color: #a00 } // Generic.Traceback
63+
.kc { font-weight: bold } // Keyword.Constant
64+
.kd { font-weight: bold } // Keyword.Declaration
65+
.kp { font-weight: bold } // Keyword.Pseudo
66+
.kr { font-weight: bold } // Keyword.Reserved
67+
.kt { color: #458; font-weight: bold } // Keyword.Type
68+
.m { color: #099 } // Literal.Number
69+
.s { color: #d14 } // Literal.String
70+
.na { color: #008080 } // Name.Attribute
71+
.nb { color: #0086B3 } // Name.Builtin
72+
.nc { color: #458; font-weight: bold } // Name.Class
73+
.no { color: #008080 } // Name.Constant
74+
.ni { color: #800080 } // Name.Entity
75+
.ne { color: #900; font-weight: bold } // Name.Exception
76+
.nf { color: #900; font-weight: bold } // Name.Function
77+
.nn { color: #555 } // Name.Namespace
78+
.nt { color: #000080 } // Name.Tag
79+
.nv { color: #008080 } // Name.Variable
80+
.ow { font-weight: bold } // Operator.Word
81+
.w { color: #bbb } // Text.Whitespace
82+
.mf { color: #099 } // Literal.Number.Float
83+
.mh { color: #099 } // Literal.Number.Hex
84+
.mi { color: #099 } // Literal.Number.Integer
85+
.mo { color: #099 } // Literal.Number.Oct
86+
.sb { color: #d14 } // Literal.String.Backtick
87+
.sc { color: #d14 } // Literal.String.Char
88+
.sd { color: #d14 } // Literal.String.Doc
89+
.s2 { color: #d14 } // Literal.String.Double
90+
.se { color: #d14 } // Literal.String.Escape
91+
.sh { color: #d14 } // Literal.String.Heredoc
92+
.si { color: #d14 } // Literal.String.Interpol
93+
.sx { color: #d14 } // Literal.String.Other
94+
.sr { color: #009926 } // Literal.String.Regex
95+
.s1 { color: #d14 } // Literal.String.Single
96+
.ss { color: #990073 } // Literal.String.Symbol
97+
.bp { color: #999 } // Name.Builtin.Pseudo
98+
.vc { color: #008080 } // Name.Variable.Class
99+
.vg { color: #008080 } // Name.Variable.Global
100+
.vi { color: #008080 } // Name.Variable.Instance
101+
.il { color: #099 } // Literal.Number.Integer.Long
102+
}
103+
}
104+
105+
106+
// Dark mode
107+
// ---------
108+
109+
$dm-brand-color: #999999 !default;
110+
$dm-brand-color-light: lighten($dm-brand-color, 5%) !default;
111+
$dm-brand-color-dark: darken($dm-brand-color, 35%) !default;
112+
113+
$dm-site-title-color: $dm-brand-color-light !default;
114+
115+
$dm-text-color: #bbbbbb !default;
116+
$dm-background-color: #181818 !default;
117+
$dm-code-background-color: #212121 !default;
118+
119+
$dm-link-base-color: #79b8ff !default;
120+
$dm-link-visited-color: $dm-link-base-color !default;
121+
$dm-link-hover-color: $dm-text-color !default;
122+
123+
$dm-border-color-01: $dm-brand-color-dark !default;
124+
$dm-border-color-02: $dm-brand-color-light !default;
125+
$dm-border-color-03: $dm-brand-color !default;
126+
127+
$dm-table-text-color: $dm-text-color !default;
128+
$dm-table-zebra-color: lighten($dm-background-color, 4%) !default;
129+
$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default;
130+
$dm-table-header-border: lighten($dm-background-color, 21%) !default;
131+
$dm-table-border-color: $dm-border-color-01 !default;
132+
133+
134+
// Syntax highlighting styles should be adjusted appropriately for every "skin"
135+
// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens
136+
// Some colors come from Material Theme Darker:
137+
// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts
138+
// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts
139+
// ----------------------------------------------------------------------------
140+
141+
@mixin dm-highlight {
142+
.highlight {
143+
.c { color: #545454; font-style: italic } // Comment
144+
.err { color: #f07178; background-color: #e3d2d2 } // Error
145+
.k { color: #89DDFF; font-weight: bold } // Keyword
146+
.o { font-weight: bold } // Operator
147+
.cm { color: #545454; font-style: italic } // Comment.Multiline
148+
.cp { color: #545454; font-weight: bold } // Comment.Preproc
149+
.c1 { color: #545454; font-style: italic } // Comment.Single
150+
.cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special
151+
.gd { color: #000; background-color: #fdd } // Generic.Deleted
152+
.gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific
153+
.ge { font-style: italic } // Generic.Emph
154+
.gr { color: #f07178 } // Generic.Error
155+
.gh { color: #999 } // Generic.Heading
156+
.gi { color: #000; background-color: #dfd } // Generic.Inserted
157+
.gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific
158+
.go { color: #888 } // Generic.Output
159+
.gp { color: #555 } // Generic.Prompt
160+
.gs { font-weight: bold } // Generic.Strong
161+
.gu { color: #aaa } // Generic.Subheading
162+
.gt { color: #f07178 } // Generic.Traceback
163+
.kc { font-weight: bold } // Keyword.Constant
164+
.kd { font-weight: bold } // Keyword.Declaration
165+
.kp { font-weight: bold } // Keyword.Pseudo
166+
.kr { font-weight: bold } // Keyword.Reserved
167+
.kt { color: #FFCB6B; font-weight: bold } // Keyword.Type
168+
.m { color: #F78C6C } // Literal.Number
169+
.s { color: #C3E88D } // Literal.String
170+
.na { color: #008080 } // Name.Attribute
171+
.nb { color: #EEFFFF } // Name.Builtin
172+
.nc { color: #FFCB6B; font-weight: bold } // Name.Class
173+
.no { color: #008080 } // Name.Constant
174+
.ni { color: #800080 } // Name.Entity
175+
.ne { color: #900; font-weight: bold } // Name.Exception
176+
.nf { color: #82AAFF; font-weight: bold } // Name.Function
177+
.nn { color: #555 } // Name.Namespace
178+
.nt { color: #FFCB6B } // Name.Tag
179+
.nv { color: #EEFFFF } // Name.Variable
180+
.ow { font-weight: bold } // Operator.Word
181+
.w { color: #EEFFFF } // Text.Whitespace
182+
.mf { color: #F78C6C } // Literal.Number.Float
183+
.mh { color: #F78C6C } // Literal.Number.Hex
184+
.mi { color: #F78C6C } // Literal.Number.Integer
185+
.mo { color: #F78C6C } // Literal.Number.Oct
186+
.sb { color: #C3E88D } // Literal.String.Backtick
187+
.sc { color: #C3E88D } // Literal.String.Char
188+
.sd { color: #C3E88D } // Literal.String.Doc
189+
.s2 { color: #C3E88D } // Literal.String.Double
190+
.se { color: #EEFFFF } // Literal.String.Escape
191+
.sh { color: #C3E88D } // Literal.String.Heredoc
192+
.si { color: #C3E88D } // Literal.String.Interpol
193+
.sx { color: #C3E88D } // Literal.String.Other
194+
.sr { color: #C3E88D } // Literal.String.Regex
195+
.s1 { color: #C3E88D } // Literal.String.Single
196+
.ss { color: #C3E88D } // Literal.String.Symbol
197+
.bp { color: #999 } // Name.Builtin.Pseudo
198+
.vc { color: #FFCB6B } // Name.Variable.Class
199+
.vg { color: #EEFFFF } // Name.Variable.Global
200+
.vi { color: #EEFFFF } // Name.Variable.Instance
201+
.il { color: #F78C6C } // Literal.Number.Integer.Long
202+
}
203+
}
204+
205+
206+
// Mode selection
207+
// --------------
208+
209+
210+
// Classic skin (always light mode)
211+
// Assign outside of the if construct to establish global variable scope
212+
213+
$brand-color: $lm-brand-color;
214+
$brand-color-light: $lm-brand-color-light;
215+
$brand-color-dark: $lm-brand-color-dark;
216+
217+
$site-title-color: $lm-site-title-color;
218+
219+
$text-color: $lm-text-color;
220+
$background-color: $lm-background-color;
221+
$code-background-color: $lm-code-background-color;
222+
223+
$link-base-color: $lm-link-base-color;
224+
$link-visited-color: $lm-link-visited-color;
225+
$link-hover-color: $lm-link-hover-color;
226+
227+
$border-color-01: $lm-border-color-01;
228+
$border-color-02: $lm-border-color-02;
229+
$border-color-03: $lm-border-color-03;
230+
231+
$table-text-color: $lm-table-text-color;
232+
$table-zebra-color: $lm-table-zebra-color;
233+
$table-header-bg-color: $lm-table-header-bg-color;
234+
$table-header-border: $lm-table-header-border;
235+
$table-border-color: $lm-table-border-color;
236+
237+
238+
@if $color-scheme-auto {
239+
240+
// Auto mode
241+
242+
:root {
243+
--minima-brand-color: #{$lm-brand-color};
244+
--minima-brand-color-light: #{$lm-brand-color-light};
245+
--minima-brand-color-dark: #{$lm-brand-color-dark};
246+
247+
--minima-site-title-color: #{$lm-site-title-color};
248+
249+
--minima-text-color: #{$lm-text-color};
250+
--minima-background-color: #{$lm-background-color};
251+
--minima-code-background-color: #{$lm-code-background-color};
252+
253+
--minima-link-base-color: #{$lm-link-base-color};
254+
--minima-link-visited-color: #{$lm-link-visited-color};
255+
--minima-link-hover-color: #{$lm-link-hover-color};
256+
257+
--minima-border-color-01: #{$lm-border-color-01};
258+
--minima-border-color-02: #{$lm-border-color-02};
259+
--minima-border-color-03: #{$lm-border-color-03};
260+
261+
--minima-table-text-color: #{$lm-table-text-color};
262+
--minima-table-zebra-color: #{$lm-table-zebra-color};
263+
--minima-table-header-bg-color: #{$lm-table-header-bg-color};
264+
--minima-table-header-border: #{$lm-table-header-border};
265+
--minima-table-border-color: #{$lm-table-border-color};
266+
}
267+
268+
@include lm-highlight;
269+
270+
@media (prefers-color-scheme: dark) {
271+
:root {
272+
--minima-brand-color: #{$dm-brand-color};
273+
--minima-brand-color-light: #{$dm-brand-color-light};
274+
--minima-brand-color-dark: #{$dm-brand-color-dark};
275+
276+
--minima-site-title-color: #{$dm-site-title-color};
277+
278+
--minima-text-color: #{$dm-text-color};
279+
--minima-background-color: #{$dm-background-color};
280+
--minima-code-background-color: #{$dm-code-background-color};
281+
282+
--minima-link-base-color: #{$dm-link-base-color};
283+
--minima-link-visited-color: #{$dm-link-visited-color};
284+
--minima-link-hover-color: #{$dm-link-hover-color};
285+
286+
--minima-border-color-01: #{$dm-border-color-01};
287+
--minima-border-color-02: #{$dm-border-color-02};
288+
--minima-border-color-03: #{$dm-border-color-03};
289+
290+
--minima-table-text-color: #{$dm-table-text-color};
291+
--minima-table-zebra-color: #{$dm-table-zebra-color};
292+
--minima-table-header-bg-color: #{$dm-table-header-bg-color};
293+
--minima-table-header-border: #{$dm-table-header-border};
294+
--minima-table-border-color: #{$dm-table-border-color};
295+
}
296+
297+
@include dm-highlight;
298+
}
299+
300+
$brand-color: var(--minima-brand-color);
301+
$brand-color-light: var(--minima-brand-color-light);
302+
$brand-color-dark: var(--minima-brand-color-dark);
303+
304+
$site-title-color: var(--minima-site-title-color);
305+
306+
$text-color: var(--minima-text-color);
307+
$background-color: var(--minima-background-color);
308+
$code-background-color: var(--minima-code-background-color);
309+
310+
$link-base-color: var(--minima-link-base-color);
311+
$link-visited-color: var(--minima-link-visited-color);
312+
$link-hover-color: var(--minima-link-hover-color);
313+
314+
$border-color-01: var(--minima-border-color-01);
315+
$border-color-02: var(--minima-border-color-02);
316+
$border-color-03: var(--minima-border-color-03);
317+
318+
$table-text-color: var(--minima-table-text-color);
319+
$table-zebra-color: var(--minima-table-zebra-color);
320+
$table-header-bg-color: var(--minima-table-header-bg-color);
321+
$table-header-border: var(--minima-table-header-border);
322+
$table-border-color: var(--minima-table-border-color);
323+
324+
325+
} @else if $color-scheme-dark {
326+
327+
// Dark skin (always dark mode)
328+
329+
$brand-color: $dm-brand-color;
330+
$brand-color-light: $dm-brand-color-light;
331+
$brand-color-dark: $dm-brand-color-dark;
332+
333+
$site-title-color: $dm-site-title-color;
334+
335+
$text-color: $dm-text-color;
336+
$background-color: $dm-background-color;
337+
$code-background-color: $dm-code-background-color;
338+
339+
$link-base-color: $dm-link-base-color;
340+
$link-visited-color: $dm-link-visited-color;
341+
$link-hover-color: $dm-link-hover-color;
342+
343+
$border-color-01: $dm-border-color-01;
344+
$border-color-02: $dm-border-color-02;
345+
$border-color-03: $dm-border-color-03;
346+
347+
$table-text-color: $dm-table-text-color;
348+
$table-zebra-color: $dm-table-zebra-color;
349+
$table-header-bg-color: $dm-table-header-bg-color;
350+
$table-header-border: $dm-table-header-border;
351+
$table-border-color: $dm-table-border-color;
352+
353+
@include dm-highlight;
354+
355+
356+
} @else {
357+
358+
// Classic skin syntax highlighting
359+
@include lm-highlight;
360+
361+
}

0 commit comments

Comments
 (0)