vuepress-theme-justskiv
Version:
A flat and clean Blog Theme for VuePress site
84 lines (79 loc) • 3.06 kB
text/stylus
$lightMode =
--theme-background #f1f1f1
--theme-accent-color $accentColor
--theme-foreground-color: $textColor;
--theme-border-color: $borderColor;
--theme-sidebar-background: $accentColor linear-gradient(to bottom, $accentColor 0%, darken($accentColor, 20%) 100%);
--theme-card-background: #ffffff;
--theme-highlight-00: #e3eaf2;
--theme-highlight-01: #d0dae7;
--theme-highlight-01-048: alpha(#d0dae7, .48);
--theme-highlight-02: #8da1b9;
--theme-highlight-02-048: alpha(#8da1b9, .48);
--theme-highlight-03: #3c526d;
--theme-highlight-03-085: alpha(#3c526d, .85);
--theme-highlight-04: #111b27;
--theme-highlight-05: #006d6d;
--theme-highlight-06: #755f00;
--theme-highlight-07: #005a8e;
--theme-highlight-08: #116b00;
--theme-highlight-09: #af00af;
--theme-highlight-0a: #7c00aa;
--theme-highlight-0b: #a04900;
--theme-highlight-0c: #c22f2e;
--theme-bg-tertiary-color #f6f8fa
--theme-accent-color-005: alpha($accentColor, .05)
--theme-accent-color-01: alpha($accentColor, .1)
--theme-accent-color-02: alpha($accentColor, .2)
--theme-accent-color-04: alpha($accentColor, .4)
--theme-accent-color-08: alpha($accentColor, .8)
$darkMode =
--theme-accent-color: $dark_accentColor;
--theme-foreground-color: $dark_textColor;
--theme-border-color: $dark_borderColor;
--theme-background: #202020;
--theme-sidebar-background: #262626;
--theme-card-background: $dark_cardBackgroundColor;
--theme-highlight-00: #111b27;
--theme-highlight-01: #213043;
--theme-highlight-01-048: alpha(#213043, .48);
--theme-highlight-02: #3c526d;
--theme-highlight-02-048: alpha(#3c526d, .48);
--theme-highlight-03: #8da1b9;
--theme-highlight-03-085: alpha(#8da1b9, .85);
--theme-highlight-04: #e3eaf2;
--theme-highlight-05: #66cccc;
--theme-highlight-06: #e6d37a;
--theme-highlight-07: #6cb8e6;
--theme-highlight-08: #91d076;
--theme-highlight-09: #f4adf4;
--theme-highlight-0a: #c699e3;
--theme-highlight-0b: #e9ae7e;
--theme-highlight-0c: #cd6660;
--theme-card-color: #252525;
--theme-bg-tertiary-color #161b22
--theme-accent-color-005: alpha($dark_accentColor, .05)
--theme-accent-color-01: alpha($dark_accentColor, .1)
--theme-accent-color-02: alpha($dark_accentColor, .2)
--theme-accent-color-04: alpha($dark_accentColor, .4)
--theme-accent-color-08: alpha($dark_accentColor, .8)
html
--theme-content-width: 900px;
--theme-font-base: 'Roboto','PingFang SC','Microsoft YaHei';
--theme-font-logo: 'Roboto','PingFang SC','Microsoft YaHei';
//--theme-font-menu: IM Fell DW Pica SC,'Josefin Sans','PingFang SC','Microsoft YaHei';
//--theme-font-heading: impact,'Josefin Sans','PingFang SC','Microsoft YaHei';
//--theme-font-label: Sarpanch,'Josefin Sans','PingFang SC','Microsoft YaHei';
--theme-font-print: 'Roboto','PingFang SC','Microsoft YaHei';
{$lightMode}
@media (prefers-color-scheme: dark)
html
{$darkMode}
.float-menu:before
box-shadow none
html.light
{$lightMode}
html.dark
{$darkMode}
.float-menu:before
box-shadow none