jekyll-theme-chirpy 7.4.1 → 7.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +33 -40
  3. data/_data/locales/ar.yml +7 -1
  4. data/_data/locales/bg-BG.yml +7 -1
  5. data/_data/locales/ca-ES.yml +7 -1
  6. data/_data/locales/cs-CZ.yml +7 -1
  7. data/_data/locales/da-DK.yml +7 -1
  8. data/_data/locales/de-DE.yml +7 -1
  9. data/_data/locales/dv/342/200/221MV.yml +7 -1
  10. data/_data/locales/el-GR.yml +7 -1
  11. data/_data/locales/en.yml +7 -1
  12. data/_data/locales/es-ES.yml +7 -1
  13. data/_data/locales/fa-IR.yml +7 -1
  14. data/_data/locales/fi-FI.yml +7 -1
  15. data/_data/locales/fr-FR.yml +7 -1
  16. data/_data/locales/hu-HU.yml +7 -1
  17. data/_data/locales/id-ID.yml +7 -1
  18. data/_data/locales/it-IT.yml +7 -1
  19. data/_data/locales/ja-JP.yml +7 -1
  20. data/_data/locales/ko-KR.yml +7 -1
  21. data/_data/locales/ku-IQ.yml +7 -1
  22. data/_data/locales/my-MM.yml +7 -1
  23. data/_data/locales/nl-NL.yml +7 -1
  24. data/_data/locales/ps/342/200/221AF.yml +7 -1
  25. data/_data/locales/pt-BR.yml +7 -1
  26. data/_data/locales/ru-RU.yml +7 -1
  27. data/_data/locales/sl-SI.yml +7 -1
  28. data/_data/locales/sv-SE.yml +7 -1
  29. data/_data/locales/th.yml +7 -1
  30. data/_data/locales/tr-TR.yml +7 -1
  31. data/_data/locales/uk-UA.yml +7 -1
  32. data/_data/locales/ur-PK.yml +7 -1
  33. data/_data/locales/vi-VN.yml +7 -1
  34. data/_data/locales/zh-CN.yml +7 -1
  35. data/_data/locales/zh-TW.yml +7 -1
  36. data/_data/origin/cors.yml +18 -15
  37. data/_includes/comments/disqus.html +2 -2
  38. data/_includes/comments/giscus.html +17 -7
  39. data/_includes/comments/utterances.html +4 -4
  40. data/_includes/datetime.html +1 -1
  41. data/_includes/head.html +16 -5
  42. data/_includes/js-selector.html +0 -1
  43. data/_includes/language-alias.html +7 -9
  44. data/_includes/media-url.html +1 -1
  45. data/_includes/notification.html +13 -9
  46. data/_includes/post-edit.html +23 -0
  47. data/_includes/post-paginator.html +1 -1
  48. data/_includes/refactor-content.html +1 -1
  49. data/_includes/sidebar.html +48 -6
  50. data/_layouts/default.html +7 -6
  51. data/_layouts/post.html +16 -13
  52. data/_sass/abstracts/_mixins.scss +6 -0
  53. data/_sass/abstracts/_variables.scss +6 -0
  54. data/_sass/base/_base.scss +28 -20
  55. data/_sass/base/_syntax.scss +7 -4
  56. data/_sass/components/_popups.scss +17 -28
  57. data/_sass/layout/_sidebar.scss +97 -9
  58. data/_sass/pages/_archives.scss +1 -1
  59. data/_sass/pages/_post.scss +11 -1
  60. data/_sass/themes/_dark.scss +7 -2
  61. data/_sass/themes/_light.scss +7 -2
  62. data/_sass/vendors/_bootstrap.scss +1 -1
  63. data/assets/css/jekyll-theme-chirpy.scss +4 -0
  64. data/assets/img/favicons/site.webmanifest +1 -1
  65. data/assets/js/dist/app.min.js +2 -2
  66. data/assets/js/dist/categories.min.js +2 -2
  67. data/assets/js/dist/commons.min.js +2 -2
  68. data/assets/js/dist/home.min.js +2 -2
  69. data/assets/js/dist/misc.min.js +2 -2
  70. data/assets/js/dist/page.min.js +2 -2
  71. data/assets/js/dist/post.min.js +2 -2
  72. data/assets/js/dist/sw.min.js +1 -1
  73. data/assets/js/dist/theme.min.js +2 -2
  74. metadata +4 -7
