2022-12-10 15:49:59 +08:00
|
|
|
$dynamic-background-h = hue($dynamic-background)
|
|
|
|
|
$dynamic-background-s = saturation($dynamic-background)
|
|
|
|
|
$dynamic-background-l = lightness($dynamic-background)
|
|
|
|
|
|
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-12-10 15:49:59 +08:00
|
|
|
$dynamic-code-h = hue($dynamic-code)
|
|
|
|
|
$dynamic-code-s = saturation($dynamic-code)
|
|
|
|
|
$dynamic-code-l = lightness($dynamic-code)
|
|
|
|
|
|
|
|
|
|
$dynamic-text-h = hue($dynamic-text)
|
|
|
|
|
$dynamic-text-s = saturation($dynamic-text)
|
|
|
|
|
$dynamic-text-l = lightness($dynamic-text)
|
|
|
|
|
|
2022-11-04 23:13:01 +08:00
|
|
|
set_text_dark()
|
2022-12-10 15:49:59 +08:00
|
|
|
--text-p0: hsl($dynamic-text-h, $dynamic-text-s, 0)
|
|
|
|
|
--text-p1: hsl($dynamic-text-h, $dynamic-text-s, $dynamic-text-l)
|
|
|
|
|
--text-p2: hsl($dynamic-text-h, $dynamic-text-s, $dynamic-text-l / 0.5 * 0.75)
|
|
|
|
|
--text-p3: hsl($dynamic-text-h, $dynamic-text-s, $dynamic-text-l / 0.5 * 1.25)
|
|
|
|
|
--text-p4: hsl($dynamic-text-h, $dynamic-text-s, $dynamic-text-l / 0.5 * 1.5)
|
|
|
|
|
--text-meta: hsl($dynamic-text-h, $dynamic-text-s, $dynamic-text-l / 0.5 * 2)
|
|
|
|
|
--text-code: hsl($dynamic-code-h, $dynamic-code-s, $dynamic-code-l * 1)
|
|
|
|
|
|
|
|
|
|
set_text_light()
|
|
|
|
|
--text-p0: hsl($dynamic-text-h, $dynamic-text-s, 100)
|
|
|
|
|
--text-p1: hsl($dynamic-text-h, $dynamic-text-s, 100 - $dynamic-text-l / 0.5 * 0.25)
|
|
|
|
|
--text-p2: hsl($dynamic-text-h, $dynamic-text-s, 100 - $dynamic-text-l / 0.5 * 0.5)
|
|
|
|
|
--text-p3: hsl($dynamic-text-h, $dynamic-text-s, 100 - $dynamic-text-l / 0.5 * 1)
|
|
|
|
|
--text-p4: hsl($dynamic-text-h, $dynamic-text-s, 100 - $dynamic-text-l / 0.5 * 1.25)
|
|
|
|
|
--text-meta: hsl($dynamic-text-h, $dynamic-text-s, 100 - $dynamic-text-l / 0.5 * 1.5)
|
|
|
|
|
--text-code: hsl($dynamic-code-h, $dynamic-code-s, 48)
|
|
|
|
|
|
2022-11-04 23:13:01 +08:00
|
|
|
:root
|
2022-12-10 15:49:59 +08:00
|
|
|
--site-bg: hsl($dynamic-background-h, $dynamic-background-s, 98)
|
|
|
|
|
--card: hsl($dynamic-block-h, $dynamic-block-s, 100)
|
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()
|
2022-12-10 15:49:59 +08:00
|
|
|
--theme-bg: $color-theme
|
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-12-10 15:49:59 +08:00
|
|
|
--site-bg: hsl($dynamic-background-h, $dynamic-background-s / 2, 16)
|
|
|
|
|
--card: hsl($dynamic-block-h, $dynamic-block-s * 1.5, 25)
|
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()
|
2022-10-09 13:42:03 +08:00
|
|
|
@media screen and (max-width: $device-mobile-max)
|
2022-12-10 15:49:59 +08:00
|
|
|
--site-bg: black
|
2021-08-28 14:03:54 +08:00
|
|
|
|
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()
|
