dark-blog-theme 1.1.0 → 2.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_includes/footer.html +3 -0
- data/_includes/head.html +24 -7
- data/_includes/theme_picker.html +78 -0
- data/_layouts/default.html +2 -1
- data/_layouts/home.html +2 -1
- data/_sass/minima/_base.scss +154 -51
- data/_sass/minima/_layout.scss +32 -4
- data/assets/theme-assets/js/theme.js +15 -0
- metadata +3 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: '083f22fc3deb226a8d02a30d132c401bddd1097f3f67c84317627488b4024a03'
|
|
4
|
+
data.tar.gz: 229ee1b7269c2aa363ae3a8eab2dd2d99dbd3bf1e5ef54f309ee93fb3d614fba
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: dec744e534b7e1022a0624344dc1e8e0325ce6a1b22eb56f29bdfae4e1160f430e38229ebd6f2bd941774e0a13c5a47c30077c376414e21693a9f8259bdeb09b
|
|
7
|
+
data.tar.gz: 17171da4ff48a9d831184870c16664f24403e7f773f6fccaf04ec5d31a61e5f880e5e0e0c6305e07929e606944ecaf759445fb11ca534b792060446586059063
|
data/_includes/footer.html
CHANGED
data/_includes/head.html
CHANGED
|
@@ -1,10 +1,27 @@
|
|
|
1
1
|
<head>
|
|
2
|
-
<meta charset="utf-8"
|
|
3
|
-
<meta http-equiv="X-UA-Compatible" content="IE=edge"
|
|
4
|
-
<meta name="viewport" content="width=device-width, initial-scale=1"
|
|
2
|
+
<meta charset="utf-8" />
|
|
3
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
4
|
+
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
5
|
+
<link
|
|
6
|
+
rel="preload"
|
|
7
|
+
href="/assets/theme-assets/theme-fonts/Virgil.woff2"
|
|
8
|
+
as="font"
|
|
9
|
+
type="font/woff2"
|
|
10
|
+
crossorigin
|
|
11
|
+
/>
|
|
5
12
|
<link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
13
|
+
<script>
|
|
14
|
+
const root = document.querySelector("html");
|
|
15
|
+
const theme = window.localStorage.getItem("theme");
|
|
16
|
+
if (theme === null) {
|
|
17
|
+
window.localStorage.setItem("theme", "dark-pink");
|
|
18
|
+
root.className = "dark-pink";
|
|
19
|
+
} else {
|
|
20
|
+
root.className = theme;
|
|
21
|
+
}
|
|
22
|
+
</script>
|
|
23
|
+
<script src="/assets/theme-assets/js/theme.js" defer></script>
|
|
24
|
+
{% comment %} {%- feed_meta -%} {% endcomment %} {%- if jekyll.environment ==
|
|
25
|
+
'production' and site.google_analytics -%} {%- include google-analytics.html
|
|
26
|
+
-%} {%- endif -%}
|
|
10
27
|
</head>
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
<div class="theme-picker">
|
|
2
|
+
<input
|
|
3
|
+
class="theme-input"
|
|
4
|
+
type="radio"
|
|
5
|
+
id="theme-1"
|
|
6
|
+
name="theme"
|
|
7
|
+
value="pink"
|
|
8
|
+
checked
|
|
9
|
+
/>
|
|
10
|
+
<label
|
|
11
|
+
data-theme-class="dark-pink"
|
|
12
|
+
id="picker"
|
|
13
|
+
for="theme-1"
|
|
14
|
+
class="pink-theme"
|
|
15
|
+
>
|
|
16
|
+
<div class="select-theme" id="pink-theme"></div>
|
|
17
|
+
</label>
|
|
18
|
+
<input
|
|
19
|
+
class="theme-input"
|
|
20
|
+
type="radio"
|
|
21
|
+
id="theme-2"
|
|
22
|
+
name="theme"
|
|
23
|
+
value="green"
|
|
24
|
+
/>
|
|
25
|
+
<label
|
|
26
|
+
data-theme-class="dark-green"
|
|
27
|
+
id="picker"
|
|
28
|
+
for="theme-2"
|
|
29
|
+
class="green-theme"
|
|
30
|
+
>
|
|
31
|
+
<div class="select-theme" id="green-theme"></div>
|
|
32
|
+
</label>
|
|
33
|
+
<input
|
|
34
|
+
class="theme-input"
|
|
35
|
+
type="radio"
|
|
36
|
+
id="theme-3"
|
|
37
|
+
name="theme"
|
|
38
|
+
value="yellow"
|
|
39
|
+
/>
|
|
40
|
+
<label
|
|
41
|
+
data-theme-class="dark-yellow"
|
|
42
|
+
id="picker"
|
|
43
|
+
for="theme-3"
|
|
44
|
+
class="yellow-theme"
|
|
45
|
+
>
|
|
46
|
+
<div class="select-theme" id="yellow-theme"></div>
|
|
47
|
+
</label>
|
|
48
|
+
<input
|
|
49
|
+
class="theme-input"
|
|
50
|
+
type="radio"
|
|
51
|
+
id="theme-4"
|
|
52
|
+
name="theme"
|
|
53
|
+
value="blue"
|
|
54
|
+
/>
|
|
55
|
+
<label
|
|
56
|
+
data-theme-class="dark-blue"
|
|
57
|
+
id="picker"
|
|
58
|
+
for="theme-4"
|
|
59
|
+
class="blue-theme"
|
|
60
|
+
>
|
|
61
|
+
<div class="select-theme" id="blue-theme"></div>
|
|
62
|
+
</label>
|
|
63
|
+
<input
|
|
64
|
+
class="theme-input"
|
|
65
|
+
type="radio"
|
|
66
|
+
id="theme-5"
|
|
67
|
+
name="theme"
|
|
68
|
+
value="cyan"
|
|
69
|
+
/>
|
|
70
|
+
<label
|
|
71
|
+
data-theme-class="dark-cyan"
|
|
72
|
+
id="picker"
|
|
73
|
+
for="theme-5"
|
|
74
|
+
class="cyan-theme"
|
|
75
|
+
>
|
|
76
|
+
<div class="select-theme" id="cyan-theme"></div>
|
|
77
|
+
</label>
|
|
78
|
+
</div>
|
data/_layouts/default.html
CHANGED
data/_layouts/home.html
CHANGED
|
@@ -9,7 +9,8 @@ layout: default
|
|
|
9
9
|
{{ content }}
|
|
10
10
|
|
|
11
11
|
{%- if site.posts.size > 0 -%}
|
|
12
|
-
|
|
12
|
+
{%- include theme_picker.html -%}
|
|
13
|
+
<h2 class="post-list-heading">{{ page.list_title | default: 'Featured Posts' }}</h2>
|
|
13
14
|
<ul class="post-list">
|
|
14
15
|
{%- for post in site.posts -%}
|
|
15
16
|
<li class="post-card">
|
data/_sass/minima/_base.scss
CHANGED
|
@@ -20,6 +20,159 @@ figure {
|
|
|
20
20
|
margin: 0;
|
|
21
21
|
padding: 0;
|
|
22
22
|
}
|
|
23
|
+
.dark-yellow {
|
|
24
|
+
--md-sys-color-primary: rgb(219 198 110);
|
|
25
|
+
--md-sys-color-surface-tint: rgb(219 198 110);
|
|
26
|
+
--md-sys-color-on-primary: rgb(58 48 0);
|
|
27
|
+
--md-sys-color-primary-container: rgb(83 70 0);
|
|
28
|
+
--md-sys-color-on-primary-container: rgb(248 226 135);
|
|
29
|
+
--md-sys-color-secondary: rgb(209 198 161);
|
|
30
|
+
--md-sys-color-on-secondary: rgb(54 48 22);
|
|
31
|
+
--md-sys-color-secondary-container: rgb(78 71 42);
|
|
32
|
+
--md-sys-color-on-secondary-container: rgb(238 226 188);
|
|
33
|
+
--md-sys-color-tertiary: rgb(169 208 179);
|
|
34
|
+
--md-sys-color-on-tertiary: rgb(20 55 35);
|
|
35
|
+
--md-sys-color-tertiary-container: rgb(44 78 56);
|
|
36
|
+
--md-sys-color-on-tertiary-container: rgb(197 236 206);
|
|
37
|
+
--md-sys-color-error: rgb(255 180 171);
|
|
38
|
+
--md-sys-color-on-error: rgb(105 0 5);
|
|
39
|
+
--md-sys-color-error-container: rgb(147 0 10);
|
|
40
|
+
--md-sys-color-on-error-container: rgb(255 218 214);
|
|
41
|
+
--md-sys-color-background: rgb(21 19 11);
|
|
42
|
+
--md-sys-color-on-background: rgb(232 226 212);
|
|
43
|
+
--md-sys-color-surface: rgb(21 19 11);
|
|
44
|
+
--md-sys-color-on-surface: rgb(232 226 212);
|
|
45
|
+
--md-sys-color-surface-variant: rgb(75 71 57);
|
|
46
|
+
--md-sys-color-on-surface-variant: rgb(205 198 180);
|
|
47
|
+
--md-sys-color-outline: rgb(150 144 128);
|
|
48
|
+
--md-sys-color-outline-variant: rgb(75 71 57);
|
|
49
|
+
--md-sys-color-shadow: rgb(0 0 0);
|
|
50
|
+
--md-sys-color-scrim: rgb(0 0 0);
|
|
51
|
+
--md-sys-color-inverse-surface: rgb(232 226 212);
|
|
52
|
+
--md-sys-color-inverse-on-surface: rgb(51 48 39);
|
|
53
|
+
--md-sys-color-inverse-primary: rgb(109 94 15);
|
|
54
|
+
--md-sys-color-primary-fixed: rgb(248 226 135);
|
|
55
|
+
--md-sys-color-on-primary-fixed: rgb(34 27 0);
|
|
56
|
+
--md-sys-color-primary-fixed-dim: rgb(219 198 110);
|
|
57
|
+
--md-sys-color-on-primary-fixed-variant: rgb(83 70 0);
|
|
58
|
+
--md-sys-color-secondary-fixed: rgb(238 226 188);
|
|
59
|
+
--md-sys-color-on-secondary-fixed: rgb(33 27 4);
|
|
60
|
+
--md-sys-color-secondary-fixed-dim: rgb(209 198 161);
|
|
61
|
+
--md-sys-color-on-secondary-fixed-variant: rgb(78 71 42);
|
|
62
|
+
--md-sys-color-tertiary-fixed: rgb(197 236 206);
|
|
63
|
+
--md-sys-color-on-tertiary-fixed: rgb(0 33 15);
|
|
64
|
+
--md-sys-color-tertiary-fixed-dim: rgb(169 208 179);
|
|
65
|
+
--md-sys-color-on-tertiary-fixed-variant: rgb(44 78 56);
|
|
66
|
+
--md-sys-color-surface-dim: rgb(21 19 11);
|
|
67
|
+
--md-sys-color-surface-bright: rgb(60 57 48);
|
|
68
|
+
--md-sys-color-surface-container-lowest: rgb(16 14 7);
|
|
69
|
+
--md-sys-color-surface-container-low: rgb(30 27 19);
|
|
70
|
+
--md-sys-color-surface-container: rgb(34 32 23);
|
|
71
|
+
--md-sys-color-surface-container-high: rgb(45 42 33);
|
|
72
|
+
--md-sys-color-surface-container-highest: rgb(56 53 43);
|
|
73
|
+
}
|
|
74
|
+
.dark-blue {
|
|
75
|
+
--md-sys-color-primary: rgb(170 199 255);
|
|
76
|
+
--md-sys-color-surface-tint: rgb(170 199 255);
|
|
77
|
+
--md-sys-color-on-primary: rgb(10 48 95);
|
|
78
|
+
--md-sys-color-primary-container: rgb(40 71 119);
|
|
79
|
+
--md-sys-color-on-primary-container: rgb(214 227 255);
|
|
80
|
+
--md-sys-color-secondary: rgb(190 198 220);
|
|
81
|
+
--md-sys-color-on-secondary: rgb(40 49 65);
|
|
82
|
+
--md-sys-color-secondary-container: rgb(62 71 89);
|
|
83
|
+
--md-sys-color-on-secondary-container: rgb(218 226 249);
|
|
84
|
+
--md-sys-color-tertiary: rgb(221 188 224);
|
|
85
|
+
--md-sys-color-on-tertiary: rgb(63 40 68);
|
|
86
|
+
--md-sys-color-tertiary-container: rgb(87 62 92);
|
|
87
|
+
--md-sys-color-on-tertiary-container: rgb(250 216 253);
|
|
88
|
+
--md-sys-color-error: rgb(255 180 171);
|
|
89
|
+
--md-sys-color-on-error: rgb(105 0 5);
|
|
90
|
+
--md-sys-color-error-container: rgb(147 0 10);
|
|
91
|
+
--md-sys-color-on-error-container: rgb(255 218 214);
|
|
92
|
+
--md-sys-color-background: rgb(17 19 24);
|
|
93
|
+
--md-sys-color-on-background: rgb(226 226 233);
|
|
94
|
+
--md-sys-color-surface: rgb(17 19 24);
|
|
95
|
+
--md-sys-color-on-surface: rgb(226 226 233);
|
|
96
|
+
--md-sys-color-surface-variant: rgb(68 71 78);
|
|
97
|
+
--md-sys-color-on-surface-variant: rgb(196 198 208);
|
|
98
|
+
--md-sys-color-outline: rgb(142 144 153);
|
|
99
|
+
--md-sys-color-outline-variant: rgb(68 71 78);
|
|
100
|
+
--md-sys-color-shadow: rgb(0 0 0);
|
|
101
|
+
--md-sys-color-scrim: rgb(0 0 0);
|
|
102
|
+
--md-sys-color-inverse-surface: rgb(226 226 233);
|
|
103
|
+
--md-sys-color-inverse-on-surface: rgb(46 48 54);
|
|
104
|
+
--md-sys-color-inverse-primary: rgb(65 95 145);
|
|
105
|
+
--md-sys-color-primary-fixed: rgb(214 227 255);
|
|
106
|
+
--md-sys-color-on-primary-fixed: rgb(0 27 62);
|
|
107
|
+
--md-sys-color-primary-fixed-dim: rgb(170 199 255);
|
|
108
|
+
--md-sys-color-on-primary-fixed-variant: rgb(40 71 119);
|
|
109
|
+
--md-sys-color-secondary-fixed: rgb(218 226 249);
|
|
110
|
+
--md-sys-color-on-secondary-fixed: rgb(19 28 43);
|
|
111
|
+
--md-sys-color-secondary-fixed-dim: rgb(190 198 220);
|
|
112
|
+
--md-sys-color-on-secondary-fixed-variant: rgb(62 71 89);
|
|
113
|
+
--md-sys-color-tertiary-fixed: rgb(250 216 253);
|
|
114
|
+
--md-sys-color-on-tertiary-fixed: rgb(40 19 46);
|
|
115
|
+
--md-sys-color-tertiary-fixed-dim: rgb(221 188 224);
|
|
116
|
+
--md-sys-color-on-tertiary-fixed-variant: rgb(87 62 92);
|
|
117
|
+
--md-sys-color-surface-dim: rgb(17 19 24);
|
|
118
|
+
--md-sys-color-surface-bright: rgb(55 57 62);
|
|
119
|
+
--md-sys-color-surface-container-lowest: rgb(12 14 19);
|
|
120
|
+
--md-sys-color-surface-container-low: rgb(25 28 32);
|
|
121
|
+
--md-sys-color-surface-container: rgb(29 32 36);
|
|
122
|
+
--md-sys-color-surface-container-high: rgb(40 42 47);
|
|
123
|
+
--md-sys-color-surface-container-highest: rgb(51 53 58);
|
|
124
|
+
}
|
|
125
|
+
.dark-cyan {
|
|
126
|
+
--md-sys-color-primary: rgb(129 213 205);
|
|
127
|
+
--md-sys-color-surface-tint: rgb(129 213 205);
|
|
128
|
+
--md-sys-color-on-primary: rgb(0 55 52);
|
|
129
|
+
--md-sys-color-primary-container: rgb(0 80 75);
|
|
130
|
+
--md-sys-color-on-primary-container: rgb(157 242 233);
|
|
131
|
+
--md-sys-color-secondary: rgb(176 204 200);
|
|
132
|
+
--md-sys-color-on-secondary: rgb(28 53 50);
|
|
133
|
+
--md-sys-color-secondary-container: rgb(50 75 73);
|
|
134
|
+
--md-sys-color-on-secondary-container: rgb(204 232 228);
|
|
135
|
+
--md-sys-color-tertiary: rgb(175 201 231);
|
|
136
|
+
--md-sys-color-on-tertiary: rgb(24 50 74);
|
|
137
|
+
--md-sys-color-tertiary-container: rgb(48 73 98);
|
|
138
|
+
--md-sys-color-on-tertiary-container: rgb(207 229 255);
|
|
139
|
+
--md-sys-color-error: rgb(255 180 171);
|
|
140
|
+
--md-sys-color-on-error: rgb(105 0 5);
|
|
141
|
+
--md-sys-color-error-container: rgb(147 0 10);
|
|
142
|
+
--md-sys-color-on-error-container: rgb(255 218 214);
|
|
143
|
+
--md-sys-color-background: rgb(14 21 20);
|
|
144
|
+
--md-sys-color-on-background: rgb(221 228 226);
|
|
145
|
+
--md-sys-color-surface: rgb(14 21 20);
|
|
146
|
+
--md-sys-color-on-surface: rgb(221 228 226);
|
|
147
|
+
--md-sys-color-surface-variant: rgb(63 73 71);
|
|
148
|
+
--md-sys-color-on-surface-variant: rgb(190 201 198);
|
|
149
|
+
--md-sys-color-outline: rgb(137 147 145);
|
|
150
|
+
--md-sys-color-outline-variant: rgb(63 73 71);
|
|
151
|
+
--md-sys-color-shadow: rgb(0 0 0);
|
|
152
|
+
--md-sys-color-scrim: rgb(0 0 0);
|
|
153
|
+
--md-sys-color-inverse-surface: rgb(221 228 226);
|
|
154
|
+
--md-sys-color-inverse-on-surface: rgb(43 50 49);
|
|
155
|
+
--md-sys-color-inverse-primary: rgb(0 106 100);
|
|
156
|
+
--md-sys-color-primary-fixed: rgb(157 242 233);
|
|
157
|
+
--md-sys-color-on-primary-fixed: rgb(0 32 30);
|
|
158
|
+
--md-sys-color-primary-fixed-dim: rgb(129 213 205);
|
|
159
|
+
--md-sys-color-on-primary-fixed-variant: rgb(0 80 75);
|
|
160
|
+
--md-sys-color-secondary-fixed: rgb(204 232 228);
|
|
161
|
+
--md-sys-color-on-secondary-fixed: rgb(5 31 29);
|
|
162
|
+
--md-sys-color-secondary-fixed-dim: rgb(176 204 200);
|
|
163
|
+
--md-sys-color-on-secondary-fixed-variant: rgb(50 75 73);
|
|
164
|
+
--md-sys-color-tertiary-fixed: rgb(207 229 255);
|
|
165
|
+
--md-sys-color-on-tertiary-fixed: rgb(0 29 51);
|
|
166
|
+
--md-sys-color-tertiary-fixed-dim: rgb(175 201 231);
|
|
167
|
+
--md-sys-color-on-tertiary-fixed-variant: rgb(48 73 98);
|
|
168
|
+
--md-sys-color-surface-dim: rgb(14 21 20);
|
|
169
|
+
--md-sys-color-surface-bright: rgb(52 58 57);
|
|
170
|
+
--md-sys-color-surface-container-lowest: rgb(9 15 15);
|
|
171
|
+
--md-sys-color-surface-container-low: rgb(22 29 28);
|
|
172
|
+
--md-sys-color-surface-container: rgb(26 33 32);
|
|
173
|
+
--md-sys-color-surface-container-high: rgb(37 43 42);
|
|
174
|
+
--md-sys-color-surface-container-highest: rgb(47 54 53);
|
|
175
|
+
}
|
|
23
176
|
|
|
24
177
|
.dark-green {
|
|
25
178
|
--md-sys-color-primary: rgb(177 209 138);
|
|
@@ -72,57 +225,7 @@ figure {
|
|
|
72
225
|
--md-sys-color-surface-container-high: rgb(40 43 36);
|
|
73
226
|
--md-sys-color-surface-container-highest: rgb(51 54 46);
|
|
74
227
|
}
|
|
75
|
-
|
|
76
|
-
--md-sys-color-primary: rgb(76 102 43);
|
|
77
|
-
--md-sys-color-surface-tint: rgb(76 102 43);
|
|
78
|
-
--md-sys-color-on-primary: rgb(255 255 255);
|
|
79
|
-
--md-sys-color-primary-container: rgb(205 237 163);
|
|
80
|
-
--md-sys-color-on-primary-container: rgb(16 32 0);
|
|
81
|
-
--md-sys-color-secondary: rgb(88 98 73);
|
|
82
|
-
--md-sys-color-on-secondary: rgb(255 255 255);
|
|
83
|
-
--md-sys-color-secondary-container: rgb(220 231 200);
|
|
84
|
-
--md-sys-color-on-secondary-container: rgb(21 30 11);
|
|
85
|
-
--md-sys-color-tertiary: rgb(56 102 99);
|
|
86
|
-
--md-sys-color-on-tertiary: rgb(255 255 255);
|
|
87
|
-
--md-sys-color-tertiary-container: rgb(188 236 231);
|
|
88
|
-
--md-sys-color-on-tertiary-container: rgb(0 32 30);
|
|
89
|
-
--md-sys-color-error: rgb(186 26 26);
|
|
90
|
-
--md-sys-color-on-error: rgb(255 255 255);
|
|
91
|
-
--md-sys-color-error-container: rgb(255 218 214);
|
|
92
|
-
--md-sys-color-on-error-container: rgb(65 0 2);
|
|
93
|
-
--md-sys-color-background: rgb(249 250 239);
|
|
94
|
-
--md-sys-color-on-background: rgb(26 28 22);
|
|
95
|
-
--md-sys-color-surface: rgb(249 250 239);
|
|
96
|
-
--md-sys-color-on-surface: rgb(26 28 22);
|
|
97
|
-
--md-sys-color-surface-variant: rgb(225 228 213);
|
|
98
|
-
--md-sys-color-on-surface-variant: rgb(68 72 61);
|
|
99
|
-
--md-sys-color-outline: rgb(117 121 108);
|
|
100
|
-
--md-sys-color-outline-variant: rgb(197 200 186);
|
|
101
|
-
--md-sys-color-shadow: rgb(0 0 0);
|
|
102
|
-
--md-sys-color-scrim: rgb(0 0 0);
|
|
103
|
-
--md-sys-color-inverse-surface: rgb(47 49 42);
|
|
104
|
-
--md-sys-color-inverse-on-surface: rgb(241 242 230);
|
|
105
|
-
--md-sys-color-inverse-primary: rgb(177 209 138);
|
|
106
|
-
--md-sys-color-primary-fixed: rgb(205 237 163);
|
|
107
|
-
--md-sys-color-on-primary-fixed: rgb(16 32 0);
|
|
108
|
-
--md-sys-color-primary-fixed-dim: rgb(177 209 138);
|
|
109
|
-
--md-sys-color-on-primary-fixed-variant: rgb(53 78 22);
|
|
110
|
-
--md-sys-color-secondary-fixed: rgb(220 231 200);
|
|
111
|
-
--md-sys-color-on-secondary-fixed: rgb(21 30 11);
|
|
112
|
-
--md-sys-color-secondary-fixed-dim: rgb(191 203 173);
|
|
113
|
-
--md-sys-color-on-secondary-fixed-variant: rgb(64 74 51);
|
|
114
|
-
--md-sys-color-tertiary-fixed: rgb(188 236 231);
|
|
115
|
-
--md-sys-color-on-tertiary-fixed: rgb(0 32 30);
|
|
116
|
-
--md-sys-color-tertiary-fixed-dim: rgb(160 208 203);
|
|
117
|
-
--md-sys-color-on-tertiary-fixed-variant: rgb(31 78 75);
|
|
118
|
-
--md-sys-color-surface-dim: rgb(218 219 208);
|
|
119
|
-
--md-sys-color-surface-bright: rgb(249 250 239);
|
|
120
|
-
--md-sys-color-surface-container-lowest: rgb(255 255 255);
|
|
121
|
-
--md-sys-color-surface-container-low: rgb(243 244 233);
|
|
122
|
-
--md-sys-color-surface-container: rgb(238 239 227);
|
|
123
|
-
--md-sys-color-surface-container-high: rgb(232 233 222);
|
|
124
|
-
--md-sys-color-surface-container-highest: rgb(226 227 216);
|
|
125
|
-
}
|
|
228
|
+
|
|
126
229
|
.dark-pink {
|
|
127
230
|
--md-sys-color-primary: rgb(240 179 231);
|
|
128
231
|
--md-sys-color-surface-tint: rgb(240 179 231);
|
data/_sass/minima/_layout.scss
CHANGED
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
margin-top: 12px;
|
|
30
30
|
// float: left;
|
|
31
31
|
|
|
32
|
-
@media screen and (min-width:500px) {
|
|
32
|
+
@media screen and (min-width: 500px) {
|
|
33
33
|
font-size: 56px;
|
|
34
34
|
}
|
|
35
35
|
|
|
@@ -38,7 +38,35 @@
|
|
|
38
38
|
// color: $grey-color-dark;
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
|
-
|
|
41
|
+
.select-theme {
|
|
42
|
+
width: 26px;
|
|
43
|
+
height: 26px;
|
|
44
|
+
border-radius: 999px;
|
|
45
|
+
}
|
|
46
|
+
.theme-input {
|
|
47
|
+
// transform: translate(9999px,9999px);
|
|
48
|
+
height: 0px;
|
|
49
|
+
width: 0px;
|
|
50
|
+
}
|
|
51
|
+
.theme-picker {
|
|
52
|
+
display: flex;
|
|
53
|
+
justify-content: center;
|
|
54
|
+
}
|
|
55
|
+
#pink-theme {
|
|
56
|
+
background-color: #f0b3e7;
|
|
57
|
+
}
|
|
58
|
+
#green-theme {
|
|
59
|
+
background-color: #b1d18a;
|
|
60
|
+
}
|
|
61
|
+
#yellow-theme {
|
|
62
|
+
background-color: #dbc66e;
|
|
63
|
+
}
|
|
64
|
+
#blue-theme {
|
|
65
|
+
background-color: #aac7ff;
|
|
66
|
+
}
|
|
67
|
+
#cyan-theme {
|
|
68
|
+
background-color: #81d5cd;
|
|
69
|
+
}
|
|
42
70
|
.site-nav {
|
|
43
71
|
float: right;
|
|
44
72
|
line-height: $base-line-height * $base-font-size * 2.25;
|
|
@@ -214,11 +242,11 @@
|
|
|
214
242
|
font-size: $small-font-size;
|
|
215
243
|
color: $grey-color;
|
|
216
244
|
}
|
|
217
|
-
.post-image{
|
|
245
|
+
.post-image {
|
|
218
246
|
height: 200px;
|
|
219
247
|
width: 100%;
|
|
220
248
|
}
|
|
221
|
-
.featured-image{
|
|
249
|
+
.featured-image {
|
|
222
250
|
height: 300px;
|
|
223
251
|
width: 100%;
|
|
224
252
|
object-fit: contain;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
(function () {
|
|
2
|
+
const theme = window.localStorage.getItem("theme");
|
|
3
|
+
const pickers = document.querySelectorAll("#picker");
|
|
4
|
+
pickers.forEach((picker) => {
|
|
5
|
+
picker.addEventListener("click", clickHandler(picker.dataset.themeClass));
|
|
6
|
+
});
|
|
7
|
+
const root = document.querySelector("html");
|
|
8
|
+
("#diplayselectedtheme");
|
|
9
|
+
function clickHandler(color) {
|
|
10
|
+
return () => {
|
|
11
|
+
window.localStorage.setItem("theme", color);
|
|
12
|
+
root.className = color;
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
})();
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: dark-blog-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version:
|
|
4
|
+
version: 2.0.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Gul Noor
|
|
@@ -31,6 +31,7 @@ files:
|
|
|
31
31
|
- _includes/icon-twitter.html
|
|
32
32
|
- _includes/icon-twitter.svg
|
|
33
33
|
- _includes/social.html
|
|
34
|
+
- _includes/theme_picker.html
|
|
34
35
|
- _layouts/default.html
|
|
35
36
|
- _layouts/home.html
|
|
36
37
|
- _layouts/page.html
|
|
@@ -41,6 +42,7 @@ files:
|
|
|
41
42
|
- _sass/minima/_syntax-highlighting.scss
|
|
42
43
|
- assets/main.scss
|
|
43
44
|
- assets/minima-social-icons.svg
|
|
45
|
+
- assets/theme-assets/js/theme.js
|
|
44
46
|
- assets/theme-assets/material-theme/colors.module.css
|
|
45
47
|
- assets/theme-assets/material-theme/theme.css
|
|
46
48
|
- assets/theme-assets/material-theme/theme.dark.css
|