diff options
Diffstat (limited to 'assets/scss/_fuji-theme/_style.scss')
| -rw-r--r-- | assets/scss/_fuji-theme/_style.scss | 392 |
1 files changed, 196 insertions, 196 deletions
diff --git a/assets/scss/_fuji-theme/_style.scss b/assets/scss/_fuji-theme/_style.scss index f731fa2..dc4ef44 100644 --- a/assets/scss/_fuji-theme/_style.scss +++ b/assets/scss/_fuji-theme/_style.scss @@ -1,156 +1,156 @@ ::selection, ::-moz-selection { - color: var(--color-bg); - background-color: var(--color-primary); + color: var(--color-bg); + background-color: var(--color-primary); } body { - background-color: var(--color-bg); - color: var(--color-font); + background-color: var(--color-bg); + color: var(--color-font); - @include link-1(); + @include link-1(); } .post-summary, .post-meta { - @include link-2(); + @include link-2(); } .pag-current a, .pag-current a:hover { - color: var(--color-focus); + color: var(--color-focus); } .title-sub, .post-meta { - color: var(--color-mute); + color: var(--color-mute); } header, .page-info { - border-bottom: $divider; + border-bottom: $divider; } .post + .post, .pagination, footer { - border-top: $divider; + border-top: $divider; } .post-meta-archive { - @include link-2(); + @include link-2(); - color: var(--color-mute); + color: var(--color-mute); } @media screen and (max-width: $width-md) { - .sidebar { - border-top: $divider; - } + .sidebar { + border-top: $divider; + } } // single page part .post-content { - @include link-2(); + @include link-2(); } .markdown-body { - h1, - h2, - h3, - h4, - h5, - h6 { - color: var(--color-primary); - } - - strong, - em { - color: var(--color-secondary); - } - - h1, - h2 { - border-bottom: $divider; - } + h1, + h2, + h3, + h4, + h5, + h6 { + color: var(--color-primary); + } + + strong, + em { + color: var(--color-secondary); + } + + h1, + h2 { + border-bottom: $divider; + } - blockquote { - color: var(--color-mute); - } + blockquote { + color: var(--color-mute); + } - img { - border-radius: 2px; - background-color: inherit; // fix white pixels under border-radius - } + img { + border-radius: 2px; + background-color: inherit; // fix white pixels under border-radius + } - hr { - height: 2px; - } + hr { + height: 2px; + } - pre, - code { - background-color: var(--color-codebg); - } + pre, + code { + background-color: var(--color-codebg); + } } .post-loading { - border-top: $divider; + border-top: $divider; } .post-comment { - border-top: $divider; + border-top: $divider; - span.post-comment-notloaded { - padding: 1.5rem 0; - color: var(--color-secondary); - cursor: pointer; + span.post-comment-notloaded { + padding: 1.5rem 0; + color: var(--color-secondary); + cursor: pointer; - &:hover { - color: var(--color-focus); - } + &:hover { + color: var(--color-focus); } + } } // components .btn { - div { - background-color: var(--color-divider); + div { + background-color: var(--color-divider); - color: var(--color-primary); - } + color: var(--color-primary); + } - div:hover { - background-color: var(--color-primary); - color: var(--color-divider); - } + div:hover { + background-color: var(--color-primary); + color: var(--color-divider); + } - div + div { - border-top: 2px solid var(--color-bg); - } + div + div { + border-top: 2px solid var(--color-bg); + } } // prism.js theme [solarized-light] code[class*='language-'], pre[class*='language-'] { - -moz-tab-size: 4; - -o-tab-size: 4; - tab-size: 4; + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; } .token.comment, .token.prolog, .token.doctype, .token.cdata { - color: #93a1a1; /* base1 */ + color: #93a1a1; /* base1 */ } .token.punctuation { - color: #586e75; /* base01 */ + color: #586e75; /* base01 */ } .token.namespace { - opacity: 0.7; + opacity: 0.7; } .token.property, @@ -160,7 +160,7 @@ pre[class*='language-'] { .token.constant, .token.symbol, .token.deleted { - color: #268bd2; /* blue */ + color: #268bd2; /* blue */ } .token.selector, @@ -170,188 +170,188 @@ pre[class*='language-'] { .token.builtin, .token.url, .token.inserted { - color: #2aa198; /* cyan */ + color: #2aa198; /* cyan */ } .token.entity { - color: #657b83; /* base00 */ - background: #eee8d5; /* base2 */ + color: #657b83; /* base00 */ + background: #eee8d5; /* base2 */ } .token.atrule, .token.attr-value, .token.keyword { - color: #859900; /* green */ + color: #859900; /* green */ } .token.function, .token.class-name { - color: #b58900; /* yellow */ + color: #b58900; /* yellow */ } .token.regex, .token.important, .token.variable { - color: #cb4b16; /* orange */ + color: #cb4b16; /* orange */ } .token.important, .token.bold { - font-weight: 600; + font-weight: 600; } .token.italic { - font-style: italic; + font-style: italic; } // fix conflicts of primer css & prism.js style pre, code { - .rule { - margin: 0; - border-bottom: none; - overflow: inherit; - - &::before, - &::after { - display: inherit; - clear: inherit; - } + .rule { + margin: 0; + border-bottom: none; + overflow: inherit; + + &::before, + &::after { + display: inherit; + clear: inherit; } + } } // disqus js styles #dsqjs { - a { - text-decoration: none !important; - color: var(--color-secondary) !important; - } + a { + text-decoration: none !important; + color: var(--color-secondary) !important; + } - a:hover { - color: var(--color-focus) !important; - } + a:hover { + color: var(--color-focus) !important; + } - .dsqjs-bullet::after { - color: var(--color-mute) !important; - font-weight: 600 !important; - } + .dsqjs-bullet::after { + color: var(--color-mute) !important; + font-weight: 600 !important; + } - .dsqjs-no-comment { - color: var(--color-font) !important; - } + .dsqjs-no-comment { + color: var(--color-font) !important; + } - .dsqjs-nav-tab { - color: var(--color-mute) !important; - } + .dsqjs-nav-tab { + color: var(--color-mute) !important; + } - .dsqjs-tab-active { - color: var(--color-font) !important; + .dsqjs-tab-active { + color: var(--color-font) !important; - & > span:after { - background-color: var(--color-secondary) !important; - } + & > span:after { + background-color: var(--color-secondary) !important; } + } - .dsqjs-post-list { - .dsqjs-post-avatar { - background: var(--color-bg) !important; - } - - .dsqjs-post-header { - .dsqjs-post-author { - color: var(--color-mute) !important; - font-weight: 600; - } - - .dsqjs-admin-badge { - color: var(--color-font) !important; - background: var(--color-codebg) !important; - } - - .dsqjs-meta { - color: var(--color-mute) !important; - } - } + .dsqjs-post-list { + .dsqjs-post-avatar { + background: var(--color-bg) !important; } - .dsqjs-post-body { - color: var(--color-font) !important; - - code, - pre { - background: var(--color-codebg) !important; - } - - blockquote { - color: var(--color-codebg) !important; - border-left: 0.25em solid var(--color-divider) !important; - } - } + .dsqjs-post-header { + .dsqjs-post-author { + color: var(--color-mute) !important; + font-weight: 600; + } - .dsqjs-load-more { - background: var(--color-mute) !important; - color: var(--color-bg) !important; - } + .dsqjs-admin-badge { + color: var(--color-font) !important; + background: var(--color-codebg) !important; + } - footer { - border-top: 2px solid var(--color-divider) !important; - font-weight: 600 !important; + .dsqjs-meta { color: var(--color-mute) !important; + } } + } - .dsqjs-order-radio:checked + .dsqjs-order-label { - color: var(--color-font) !important; - background-color: var(--color-divider) !important; - } + .dsqjs-post-body { + color: var(--color-font) !important; - .dsqjs-order-label { - background-color: var(--color-bg) !important; + code, + pre { + background: var(--color-codebg) !important; } - p.dsqjs-has-more a.dsqjs-has-more-btn { - color: var(--color-mute) !important; + blockquote { + color: var(--color-codebg) !important; + border-left: 0.25em solid var(--color-divider) !important; } + } + + .dsqjs-load-more { + background: var(--color-mute) !important; + color: var(--color-bg) !important; + } + + footer { + border-top: 2px solid var(--color-divider) !important; + font-weight: 600 !important; + color: var(--color-mute) !important; + } + + .dsqjs-order-radio:checked + .dsqjs-order-label { + color: var(--color-font) !important; + background-color: var(--color-divider) !important; + } + + .dsqjs-order-label { + background-color: var(--color-bg) !important; + } + + p.dsqjs-has-more a.dsqjs-has-more-btn { + color: var(--color-mute) !important; + } } .search-result-info { - border-bottom: $divider; + border-bottom: $divider; } .search-input { + border-top: 2px solid; + border-left: 2px solid; + border-bottom: 2px solid; + border-right: none; + border-radius: 0.25rem; + border-color: var(--color-divider); + background-color: var(--color-bg); + + &:hover, + &:focus-within { + color: var(--color-primary); + border-color: var(--color-primary); + } + + input { + outline: none; + border: none; + color: inherit; + background-color: inherit; + } + + button { + outline: none; border-top: 2px solid; - border-left: 2px solid; + border-left: none; + border-right: 2px solid; border-bottom: 2px solid; - border-right: none; - border-radius: 0.25rem; - border-color: var(--color-divider); - background-color: var(--color-bg); - - &:hover, - &:focus-within { - color: var(--color-primary); - border-color: var(--color-primary); - } - - input { - outline: none; - border: none; - color: inherit; - background-color: inherit; - } + border-radius: 0 0.25rem 0.25rem 0; + border-color: inherit; + color: inherit; + background-color: inherit; - button { - outline: none; - border-top: 2px solid; - border-left: none; - border-right: 2px solid; - border-bottom: 2px solid; - border-radius: 0 0.25rem 0.25rem 0; - border-color: inherit; - color: inherit; - background-color: inherit; - - &:hover { - color: var(--color-secondary); - } + &:hover { + color: var(--color-secondary); } + } } |