saul365/LoveIt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: update docs and style (#269)

Browse Source
This commit is contained in:
Dillon
2020-04-28 01:38:22 +08:00
committed by GitHub
parent b46c81053f
commit 6805d695f6
69 changed files with 540 additions and 454 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/_partial/_archive/_tags.scss
View File

@@ -19,7 +19,7 @@
sup {
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}

4
assets/css/_partial/_archive/_terms.scss
View File

@@ -58,7 +58,7 @@
background-color: transparent;
}
.dark & {
[theme=dark] & {
color: $global-link-color-dark;
&:hover {
@@ -72,7 +72,7 @@
text-align: right;
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}

8
assets/css/_partial/_details.scss
View File

@@ -9,7 +9,7 @@
color: $global-font-secondary-color;
@include transition(transform 0.2s ease);
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
@@ -17,17 +17,17 @@
.details-content {
max-height: 0;
overflow-y: hidden;
@include transition(max-height 0.8s cubic-bezier(0, 1, 0, 1) -0.1s);
@include details-transition-open;
}
&.open {
i.details-icon {
@include transform(rotate(180deg));
@include transform(rotate(90deg));
}
.details-content {
max-height: $MAX_LENGTH;
@include transition(max-height 0.8s cubic-bezier(0.5, 0, 1, 0) 0s);
@include details-transition-close;
}
}
}

2
assets/css/_partial/_fixed-button.scss
View File

@@ -25,7 +25,7 @@
outline: none;
}
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
background: $header-background-color-dark;

34
assets/css/_partial/_header.scss
View File

