Refactor @import

This commit is contained in:
Mimi 2021-09-07 00:51:01 +08:00
parent 1be8cbb18b
commit 989157a853
24 changed files with 514 additions and 498 deletions

View File

@ -1,14 +0,0 @@
.back-to-top {
margin: 20px - $sidebar-offset -10px -20px;
opacity: 0;
transition: opacity $transition-ease;
&.back-to-top-on {
cursor: pointer;
opacity: $b2t-opacity;
&:hover {
opacity: $b2t-opacity-hover;
}
}
}

View File

@ -1,20 +1,45 @@
.back-to-top {
bottom: $b2t-position-bottom;
box-sizing: border-box;
color: $b2t-color;
padding: 0 6px;
transition: bottom $transition-ease;
sidebar-toggle();
if (hexo-config('back2top.enable')) {
.back-to-top {
font-size: $b2t-font-size;
if (not hexo-config('back2top.scrollpercent')) {
width: 24px;
}
if (not hexo-config('back2top.scrollpercent')) {
span {
display: none;
}
}
&:hover {
color: $sidebar-highlight;
}
if (hexo-config('back2top.sidebar')) {
margin: 20px - $sidebar-offset -10px -20px;
opacity: 0;
transition: opacity $transition-ease;
&.back-to-top-on {
bottom: $b2t-position-bottom-on;
&.back-to-top-on {
cursor: pointer;
opacity: $b2t-opacity;
&:hover {
opacity: $b2t-opacity-hover;
}
}
} else {
bottom: $b2t-position-bottom;
box-sizing: border-box;
color: $b2t-color;
padding: 0 6px;
transition: bottom $transition-ease;
sidebar-toggle();
if (not hexo-config('back2top.scrollpercent')) {
width: 24px;
}
&:hover {
color: $sidebar-highlight;
}
&.back-to-top-on {
bottom: $b2t-position-bottom-on;
}
}
}
}

View File

@ -1,17 +1,3 @@
if (hexo-config('back2top.enable')) {
.back-to-top {
font-size: $b2t-font-size;
if (not hexo-config('back2top.scrollpercent')) {
span {
display: none;
}
}
}
@import (hexo-config('back2top.sidebar') ? 'back-to-top-sidebar' : 'back-to-top');
}
.noscript-warning {
background-color: lighten($red, 20%);
color: white;
@ -26,7 +12,8 @@ if (hexo-config('back2top.enable')) {
z-index: $zindex-5;
}
@import 'reading-progress' if (hexo-config('reading_progress.enable'));
@import 'back-to-top';
@import 'reading-progress';
@import 'post';
@import 'pages';

View File

@ -50,5 +50,4 @@
@import 'post-footer';
@import 'post-widgets';
@import 'post-reward';
@import 'post-followme' if (hexo-config('follow_me'));
@import 'post-followme';

View File

@ -1,32 +1,34 @@
.followme {
color: $grey;
padding: 1em 1.5em;
text-align: center;
post-card();
if (hexo-config('follow_me')) {
.followme {
color: $grey;
padding: 1em 1.5em;
text-align: center;
post-card();
.social-list {
flex-wrap();
.social-list {
flex-wrap();
.social-item {
margin: .5em 2em;
.social-item {
margin: .5em 2em;
+tablet-mobile() {
margin: .5em .75em;
}
}
.social-link {
border: 0;
display:inline-block;
text-align: center;
.icon {
font-size: 1.75em;
+tablet-mobile() {
margin: .5em .75em;
}
}
.label {
display: block;
font-size: 14px;
.social-link {
border: 0;
display:inline-block;
text-align: center;
.icon {
font-size: 1.75em;
}
.label {
display: block;
font-size: 14px;
}
}
}
}

View File

@ -1,25 +1,27 @@
.reading-progress-bar {
--progress: 0;
background: unquote(hexo-config('reading_progress.color'));
height: unquote(hexo-config('reading_progress.height'));
position: fixed;
z-index: $zindex-5;
if (hexo-config('reading_progress.enable')) {
.reading-progress-bar {
--progress: 0;
background: unquote(hexo-config('reading_progress.color'));
height: unquote(hexo-config('reading_progress.height'));
position: fixed;
z-index: $zindex-5;
if (hexo-config('reading_progress.reversed')) {
width: calc(100% - var(--progress));
} else {
width: var(--progress);
}
if (hexo-config('reading_progress.reversed')) {
width: calc(100% - var(--progress));
} else {
width: var(--progress);
}
if (hexo-config('reading_progress.start_at') == 'right') {
right: 0;
} else {
left: 0;
}
if (hexo-config('reading_progress.start_at') == 'right') {
right: 0;
} else {
left: 0;
}
if (hexo-config('reading_progress.position') == 'bottom') {
bottom: 0;
} else {
top: 0;
if (hexo-config('reading_progress.position') == 'bottom') {
bottom: 0;
} else {
top: 0;
}
}
}

View File

@ -1,7 +1,9 @@
.gt-header a, .gt-comments a, .gt-popup a {
border-bottom: 0;
}
if (hexo-config('gitalk.enable')) {
.gt-header a, .gt-comments a, .gt-popup a {
border-bottom: 0;
}
.gt-container .gt-popup .gt-action.is--active::before {
top: .7em;
.gt-container .gt-popup .gt-action.is--active::before {
top: .7em;
}
}

View File

@ -1,12 +1,8 @@
@import 'gitalk' if (hexo-config('gitalk.enable'));
@import 'utterances' if (hexo-config('utterances.enable'));
@import 'search' if (hexo-config('local_search.enable') || hexo-config('algolia_search.enable'));
@import 'related-posts' if (hexo-config('related_posts.enable'));
@import 'math' if (hexo-config('math.mathjax.enable'));
@import 'gitalk';
@import 'utterances';
@import 'search';
@import 'related-posts';
@import 'math';
.use-motion .animated {
// Fix issue #48 #55

View File

@ -1,7 +1,9 @@
mjx-container[jax="CHTML"][display="true"], .has-jax {
overflow: auto hidden;
}
if (hexo-config('math.mathjax.enable')) {
mjx-container[jax="CHTML"][display="true"], .has-jax {
overflow: auto hidden;
}
mjx-container[display="true"] + br {
display: none;
mjx-container[display="true"] + br {
display: none;
}
}

View File

@ -1,21 +1,23 @@
.popular-posts-header {
border-bottom: 1px solid $gainsboro;
font-size: $font-size-large;
margin-bottom: 10px;
margin-top: $post-eof-margin-bottom;
}
if (hexo-config('related_posts.enable')) {
.popular-posts-header {
border-bottom: 1px solid $gainsboro;
font-size: $font-size-large;
margin-bottom: 10px;
margin-top: $post-eof-margin-bottom;
}
.popular-posts {
padding: 0;
.popular-posts {
padding: 0;
.popular-posts-item {
margin-left: 2em;
.popular-posts-item {
margin-left: 2em;
.popular-posts-title {
font-size: $font-size-small;
font-weight: normal;
line-height: $line-height-base * 1.2;
margin: 0;
.popular-posts-title {
font-size: $font-size-small;
font-weight: normal;
line-height: $line-height-base * 1.2;
margin: 0;
}
}
}
}

View File

@ -1,103 +1,105 @@
.search-active {
overflow: hidden;
}
.search-pop-overlay {
background: rgba(0, 0, 0, 0);
display: flex;
height: 100%;
left: 0;
position: fixed;
top: 0;
transition: visibility .4s, background .4s;
visibility: hidden;
width: 100%;
z-index: $zindex-4;
.search-active & {
background: rgba(0, 0, 0, .3);
visibility: visible;
}
}
.search-popup {
background: var(--card-bg-color);
border-radius: 5px;
height: 80%;
margin: auto;
transform: scale(0);
transition: transform .4s;
width: 700px;
.search-active & {
transform: scale(1);
if (hexo-config('local_search.enable') or hexo-config('algolia_search.enable')) {
.search-active {
overflow: hidden;
}
+mobile() {
border-radius: 0;
height: 100%;
width: 100%;
}
.search-icon, .popup-btn-close {
color: $grey-dark;
font-size: 18px;
padding: 0 10px;
}
.popup-btn-close {
cursor: pointer;
&:hover .fa {
color: $black-deep;
}
}
.search-header {
background: $gainsboro;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
.search-pop-overlay {
background: rgba(0, 0, 0, 0);
display: flex;
padding: 5px;
}
input.search-input {
background: transparent;
border: 0;
outline: 0;
height: 100%;
left: 0;
position: fixed;
top: 0;
transition: visibility .4s, background .4s;
visibility: hidden;
width: 100%;
z-index: $zindex-4;
&::-webkit-search-cancel-button {
display: none;
.search-active & {
background: rgba(0, 0, 0, .3);
visibility: visible;
}
}
.search-result-container {
height: calc(100% - 55px);
overflow: auto;
padding: 5px 25px;
.search-popup {
background: var(--card-bg-color);
border-radius: 5px;
height: 80%;
margin: auto;
transform: scale(0);
transition: transform .4s;
width: 700px;
hr {
margin: 5px 0 10px;
.search-active & {
transform: scale(1);
}
&:first-child {
+mobile() {
border-radius: 0;
height: 100%;
width: 100%;
}
.search-icon, .popup-btn-close {
color: $grey-dark;
font-size: 18px;
padding: 0 10px;
}
.popup-btn-close {
cursor: pointer;
&:hover .fa {
color: $black-deep;
}
}
.search-header {
background: $gainsboro;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
display: flex;
padding: 5px;
}
input.search-input {
background: transparent;
border: 0;
outline: 0;
width: 100%;
&::-webkit-search-cancel-button {
display: none;
}
}
}
.search-result-list {
margin: 0 5px;
padding: 0;
}
.search-result-container {
height: calc(100% - 55px);
overflow: auto;
padding: 5px 25px;
a.search-result-title {
font-weight: bold;
}
hr {
margin: 5px 0 10px;
p.search-result {
border-bottom: 1px dashed $grey-light;
padding: 5px 0;
&:first-child {
display: none;
}
}
}
.search-result-list {
margin: 0 5px;
padding: 0;
}
a.search-result-title {
font-weight: bold;
}
p.search-result {
border-bottom: 1px dashed $grey-light;
padding: 5px 0;
}
}
}

View File

@ -1,3 +1,5 @@
.utterances {
max-width: unset;
if (hexo-config('utterances.enable')) {
.utterances {
max-width: unset;
}
}

View File

@ -1,22 +1,24 @@
.book-mark-link {
border-bottom: 0;
position: fixed;
top: -10px;
transition: top .3s;
sidebar-toggle-position(true);
if (hexo-config('bookmark.enable')) {
.book-mark-link {
border-bottom: 0;
position: fixed;
top: -10px;
transition: top .3s;
sidebar-toggle-position(true);
+tablet-mobile() {
display: none;
+tablet-mobile() {
display: none;
}
&::before {
color: unquote(hexo-config('bookmark.color'));
font-size: 32px;
line-height: 1;
font-family-icons('\f02e');
}
}
&::before {
color: unquote(hexo-config('bookmark.color'));
font-size: 32px;
line-height: 1;
font-family-icons('\f02e');
.book-mark-link:hover, .book-mark-link-fixed {
top: -2px;
}
}
.book-mark-link:hover, .book-mark-link-fixed {
top: -2px;
}

View File

@ -1,58 +1,60 @@
@keyframes octocat-wave {
0%, 100% {
transform: rotate(0);
if (hexo-config('github_banner.enable')) {
@keyframes octocat-wave {
0%, 100% {
transform: rotate(0);
}
20%, 60% {
transform: rotate(-25deg);
}
40%, 80% {
transform: rotate(10deg);
}
}
20%, 60% {
transform: rotate(-25deg);
}
.github-corner {
$bg-color = unquote(hexo-config('android_chrome_color'));
40%, 80% {
transform: rotate(10deg);
}
}
.github-corner {
$bg-color = unquote(hexo-config('android_chrome_color'));
:hover .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}
svg {
color: white;
fill: $bg-color;
position: absolute;
right: 0;
top: 0;
z-index: $zindex-0;
}
+tablet-mobile() {
if (hexo-config('local_search.enable') or hexo-config('algolia_search.enable')) {
display: none;
:hover .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}
svg {
if (($scheme == 'Pisces') or ($scheme == 'Gemini')) {
color: $bg-color;
fill: white;
color: white;
fill: $bg-color;
position: absolute;
right: 0;
top: 0;
z-index: $zindex-0;
}
+tablet-mobile() {
if (hexo-config('local_search.enable') or hexo-config('algolia_search.enable')) {
display: none;
}
svg {
if (($scheme == 'Pisces') or ($scheme == 'Gemini')) {
color: $bg-color;
fill: white;
}
}
.github-corner:hover .octo-arm {
animation: none;
}
.github-corner .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}
}
.github-corner:hover .octo-arm {
animation: none;
}
.github-corner .octo-arm {
animation: octocat-wave 560ms ease-in-out;
}
}
if ($scheme == 'Mist') {
+mobile() {
svg {
top: inherit;
if ($scheme == 'Mist') {
+mobile() {
svg {
top: inherit;
}
}
}
}

View File

@ -33,6 +33,5 @@
@import 'site-nav';
@import 'menu';
@import 'bookmark' if (hexo-config('bookmark.enable'));
@import 'github-banner' if (hexo-config('github_banner.enable'));
@import 'bookmark';
@import 'github-banner';

View File

@ -2,4 +2,4 @@
@import 'sidebar';
@import 'footer';
@import 'mobile' if (hexo-config('mobile_layout_economy'));
@import 'mobile';

View File

@ -5,77 +5,78 @@
}
*/
+mobile-small() {
// For Pisces & Gemini schemes only wider width (remove main blocks in Gemini).
.main-inner {
padding: initial !important;
}
// For all schemes wider width.
.posts-expand {
.post-header {
margin-bottom: 10px !important;
}
}
.post-block {
margin-top: initial !important;
// Inside posts blocks content padding (default 40px).
padding: $content-mobile-padding 18px $content-mobile-padding !important;
}
.post-body {
// For headers narrow width.
h1, h2, h3, h4, h5, h6 {
margin: 20px 0 8px;
if (hexo-config('mobile_layout_economy')) {
+mobile-small() {
// For Pisces & Gemini schemes only wider width (remove main blocks in Gemini).
.main-inner {
padding: initial !important;
}
// Rewrite paddings & margins inside tags.
.note, .tabs .tab-content .tab-pane {
h1, h2, h3, h4, h5, h6 {
margin: 0 5px;
// For all schemes wider width.
.posts-expand {
.post-header {
margin-bottom: 10px !important;
}
}
// For paragraphs narrow width.
> p {
margin: 0 0 10px;
.post-block {
margin-top: initial !important;
// Inside posts blocks content padding (default 40px).
padding: $content-mobile-padding 18px $content-mobile-padding !important;
}
// Rewrite paddings & margins inside tags.
.note > p, .tabs .tab-content .tab-pane > p {
padding: 0 5px;
}
.post-body {
// For headers narrow width.
h1, h2, h3, h4, h5, h6 {
margin: 20px 0 8px;
}
img, video {
margin-bottom: 10px !important;
}
.note {
margin-bottom: 10px !important;
padding: 10px !important;
if (hexo-config('note.icons')) {
&:not(.no-icon) {
padding-left: 35px !important;
// Rewrite paddings & margins inside tags.
.note, .tabs .tab-content .tab-pane {
h1, h2, h3, h4, h5, h6 {
margin: 0 5px;
}
}
// For paragraphs narrow width.
> p {
margin: 0 0 10px;
}
// Rewrite paddings & margins inside tags.
.note > p, .tabs .tab-content .tab-pane > p {
padding: 0 5px;
}
img, video {
margin-bottom: 10px !important;
}
.note {
margin-bottom: 10px !important;
padding: 10px !important;
if (hexo-config('note.icons')) {
&:not(.no-icon) {
padding-left: 35px !important;
}
}
}
.tabs .tab-content .tab-pane {
padding: 10px 10px 0 !important;
}
}
.tabs .tab-content .tab-pane {
padding: 10px 10px 0 !important;
.post-eof {
margin: 40px auto 20px !important;
}
}
.post-eof {
margin: 40px auto 20px !important;
}
.pagination {
margin-top: 40px;
.pagination {
margin-top: 40px;
}
}
}
/*
// < 413px
+mobile-smallest() {

View File

@ -34,7 +34,5 @@
@import 'sidebar-dimmer';
@import 'sidebar-nav';
@import 'sidebar-toggle';
@import 'sidebar-toc' if (hexo-config('toc.enable'));
@import 'site-state' if (hexo-config('site_state'));
@import 'sidebar-toc';
@import 'site-state';

View File

@ -1,59 +1,61 @@
.post-toc {
font-size: $font-size-small;
if (hexo-config('toc.enable')) {
.post-toc {
font-size: $font-size-small;
ol {
list-style: none;
margin: 0;
padding: 0 2px 5px 10px;
text-align: left;
ol {
list-style: none;
margin: 0;
padding: 0 2px 5px 10px;
text-align: left;
> ol {
padding-left: 0;
}
> ol {
padding-left: 0;
}
a {
transition: all $transition-ease;
}
}
.nav-item {
line-height: 1.8;
overflow: hidden;
text-overflow: ellipsis;
if (not hexo-config('toc.wrap')) {
white-space: nowrap;
}
}
.nav {
.nav-child {
display: hexo-config('toc.expand_all') ? block : none;
}
.active > .nav-child {
display: block;
}
.active-current > .nav-child {
display: block;
> .nav-item {
display: block;
a {
transition: all $transition-ease;
}
}
.active > a {
border-bottom-color: $sidebar-highlight;
color: $sidebar-highlight;
.nav-item {
line-height: 1.8;
overflow: hidden;
text-overflow: ellipsis;
if (not hexo-config('toc.wrap')) {
white-space: nowrap;
}
}
.active-current > a {
color: $sidebar-highlight;
.nav {
.nav-child {
display: hexo-config('toc.expand_all') ? block : none;
}
&:hover {
.active > .nav-child {
display: block;
}
.active-current > .nav-child {
display: block;
> .nav-item {
display: block;
}
}
.active > a {
border-bottom-color: $sidebar-highlight;
color: $sidebar-highlight;
}
.active-current > a {
color: $sidebar-highlight;
&:hover {
color: $sidebar-highlight;
}
}
}
}
}

View File

@ -1,26 +1,28 @@
.site-state {
flex-wrap();
line-height: 1.4;
}
if (hexo-config('site_state')) {
.site-state {
flex-wrap();
line-height: 1.4;
}
.site-state-item {
// Fix issue #103
// The click area of the link becomes smaller
padding: 0 15px;
.site-state-item {
// Fix issue #103
// The click area of the link becomes smaller
padding: 0 15px;
a {
border-bottom: 0;
a {
border-bottom: 0;
display: block;
}
}
.site-state-item-count {
display: block;
font-size: $site-state-item-count-font-size;
font-weight: 600;
}
.site-state-item-name {
color: $site-state-item-name-color;
font-size: $site-state-item-name-font-size;
}
}
.site-state-item-count {
display: block;
font-size: $site-state-item-count-font-size;
font-weight: 600;
}
.site-state-item-name {
color: $site-state-item-name-color;
font-size: $site-state-item-name-font-size;
}

View File

@ -2,10 +2,7 @@
@import 'group-pictures';
@import 'label';
@import 'link-grid';
@import 'mermaid';
@import 'note';
@import 'pdf';
@import 'tabs';
@import 'note' if (hexo-config('note.style') != 'disabled');
@import 'pdf' if (hexo-config('pdf.enable'));
@import 'mermaid' if (hexo-config('mermaid.enable'));

View File

@ -1,4 +1,6 @@
.mermaid {
margin-bottom: 20px;
text-align: center;
if (hexo-config('mermaid.enable')) {
.mermaid {
margin-bottom: 20px;
text-align: center;
}
}

View File

@ -1,109 +1,111 @@
.post-body .note {
$note-icons = hexo-config('note.icons');
$note-style = hexo-config('note.style');
if (hexo-config('note.style') != 'disabled') {
.post-body .note {
$note-icons = hexo-config('note.icons');
$note-style = hexo-config('note.style');
border-radius: $note-border-radius;
margin-bottom: 20px;
padding: 1em;
position: relative;
border-radius: $note-border-radius;
margin-bottom: 20px;
padding: 1em;
position: relative;
if ($note-style == 'simple') {
border: 1px solid $gainsboro;
border-left-width: 5px;
}
if ($note-style == 'modern') {
background: $whitesmoke;
border: 1px solid transparent;
}
if ($note-style == 'flat') {
background: lighten($gainsboro, 65%);
border: initial;
border-left: 3px solid $gainsboro;
}
summary {
cursor: pointer;
outline: 0;
p {
display: inline;
}
}
h2, h3, h4, h5, h6 {
border-bottom: initial;
margin: 0;
padding-top: 0;
}
p, ul, ol, table, pre, blockquote, img {
&:first-child {
margin-top: 0;
if ($note-style == 'simple') {
border: 1px solid $gainsboro;
border-left-width: 5px;
}
&:last-child {
margin-bottom: 0;
if ($note-style == 'modern') {
background: $whitesmoke;
border: 1px solid transparent;
}
}
if ($note-icons) {
&:not(.no-icon) {
padding-left: 2.5em;
if ($note-style == 'flat') {
background: lighten($gainsboro, 65%);
border: initial;
border-left: 3px solid $gainsboro;
}
&::before {
font-size: 1.5em;
left: .3em;
position: absolute;
top: calc(50% - 1em);
summary {
cursor: pointer;
outline: 0;
p {
display: inline;
}
}
}
for $type in $note-types {
&.{$type} {
if ($note-style == 'flat') {
background: $note-bg[$type];
if (hexo-config('darkmode')) {
@media (prefers-color-scheme: dark) {
background: mix($note-bg[$type], $body-bg-color-dark, 10%);
}
h2, h3, h4, h5, h6 {
border-bottom: initial;
margin: 0;
padding-top: 0;
}
p, ul, ol, table, pre, blockquote, img {
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
if ($note-icons) {
&:not(.no-icon) {
padding-left: 2.5em;
&::before {
font-size: 1.5em;
left: .3em;
position: absolute;
top: calc(50% - 1em);
}
}
}
if ($note-style == 'modern') {
background: $note-modern-bg[$type];
border-color: $note-modern-border[$type];
color: $note-modern-text[$type];
for $type in $note-types {
&.{$type} {
if ($note-style == 'flat') {
background: $note-bg[$type];
if (hexo-config('darkmode')) {
@media (prefers-color-scheme: dark) {
background: mix($note-bg[$type], $body-bg-color-dark, 10%);
}
}
}
a:not(.btn) {
border-bottom-color: $note-modern-text[$type];
if ($note-style == 'modern') {
background: $note-modern-bg[$type];
border-color: $note-modern-border[$type];
color: $note-modern-text[$type];
&:hover {
border-bottom-color: $note-modern-hover[$type];
color: $note-modern-hover[$type];
a:not(.btn) {
border-bottom-color: $note-modern-text[$type];
color: $note-modern-text[$type];
&:hover {
border-bottom-color: $note-modern-hover[$type];
color: $note-modern-hover[$type];
}
}
}
}
if ($note-style != 'modern') {
border-left-color: $note-border[$type];
if ($note-style != 'modern') {
border-left-color: $note-border[$type];
h2, h3, h4, h5, h6 {
color: $note-text[$type];
}
}
if ($note-icons) {
&:not(.no-icon)::before {
font-family-icons($note-icon[$type]);
if ($note-style != 'modern') {
h2, h3, h4, h5, h6 {
color: $note-text[$type];
}
}
if ($note-icons) {
&:not(.no-icon)::before {
font-family-icons($note-icon[$type]);
if ($note-style != 'modern') {
color: $note-text[$type];
}
}
}
}
}
}

View File

@ -1,6 +1,8 @@
.pdfobject-container {
iframe, embed {
height: unquote(hexo-config('pdf.height'));
width: 100%;
if (hexo-config('pdf.enable')) {
.pdfobject-container {
iframe, embed {
height: unquote(hexo-config('pdf.height'));
width: 100%;
}
}
}