@@ -40,11 +40,53 @@
40
40
  </ul>
41
41
  </nav>
42
42
 
43
- <div class="sidebar-bottom d-flex flex-wrap align-items-center w-100">
44
- {% unless site.theme_mode %}
45
- <button type="button" class="btn btn-link nav-link" aria-label="Switch Mode" id="mode-toggle">
46
- <i class="fas fa-adjust"></i>
47
- </button>
43
+ <div class="sidebar-bottom d-flex flex-wrap align-items-center w-100">
44
+ {% unless site.theme_mode == 'light' or site.theme_mode == 'dark' %}
45
+ {%- capture icon_system -%}
46
+ <i class="fa-solid fa-display" data-theme-mode="system"></i>
47
+ {%- endcapture -%}
48
+
49
+ {%- capture icon_light -%}
50
+ <i class="fa-regular fa-sun" data-theme-mode="light"></i>
51
+ {%- endcapture -%}
52
+
53
+ {%- capture icon_dark -%}
54
+ <i class="fa-regular fa-moon" data-theme-mode="dark"></i>
55
+ {%- endcapture -%}
56
+
57
+ <div class="btn-group dropup">
58
+ <button
59
+ type="button"
60
+ class="btn btn-link nav-link"
61
+ aria-label="Switch Mode"
62
+ id="mode-toggle"
63
+ data-bs-toggle="dropdown"
64
+ >
65
+ {{- icon_light -}}
66
+ {{- icon_dark -}}
67
+ {{- icon_system -}}
68
+ </button>
69
+ <ul class="dropdown-menu rounded-3 mb-1 p-1">
70
+ <li>
71
+ <button class="dropdown-item d-flex align-items-center" type="button" data-theme-mode="light">
72
+ {{- icon_light -}}
73
+ {{- site.data.locales[lang].theme.light -}}
74
+ </button>
75
+ </li>
76
+ <li>
77
+ <button class="dropdown-item d-flex align-items-center" type="button" data-theme-mode="dark">
78
+ {{- icon_dark -}}
79
+ {{- site.data.locales[lang].theme.dark -}}
80
+ </button>
81
+ </li>
82
+ <li>
83
+ <button class="dropdown-item d-flex align-items-center" type="button" data-theme-mode="system">
84
+ {{- icon_system -}}
85
+ {{- site.data.locales[lang].theme.system -}}
86
+ </button>
87
+ </li>
88
+ </ul>
89
+ </div>
48
90
 
49
91
  {% if site.data.contact.size > 0 %}
50
92
  <span class="icon-border"></span>
@@ -68,7 +110,7 @@
68
110
  {%- endunless -%}
69
111
  {%- assign email = site.social.email | split: '@' -%}
70
112
  {%- capture url -%}
71
- javascript:location.href = 'mailto:' + ['{{ email[0] }}','{{ email[1] }}'].join('@')
113
+ javascript:void(location.href = 'mailto:' + ['{{ email[0] }}','{{ email[1] }}'].join('@'))
72
114
  {%- endcapture -%}
73
115
  {% when 'rss' %}
74
116
  {% assign url = '/feed.xml' | relative_url %}
@@ -8,13 +8,14 @@ layout: compress
8
8
 
9
9
  {% include lang.html %}
10
10
 
11
- {% if site.theme_mode %}
12
- {% capture prefer_mode %}data-mode="{{ site.theme_mode }}"{% endcapture %}
13
- {% endif %}
14
-
15
11
  <!-- `site.alt_lang` can specify a language different from the UI -->