@@ -3,7 +3,7 @@ header {
z-index: 150;
background-color: $header-background-color;
.dark & {
[theme=dark] & {
background-color: $header-background-color-dark;
}
@@ -66,7 +66,7 @@ header {
vertical-align: baseline !important;
@include transition(width 0.3s ease);
.dark & {
[theme=dark] & {
background-color: $header-background-color-dark;
}
}
@@ -100,7 +100,7 @@ header {
padding: 0 2rem 0 2rem;
}
.dark & {
[theme=dark] & {
input {
color: $global-font-color-dark;
background-color: $search-background-color-dark;
@@ -114,7 +114,7 @@ header {
.search-button {
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
@@ -140,7 +140,7 @@ header {
line-height: $header-height;
.header-wrapper {
padding: 0 10vw;
padding: 0 2rem 0 10vh;
.header-title {
font-size: $header-title-font-size;
@@ -160,7 +160,7 @@ header {
&.delimiter {
border-left: 1.5px solid $global-font-color;
.dark & {
[theme=dark] & {
border-left-color: $global-border-color-dark;
}
}
@@ -178,7 +178,7 @@ header {
font-weight: 900;
color: $header-hover-color;
.dark & {
[theme=dark] & {
color: $header-hover-color-dark;
}
}
@@ -227,7 +227,7 @@ header {
@include border-radius(3px);
@include transition(all 0.3s ease-in-out);
.dark & {
[theme=dark] & {
background: $global-font-color-dark;
}
}
@@ -295,7 +295,7 @@ header {
display: block;
}
.dark & {
[theme=dark] & {
background: $header-background-color-dark;
border-top-color: $global-border-color-dark;
}
@@ -329,7 +329,7 @@ header {
@include box-shadow(0 .125rem .25rem rgba(0, 0, 0, .1));
&.desktop {
right: 10vw;
right: 2rem;
width: 30rem;
}
@@ -342,7 +342,7 @@ header {
right: 0 !important;
background-color: $global-background-color;
.dark & {
[theme=dark] & {
background-color: $global-background-color-dark;
}
@@ -369,7 +369,7 @@ header {
text-align: right;
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
@@ -383,7 +383,7 @@ header {
overflow-wrap: break-word;
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
@@ -392,7 +392,7 @@ header {
font-style: normal;
background-color: $selection-color;
.dark & {
[theme=dark] & {
background-color: $selection-color-dark;
}
}
@@ -400,7 +400,7 @@ header {
&.cursor {
background: darken($code-background-color, 5%);
.dark & {
[theme=dark] & {
background: lighten($code-background-color-dark, 5%);
}
}
@@ -418,7 +418,7 @@ header {
.search-query {
font-weight: bold;
.dark & {
[theme=dark] & {
color: #ddd;
}
}
@@ -430,7 +430,7 @@ header {
font-size: .8rem;
color: $global-font-secondary-color;
.dark {
[theme=dark] {
color: $global-font-secondary-color-dark;
}

8
assets/css/_partial/_pagination.scss
View File

@@ -32,7 +32,7 @@
color: $pagination-link-hover-color;
}
.dark &:hover a {
[theme=dark] &:hover a {
color: $pagination-link-hover-color-dark;
}
@@ -47,8 +47,8 @@
bottom: 0px;
}
.dark &:before,
.dark &:after {
[theme=dark] &:before,
[theme=dark] &:after {
background: $pagination-link-hover-color-dark;
}
@@ -78,7 +78,7 @@
color: $pagination-link-hover-color;
}
.dark & a {
[theme=dark] & a {
color: $pagination-link-hover-color-dark;
}

23
assets/css/_partial/_single/_admonition.scss
View File

@@ -1,20 +1,21 @@
.admonition {
position: relative;
margin: .9765em 0;
margin: 1rem 0;
padding: 0 .75rem;
background-color: map-get($admonition-background-color-map, 'note');
border-left: .25rem solid map-get($admonition-color-map, 'note');
overflow: auto;
.admonition-title {
font-weight: bold;
margin: 0 -0.75rem;
padding: .2rem .75rem .2rem 1.8rem;
padding: .25rem 1.8rem;
border-bottom: 1px solid map-get($admonition-background-color-map, 'note');
background-color: map-get($admonition-background-color-map, 'note');
background-color: opacify(map-get($admonition-background-color-map, 'note'), 0.15);
}
.details-summary.admonition-title:hover {
background-color: darken(map-get($admonition-background-color-map, 'note'), 6%);
&.open .admonition-title {
background-color: map-get($admonition-background-color-map, 'note');
}
.admonition-content {
@@ -25,14 +26,14 @@
font-size: 0.85rem;
color: map-get($admonition-color-map, 'note');
position: absolute;
left: .6rem;
top: .6rem;
left: .4rem;
}
i.details-icon {
position: absolute;
top: .5rem;
right: .5rem;
top: .6rem;
right: .3rem;
}
@each $type, $color in $admonition-color-map {
@@ -51,11 +52,11 @@
.admonition-title {
border-bottom-color: $color;
background-color: $color;
background-color: opacify($color, 0.15);
}
.details-summary.admonition-title:hover {
background-color: darken($color, 6%);
&.open .admonition-title {
background-color: $color;
}
}
}

33
assets/css/_partial/_single/_code.scss
View File

@@ -5,7 +5,7 @@ code {
color: $code-color;
padding: 0 .4rem;
.dark & {
[theme=dark] & {
color: $code-color-dark;
}
}
@@ -20,7 +20,7 @@ pre {
}
img {
min-height: 1.25em;
min-height: 1em;
max-height: 1.25em;
vertical-align: text-bottom;
}
@@ -29,7 +29,7 @@ pre {
code, pre, .highlight table, .highlight tr, .highlight td {
background: $code-background-color;
.dark & {
[theme=dark] & {
background: $code-background-color-dark;
}
}
@@ -67,7 +67,7 @@ code, pre, .highlight table, .highlight tr, .highlight td {
color: $code-info-color;
background: darken($code-background-color, 8%);
.dark & {
[theme=dark] & {
color: $code-info-color-dark;
background: darken($code-background-color-dark, 6%);
}
@@ -93,11 +93,15 @@ code, pre, .highlight table, .highlight tr, .highlight td {
}
}
.lntd:first-child {
min-width: 1.6rem;
text-align: right;
}
.lntd:last-child {
width: 100%;
pre {
padding-left: .75rem;
@include max-content(min-width);
}
}
@@ -110,7 +114,7 @@ code, pre, .highlight table, .highlight tr, .highlight td {
display: block;
background-color: darken($code-background-color, 10%);
.dark & {
[theme=dark] & {
background-color: darken($code-background-color-dark, 5%);
}
}
@@ -118,12 +122,13 @@ code, pre, .highlight table, .highlight tr, .highlight td {
.ln, .lnt {
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}
.arrow {
padding: 0 .2rem;
@include transition(transform 0.2s ease);
}
@@ -139,7 +144,7 @@ code, pre, .highlight table, .highlight tr, .highlight td {
cursor: pointer;
color: $global-link-hover-color;
.dark & {
[theme=dark] & {
color: $global-link-hover-color-dark;
}
}
@@ -148,21 +153,21 @@ code, pre, .highlight table, .highlight tr, .highlight td {
.table-wrapper {
max-height: 0;
overflow-y: hidden;
@include transition(max-height 0.8s cubic-bezier(0, 1, 0, 1) -0.1s);
@include details-transition-open;
}
&.open {
.code-header {
background: darken($code-background-color, 3%);
.dark & {
[theme=dark] & {
background: darken($code-background-color-dark, 3%);
}
}
.table-wrapper {
max-height: $MAX_LENGTH;
@include transition(max-height 0.8s cubic-bezier(0.5, 0, 1, 0) 0s);
@include details-transition-close;
}
.arrow {
@@ -191,7 +196,7 @@ code, pre, .highlight table, .highlight tr, .highlight td {
.#{$class} { color: $color; }
}
.dark & {
[theme=dark] & {
@each $class, $color in $code-highlight-color-map-dark {
.#{$class} { color: $color; }
}
@@ -209,12 +214,12 @@ code, pre, .highlight table, .highlight tr, .highlight td {
@include link(false, false);
.dark & {
[theme=dark] & {
background-color: darken($code-background-color-dark, 5%);
}
}
.dark & {
[theme=dark] & {
// imported from https://github.com/lonekorean/gist-syntax-themes/blob/master/stylesheets/one-dark.css
.highlight {
background: #141414;

6
assets/css/_partial/_single/_footer.scss
View File

@@ -5,7 +5,7 @@
border-bottom: 1px solid $global-border-color;
padding: 1rem 0 0.3rem;
.dark & {
[theme=dark] & {
border-bottom: 1px solid $global-border-color-dark;
}
@@ -17,7 +17,7 @@
font-size: 0.8em;
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
@@ -28,7 +28,7 @@
font-size: 0.8em;
color: $global-font-secondary-color;
.dark & {
[theme=dark] & {
color: $global-font-secondary-color-dark;
}
}

2
assets/css/_partial/_single/_instagram.scss
View File

@@ -1,5 +1,5 @@
iframe.instagram-media {
.dark & {
[theme=dark] & {
border: none !important;
}
}

38
assets/css/_partial/_single/_toc.scss
View File

@@ -19,7 +19,7 @@
margin-right: .5rem;
color: $single-link-color;
.dark & {
[theme=dark] & {
color: $single-link-color-dark;
}
}
@@ -37,7 +37,7 @@
color: $global-font-secondary-color;
}
.dark & {
[theme=dark] & {
background: $code-background-color-dark;
rt {
@@ -60,8 +60,8 @@
@include blur;
.dark & {
border-left: 1px solid $global-border-color-dark;
[theme=dark] & {
border-left-color: $global-border-color-dark;
}
.toc-title {
@@ -91,14 +91,14 @@
font-weight: bold;
color: $single-link-color;
.dark & {
[theme=dark] & {
color: $single-link-color-dark;
}
&::before {
color: $single-link-hover-color;
.dark & {
[theme=dark] & {
color: $single-link-hover-color-dark;
}
}
@@ -115,18 +115,10 @@
justify-content: space-between;
line-height: 2em;
padding: 0 .75rem;
background: darken($code-background-color, 3%);
background: darken($code-background-color, 6%);
.dark & {
background: darken($code-background-color-dark, 3%);
}
&:hover {
background: darken($code-background-color, 6%);
.dark & {
background: darken($code-background-color-dark, 5%);
}
[theme=dark] & {
background: darken($code-background-color-dark, 6%);
}
}
@@ -138,8 +130,18 @@
padding: .4rem 1rem .4rem 1.8rem;
}
.dark & {
[theme=dark] & {
background-color: $code-background-color-dark;
}
}
&.open {
.toc-title {
background: darken($code-background-color, 3%);
[theme=dark] & {
background: darken($code-background-color-dark, 3%);
}
}
}
}