2022-12-09 23:56:58 +08:00
|
|
|
$dynamic-block-h = hue($dynamic-block)
|
|
|
|
$dynamic-block-s = saturation($dynamic-block)
|
|
|
|
$dynamic-block-l = lightness($dynamic-block)
|
|
|
|
|
2022-11-04 23:13:01 +08:00
|
|
|
set_text_light()
|
|
|
|
--text-p0: $dark-title
|
|
|
|
--text-p1: mix($dark-text, $dark-background, 85)
|
|
|
|
--text-p2: mix($dark-text, $dark-background, 70)
|
|
|
|
--text-p3: mix($dark-text, $dark-background, 45)
|
|
|
|
--text-p4: mix($dark-text, $dark-background, 35)
|
|
|
|
--text-meta: mix($dark-text, $dark-background, 30)
|
|
|
|
--text-code: $dark-code
|
|
|
|
set_text_dark()
|
2021-04-02 20:24:16 +08:00
|
|
|
--text-p0: $light-title
|
|
|
|
--text-p1: $light-text
|
2022-10-19 13:40:18 +08:00
|
|
|
--text-p2: mix($light-text, $light-background, 80)
|
|
|
|
--text-p3: mix($light-text, $light-background, 60)
|
|
|
|
--text-p4: mix($light-text, $light-background, 35)
|
|
|
|
--text-meta: mix($light-text, $light-background, 20)
|
2021-06-23 13:41:05 +08:00
|
|
|
--text-code: $light-code
|
2022-11-04 23:13:01 +08:00
|
|
|
:root
|
|
|
|
--site-bg: $light-background
|
2021-04-02 20:24:16 +08:00
|
|
|
--card: $light-card
|
2022-12-09 23:56:58 +08:00
|
|
|
--block: hsl($dynamic-block-h, $dynamic-block-s, 95)
|
|
|
|
--block-border: hsl($dynamic-block-h, $dynamic-block-s, 90)
|
|
|
|
--block-hover: hsl($dynamic-block-h, $dynamic-block-s, 92)
|
|
|
|
--block-lighten: hsl($dynamic-block-h, $dynamic-block-s, 100)
|
2022-11-04 23:13:01 +08:00
|
|
|
set_text_dark()
|
2021-02-19 23:33:19 +08:00
|
|
|
--theme-highlight: darken($color-theme, 5)
|
2021-04-02 20:24:16 +08:00
|
|
|
--theme-bg: mix($color-theme, $light-card, 10)
|
2022-11-04 23:13:01 +08:00
|
|
|
--theme-link: $color-link
|
2021-02-19 23:33:19 +08:00
|
|
|
|
2021-08-28 14:03:54 +08:00
|
|
|
set_darkmode()
|
|
|
|
:root
|
2022-10-19 13:40:18 +08:00
|
|
|
--site-bg: $dark-background
|
2022-11-04 23:13:01 +08:00
|
|
|
--card: $dark-card
|
2022-12-09 23:56:58 +08:00
|
|
|
--block: hsl($dynamic-block-h, $dynamic-block-s, 12)
|
|
|
|
--block-border: hsl($dynamic-block-h, $dynamic-block-s, 24)
|
|
|
|
--block-hover: hsl($dynamic-block-h, $dynamic-block-s, 9)
|
|
|
|
--block-lighten: hsl($dynamic-block-h, $dynamic-block-s, 30)
|
2022-11-04 23:13:01 +08:00
|
|
|
set_text_light()
|
2021-08-28 14:03:54 +08:00
|
|
|
--theme-highlight: $color-theme
|
|
|
|
--theme-bg: mix($color-theme, $dark-card, 10)
|
2022-10-09 13:42:03 +08:00
|
|
|
@media screen and (max-width: $device-mobile-max)
|
2022-10-19 13:40:18 +08:00
|
|
|
--site-bg: $dark-background-mobile
|
2021-08-28 14:03:54 +08:00
|
|
|
--card: darken($dark-card, 6)
|
|
|
|
|
2021-04-02 20:24:16 +08:00
|
|
|
if hexo-config('style.darkmode') == 'auto'
|
|
|
|
// 系统的dark模式
|
|
|
|
@media (prefers-color-scheme: dark)
|
2021-08-28 14:03:54 +08:00
|
|
|
set_darkmode()
|
|
|
|
|
|
|
|
|
|
|
|
if hexo-config('style.darkmode') == 'always'
|
|
|
|
set_darkmode()
|