16
- <html lang="{{ page.lang | default: site.alt_lang | default: site.lang }}" {{ prefer_mode }}>
17
- {% include head.html %}
12
+ <html
13
+ lang="{{ page.lang | default: site.alt_lang | default: site.lang }}"
14
+ {%- if site.theme_mode == 'light' or site.theme_mode == 'dark' -%}
15
+ data-bs-theme="{{ site.theme_mode }}"
16
+ {%- endif -%}
17
+ >
18
+ {% include head.html lang=lang %}
18
19
 
19
20
  <body>
20
21
  {% include sidebar.html lang=lang %}
data/_layouts/post.html CHANGED
@@ -113,9 +113,7 @@ script_includes:
113
113
  <dialog id="toc-popup" class="p-0">
114
114
  <div class="header d-flex flex-row align-items-center justify-content-between">
115
115
  <div class="label text-truncate py-2 ms-4">{{- page.title -}}</div>
116
- <button id="toc-popup-close" type="button" class="btn mx-1 my-1 opacity-75">
117
- <i class="fas fa-close"></i>
118
- </button>
116
+ <button id="toc-popup-close" type="button" class="btn-close btn-sm mx-3" aria-label="Close"></button>
119
117
  </div>
120
118
  <div id="toc-popup-content" class="px-4 py-3 pb-4"></div>
121
119
  </dialog>
@@ -126,16 +124,21 @@ script_includes:
126
124
  </div>
127
125
 
128
126
  <div class="post-tail-wrapper text-muted">
129
- <!-- categories -->
130
- {% if page.categories.size > 0 %}
131
- <div class="post-meta mb-3">
132
- <i class="far fa-folder-open fa-fw me-1"></i>
133
- {% for category in page.categories %}
134
- <a href="{{ site.baseurl }}/categories/{{ category | slugify | url_encode }}/">{{ category }}</a>
135
- {%- unless forloop.last -%},{%- endunless -%}
136
- {% endfor %}
137
- </div>
138
- {% endif %}
127
+ <div class="d-flex justify-content-between align-items-center gap-3 mb-3">
128
+ <!-- categories -->
129
+ {% if page.categories.size > 0 %}
130
+ <div class="post-meta">
131
+ <i class="far fa-folder-open fa-fw me-1"></i>
132
+ {% for category in page.categories %}
133
+ <a href="{{ site.baseurl }}/categories/{{ category | slugify | url_encode }}/">{{ category }}</a>
134
+ {%- unless forloop.last -%},{%- endunless -%}
135
+ {% endfor %}
136
+ </div>
137
+ {% endif %}
138
+
139
+ <!-- "Edit this post" link -->
140
+ {% include post-edit.html lang=lang %}
141
+ </div>
139
142
 
140
143
  <!-- tags -->
141
144
  {% if page.tags.size > 0 %}
