hexo-theme-stellar/source/css/_defines/theme.styl

37 lines
1.2 KiB
Stylus

:root
--site-bg: $light-site-bg
--block: $light-block
--block-border: darken($light-block, 5)
--block-hover: darken($light-block, 2)
--text-p0: $light-title
--text-p1: $light-text
--text-p2: mix($light-text, $light-site-bg, 80)
--text-p3: mix($light-text, $light-site-bg, 60)
--text-meta: mix($light-text, $light-site-bg, 20)
--card: $light-card
--theme-highlight: darken($color-theme, 5)
--theme-bg: mix($color-theme, $light-card, 10)
if hexo-config('style.darkmode') == 'auto'
// dark
@media (prefers-color-scheme: dark)
:root
--site-bg: $dark-site-bg
--block: $dark-block
--block-border: lighten($dark-block, 10)
--block-hover: darken($dark-block, 1)
--text-p0: $dark-title
--text-p1: $dark-text
--text-p2: mix($dark-text, $dark-site-bg, 70)
--text-p3: mix($dark-text, $dark-site-bg, 45)
--text-meta: mix($dark-text, $dark-site-bg, 30)
--card: $dark-card
--theme-highlight: $color-theme
--theme-bg: mix($color-theme, $dark-card, 10)
@media screen and (max-width: $device-tablet)
--site-bg: $dark-site-bg-mobile
@media (prefers-color-scheme: dark)
html
filter: brightness(80%) !important