diff options
Diffstat (limited to 'assets/scss/_fuji-theme/_light.scss')
-rw-r--r-- | assets/scss/_fuji-theme/_light.scss | 135 |
1 files changed, 135 insertions, 0 deletions
diff --git a/assets/scss/_fuji-theme/_light.scss b/assets/scss/_fuji-theme/_light.scss new file mode 100644 index 0000000..02749ed --- /dev/null +++ b/assets/scss/_fuji-theme/_light.scss @@ -0,0 +1,135 @@ +$color-primary: #8aa2d3; // https://irocore.com/aofuji/ +$color-primary-dark: #3b469b; // https://irocore.com/aomurasaki/ +$color-secondary: #8f82bc; // https://irocore.com/fujimurasaki/ +$color-mute: #9ea1a3; // https://irocore.com/suzu-iro/ +$color-font: #3f4551; // https://irocore.com/konnezu/ +$color-divider: #e5e2e4; // https://irocore.com/komachinezu/ +$color-bg: #fffffd; // https://irocore.com/shiro/ + +$divider: 2px solid $color-divider; + +@mixin link-1 { + a { + color: $color-primary; + } + + a:hover { + color: $color-secondary; + } +} + +@mixin link-2 { + a { + color: $color-secondary; + } + + a:hover { + color: $color-primary-dark; + } +} + +body[data-theme='light'] { + background-color: $color-bg; + color: $color-font; + + @include link-1(); + + .post-summary, + .post-meta { + @include link-2(); + } + + .pag-current a, + .pag-current a:hover { + color: $color-primary-dark; + } + + .title-sub, + .post-meta { + color: $color-mute; + } + + header, + .page-info { + border-bottom: $divider; + } + + .post + .post, + .pagination, + footer { + border-top: $divider; + } + + .post-meta-archive { + @include link-2(); + + color: $color-mute; + } + + @media screen and (max-width: $width-md) { + .sidebar { + border-top: $divider; + } + } + + // single page part + .post-content { + @include link-2(); + } + + .markdown-body { + h1, + h2, + h3, + h4, + h5, + h6 { + color: $color-primary; + } + + h1, + h2 { + border-bottom: $divider; + } + + blockquote { + color: $color-mute; + } + + img { + border-radius: 2px; + background-color: inherit; // fix white pixels under border-radius + } + + hr { + height: 2px; + } + } + + .post-loading, + .post-comment .utterances-frame, + .post-comment #disqus_thread { + border-top: $divider; + } + + // components + .btn { + div { + background-color: $color-divider; + + color: $color-primary; + } + + div:hover { + background-color: $color-primary; + color: $color-divider; + } + + div + div { + border-top: 2px solid $color-bg; + } + } + + // prism.js theme [olarized-light] + @import '../../css/prism-solarizedlight'; +} |