@@ -1,3 +1,9 @@
1
+ @mixin color-scheme($mode) {
2
+ @media (prefers-color-scheme: #{$mode}) {
3
+ @content;
4
+ }
5
+ }
6
+
1
7
  @mixin text-ellipsis {
2
8
  overflow: hidden;
3
9
  text-overflow: ellipsis;
@@ -28,3 +28,9 @@ $code-icon-width: 1.75rem !default;
28
28
 
29
29
  $font-family-base: 'Source Sans Pro', 'Microsoft Yahei', sans-serif !default;
30
30
  $font-family-heading: Lato, 'Microsoft Yahei', sans-serif !default;
31
+
32
+ /* Theme mode settings */
33
+
34
+ $theme-attr: 'data-bs-theme'; /* the attribute used to indicate the resolved theme */
35
+ $theme-options: light, dark;
36
+ $theme: null !default; /* set by Jekyll site configuration */
@@ -1,3 +1,4 @@
1
+ @use 'sass:list';
1
2
  @use '../abstracts/variables' as v;
2
3
  @use '../abstracts/breakpoints' as bp;
3
4
  @use '../abstracts/mixins' as mx;
@@ -5,32 +6,36 @@
5
6
  @use '../themes/light';
6
7
  @use '../themes/dark';
7
8
 
8
- :root {
9
- font-size: 16px;
9
+ $enable-dual: not list.index(v.$theme-options, v.$theme);
10
+ $enable-light: v.$theme == light or $enable-dual;
11
+ $enable-dark: v.$theme == dark or $enable-dual;
12
+
13
+ @if $enable-light {
14
+ :root[#{v.$theme-attr}='light'] {
15
+ @include light.styles;
16
+ }
10
17
  }
11
18
 
12
- html {
13
- @media (prefers-color-scheme: light) {
14
- &:not([data-mode]),
15
- &[data-mode='light'] {
19
+ @if $enable-dark {
20
+ :root[#{v.$theme-attr}='dark'] {
21
+ @include dark.styles;
22
+ }
23
+ }
24
+
25
+ @if $enable-dual {
26
+ :root:not([#{v.$theme-attr}]) {
27
+ @include mx.color-scheme(light) {
16
28
  @include light.styles;
17
29
  }
18
30
 
19
- &[data-mode='dark'] {
31
+ @include mx.color-scheme(dark) {
20
32
  @include dark.styles;
21
33
  }
22
34
  }
35
+ }
23
36
 
24
- @media (prefers-color-scheme: dark) {
25
- &:not([data-mode]),
26
- &[data-mode='dark'] {
27
- @include dark.styles;
28
- }
29
-
30
- &[data-mode='light'] {
31
- @include light.styles;
32
- }
33
- }
37
+ :root {
38
+ font-size: 16px;
34
39
 
35
40
  @include bp.lg {
36
41
  overflow-y: scroll;
@@ -369,7 +374,9 @@ main {
369
374
  box-shadow: none;
370
375
  border-color: var(--input-focus-border-color) !important;
371
376
  background: center !important;
372
- transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
377
+ transition:
378
+ background-color 0.15s ease-in-out,
379
+ border-color 0.15s ease-in-out;
373
380
  }
374
381
 
375
382
  .left {
@@ -391,8 +398,9 @@ main {
391
398
 
392
399
  /* MathJax */
393
400
  mjx-container {
394
- overflow-y: hidden;
395
- min-width: auto !important;
401
+ a {
402
+ display: inline-block;
403
+ }
396
404
  }
397
405
 
398
406
  @media (hover: hover) {
@@ -78,7 +78,7 @@ code {
78
78
  }
79
79
 
80
80
  a > &.highlighter-rouge {
81
- padding-bottom: 0; /* show link's underlinke */
81
+ padding-bottom: 0; /* show link's underline */
82
82
  color: inherit;
83
83
  }
84
84
 
@@ -137,7 +137,8 @@ div[class^='language-'] {
137
137
  height: v.$code-dot-size;
138
138
  border-radius: 50%;
139
139
  background-color: var(--code-header-muted-color);
140
- box-shadow: (v.$code-dot-size + v.$code-dot-gap) 0 0
140
+ box-shadow:
141
+ (v.$code-dot-size + v.$code-dot-gap) 0 0
141
142
  var(--code-header-muted-color),
142
143
  (v.$code-dot-size + v.$code-dot-gap) * 2 0 0
143
144
  var(--code-header-muted-color);
@@ -218,8 +219,9 @@ div {
218
219
  @extend %rounded;
219
220
 
220
221
  border: 1px solid transparent;
221
- height: v.$code-header-height;
222
- width: v.$code-header-height;
222
+ height: 2rem;
223
+ width: 2rem;
224
+ margin-right: 0.125rem;
223
225
  padding: 0;
224
226
  background-color: inherit;
225
227
 
@@ -233,6 +235,7 @@ div {
233
235
  }
234
236
 
235
237
  i {
238
+ font-size: 90%;
236
239
  color: var(--clipboard-checked-color);
237
240
  }
238
241
  }
@@ -7,49 +7,41 @@
7
7
  @-webkit-keyframes popup {
8
8
  from {
9
9
  opacity: 0;
10
- bottom: 0;
10
+ bottom: 10%;
11
11
  }
12
12
  }
13
13
 
14
14
  @keyframes popup {
15
15
  from {
16
16
  opacity: 0;
17
- bottom: 0;
18
- }
19
- }
20
-
21
- .toast-header {
22
- background: none;
23
- border-bottom: none;
24
- color: inherit;
25
- }
26
-
27
- .toast-body {
28
- font-family: Lato, sans-serif;
29
- line-height: 1.25rem;
30
-
31
- button {
32
- font-size: 90%;
33
- min-width: 4rem;
17
+ bottom: 10%;
34
18
  }
35
19
  }
36
20
 
37
21
  &.toast {
38
22
  &.show {
39
- display: block;
40
- min-width: 20rem;
41
- border-radius: 0.5rem;
42
23
  -webkit-backdrop-filter: blur(10px);
43
24
  backdrop-filter: blur(10px);
44
- background-color: rgb(255 255 255 / 50%);
45
- color: #1b1b1eba;
46
25
  position: fixed;
47
26
  left: 50%;
48
- bottom: 20%;
27
+ bottom: 30%;
49
28
  transform: translateX(-50%);
50
29
  -webkit-animation: popup 0.8s;
51
30
  animation: popup 0.8s;
52
31
  }
32
+
33
+ .toast-body {
34
+ line-height: 1.25rem;
35
+ font-family: v.$font-family-heading;
36
+ }
37
+
38
+ button[aria-label='Update'] {
39
+ font-size: 0.8rem;
40
+ }
41
+
42
+ .btn-close {
43
+ font-size: 0.625rem;
44
+ }
53
45
  }
54
46
  }
55
47
 
@@ -101,10 +93,7 @@
101
93
  }
102
94
 
103
95
  button {
104
- > i {
105
- font-size: 1.25rem;
106
- vertical-align: middle;
107
- }
96
+ font-size: 0.75rem;
108
97
 
109
98
  &:focus-visible {
110
99
  box-shadow: none;
@@ -17,7 +17,6 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
17
17
  overflow-y: auto;
18
18
  width: v.$sidebar-width;
19
19
  background: var(--sidebar-bg);
20
- border-right: 1px solid var(--sidebar-border-color);
21
20
 
22
21
  /* Hide scrollbar for IE, Edge and Firefox */
23
22
  -ms-overflow-style: none; /* IE and Edge */
@@ -76,11 +75,12 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
76
75
  }
77
76
 
78
77
  .profile-wrapper {
79
- @include mx.mt-mb(2.5rem);
80
78
  @extend %clickable-transition;
81
79
 
82
80
  padding-left: 2.5rem;
83
81
  padding-right: 1.25rem;
82
+ margin-top: 2.5rem;
83
+ margin-bottom: 1rem;
84
84
  width: 100%;
85
85
 
86
86
  @include bp.lg {
@@ -105,6 +105,8 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
105
105
  letter-spacing: 0.25px;
106
106
  margin-top: 1.25rem;
107
107
  margin-bottom: 0.5rem;
108
+ width: -webkit-fit-content;
109
+ width: -moz-fit-content;
108
110
  width: fit-content;
109
111
  color: var(--site-title-color);
110
112
  }
@@ -114,6 +116,7 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
114
116
  color: var(--site-subtitle-color);
115
117
  margin-top: 0.25rem;
116
118
  word-spacing: 1px;
119
+ height: 3rem;
117
120
  -webkit-user-select: none;
118
121
  -moz-user-select: none;
119
122
  -ms-user-select: none;
@@ -207,7 +210,7 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
207
210
  }
208
211
  }
209
212
 
210
- a {
213
+ > a {
211
214
  @extend %button;
212
215
  @extend %sidebar-link-hover;
213
216
  @extend %clickable-transition;
@@ -227,13 +230,102 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
227
230
 
228
231
  #mode-toggle {
229
232
  @extend %button;
230
- @extend %sidebar-links;
231
233
  @extend %sidebar-link-hover;
234
+ @extend %clickable-transition;
235
+
236
+ > i {
237
+ display: none;
238
+
239
+ @at-root :root[data-bs-theme='light'][data-theme-persisted]
240
+ &[data-theme-mode='light'] {
241
+ display: block;
242
+ }
243
+
244
+ @at-root :root[data-bs-theme='dark'][data-theme-persisted]
245
+ &[data-theme-mode='dark'] {
246
+ display: block;
247
+ }
248
+
249
+ @at-root :root:not([data-theme-persisted]) &[data-theme-mode='system'] {
250
+ display: block;
251
+ }
252
+ }
253
+
254
+ @-webkit-keyframes menu-pop {
255
+ from {
256
+ opacity: 0;
257
+ translate: 0 0.5rem;
258
+ }
259
+
260
+ to {
261
+ opacity: 1;
262
+ translate: 0 0;
263
+ }
264
+ }
265
+
266
+ @keyframes menu-pop {
267
+ from {
268
+ opacity: 0;
269
+ translate: 0 0.5rem;
270
+ }
271
+
272
+ to {
273
+ opacity: 1;
274
+ translate: 0 0;
275
+ }
276
+ }
277
+
278
+ + .dropdown-menu {
279
+ background-color: var(--menu-bg);
280
+ border-color: var(--menu-border-color);
281
+ box-shadow: var(--menu-shadow-color) 0 1px 4px;
282
+ border-radius: 0.75rem !important;
283
+
284
+ &.show {
285
+ display: flex;
286
+ flex-direction: column;
287
+ gap: 0.25rem;
288
+ left: -0.25rem !important;
289
+ -webkit-animation: menu-pop 0.2s ease-out;
290
+ animation: menu-pop 0.2s ease-out;
291
+ }
292
+
293
+ .dropdown-item {
294
+ border-radius: 0.5rem;
295
+ color: var(--sidebar-muted-color);
296
+ font-size: 90%;
297
+
298
+ &.active {
299
+ font-weight: 600;
300
+ color: var(--menu-active-color);
301
+
302
+ &::after {
303
+ content: '\f00c';
304
+ font: var(--fa-font-solid);
305
+ font-size: 0.75rem;
306
+ color: var(--sidebar-btn-color);
307
+ margin-left: auto;
308
+ padding-left: 1rem;
309
+ }
310
+ }
311
+
312
+ &:active,
313
+ &:hover,
314
+ &.active {
315
+ background-color: var(--menu-highlight-bg);
316
+ }
317
+
318
+ > i {
319
+ color: var(--sidebar-btn-color);
320
+ margin-right: 0.5rem;
321
+ }
322
+ }
323
+ }
232
324
  }
233
325
 
234
326
  .icon-border {
235
327
  @extend %no-cursor;
236
- @include mx.ml-mr(calc((v.$sb-btn-gap - $btn-border-width) / 2));
328
+ @include mx.ml-mr(0.6rem);
237
329
 
238
330
  background-color: var(--sidebar-btn-color);
239
331
  content: '';
@@ -241,10 +333,6 @@ $sidebar-display: 'sidebar-display'; /* the attribute for sidebar display */
241
333
  height: $btn-border-width;
242
334
  border-radius: 50%;
243
335
  margin-bottom: $btn-mb;
244
-
245
- @include bp.xxxl {
246
- @include mx.ml-mr(calc((v.$sb-btn-gap-lg - $btn-border-width) / 2));
247
- }
248
336
  }
249
337
  } /* .sidebar-bottom */
250
338
  } /* #sidebar */
@@ -112,7 +112,7 @@
112
112
  }
113
113
 
114
114
  a {
115
- /* post title in Archvies */
115
+ /* post title in Archives */
116
116
  margin-left: 2.5rem;
117
117
  position: relative;
118
118
  top: 0.1rem;
@@ -127,7 +127,7 @@ header {
127
127
 
128
128
  .share-mastodon {
129
129
  /* See: https://github.com/justinribeiro/share-to-mastodon#properties */
130
- --wc-stm-font-family: v.$font-family-base;
130
+ --wc-stm-font-family: #{v.$font-family-base};
131
131
  --wc-stm-dialog-background-color: var(--card-bg);
132
132
  --wc-stm-form-button-border: 1px solid var(--btn-border-color);
133
133
  --wc-stm-form-submit-background-color: var(--sidebar-btn-bg);
@@ -148,6 +148,16 @@ header {
148
148
  }
149
149
  }
150
150
 
151
+ .post-edit {
152
+ line-height: 1.2rem;
153
+
154
+ > a {
155
+ &:hover {
156
+ @extend %link-hover;
157
+ }
158
+ }
159
+ }
160
+
151
161
  .post-navigation {
152
162
  @include bp.lt(bp.get(lg)) {
153
163
  @include mx.pl-pr(0);
@@ -30,6 +30,11 @@
30
30
  rgb(58 55 55 / 40%) 50%,
31
31
  rgb(255 255 255 / 0%) 100%
32
32
  );
33
+ --menu-bg: rgb(30 30 30);
34
+ --menu-border-color: rgb(77 77 77 / 60%);
35
+ --menu-shadow-color: rgb(4 4 4 / 42%);
36
+ --menu-active-color: rgb(240 248 255 / 63%);
37
+ --menu-highlight-bg: rgb(90 91 92 / 12%);
33
38
 
34
39
  /* Sidebar */
35
40
  --site-title-color: #717070;
@@ -67,8 +72,8 @@
67
72
  --btn-share-hover-color: #bfc1ca;
68
73
  --card-bg: #1e1e1e;
69
74
  --card-hover-bg: #464d51;
70
- --card-shadow: rgb(21 21 21 / 72%) 0 6px 18px 0,
71
- rgb(137 135 135 / 24%) 0 0 0 1px;
75
+ --card-shadow:
76
+ rgb(21 21 21 / 72%) 0 6px 18px 0, rgb(137 135 135 / 24%) 0 0 0 1px;
72
77
  --kbd-wrap-color: #6a6a6a;
73
78
  --kbd-text-color: #d3d3d3;
74
79
  --kbd-bg-color: #242424;
@@ -27,6 +27,11 @@
27
27
  rgb(232 230 230 / 100%) 50%,
28
28
  rgb(250 250 250 / 0%) 100%
29
29
  );
30
+ --menu-bg: white;
31
+ --menu-border-color: white;
32
+ --menu-shadow-color: rgb(0 0 0 / 16%);
33
+ --menu-active-color: rgb(91 91 91);
34
+ --menu-highlight-bg: rgb(243 244 245 / 50%);
30
35
 
31
36
  /* Sidebar */
32
37
  --site-title-color: rgb(113 113 113);
@@ -59,8 +64,8 @@
59
64
  --btn-share-hover-color: #0d6efd;
60
65
  --card-bg: white;
61
66
  --card-hover-bg: #e2e2e2;
62
- --card-shadow: rgb(104 104 104 / 5%) 0 2px 6px 0,
63
- rgb(211 209 209 / 15%) 0 0 0 1px;
67
+ --card-shadow:
68
+ rgb(104 104 104 / 5%) 0 2px 6px 0, rgb(211 209 209 / 15%) 0 0 0 1px;
64
69
  --footnote-target-bg: lightcyan;
65
70
  --tb-odd-bg: #fbfcfd;
66
71
  --tb-border-color: #eaeaea;