style: optimize global style
This commit is contained in:
parent
a2d80bdd38
commit
2d7a5bc13c
|
@ -67,7 +67,7 @@ $article-date-font-size = 1em;
|
|||
}
|
||||
|
||||
a.article-title {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-color);
|
||||
|
|
|
@ -298,7 +298,7 @@ $gt-size-avatar-mobi := em(32px)
|
|||
font-size: em(14px)
|
||||
word-wrap: break-word
|
||||
resize: vertical
|
||||
color: var(--normal-text-color)
|
||||
color: var(--default-text-color)
|
||||
background-color: var(--fourth-text-color)
|
||||
outline: none
|
||||
transition: all 0.25s ease
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
.vinput {
|
||||
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
border-color: var(--third-text-color);
|
||||
|
||||
&:focus {
|
||||
|
@ -26,14 +26,14 @@
|
|||
.vedit {
|
||||
|
||||
.veditor {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
}
|
||||
|
||||
.vctrl {
|
||||
|
||||
.vicon {
|
||||
|
||||
fill: var(--normal-text-color);
|
||||
fill: var(--default-text-color);
|
||||
|
||||
&.actived {
|
||||
fill: var(--primary-color);
|
||||
|
@ -46,8 +46,8 @@
|
|||
button.vsubmit {
|
||||
|
||||
background: transparent !important;
|
||||
color: var(--normal-text-color) !important;
|
||||
border: 1px solid var(--normal-text-color) !important;
|
||||
color: var(--default-text-color) !important;
|
||||
border: 1px solid var(--default-text-color) !important;
|
||||
|
||||
&:hover {
|
||||
color: var(--primary-color) !important;
|
||||
|
@ -60,7 +60,7 @@
|
|||
|
||||
|
||||
.vcount {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
|
||||
.vnum {
|
||||
color: var(--second-text-color);
|
||||
|
@ -96,7 +96,7 @@
|
|||
}
|
||||
|
||||
.vsys {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
background: var(--fourth-text-color) !important;
|
||||
}
|
||||
}
|
||||
|
@ -104,7 +104,7 @@
|
|||
|
||||
.vcontent {
|
||||
P {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -77,7 +77,7 @@ $header-progress-height = 2.8px;
|
|||
|
||||
&:hover {
|
||||
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
|
@ -132,7 +132,7 @@ $header-progress-height = 2.8px;
|
|||
height: 2px;
|
||||
margin: 6px 0;
|
||||
position: relative;
|
||||
background: var(--normal-text-color);
|
||||
background: var(--default-text-color);
|
||||
transition();
|
||||
|
||||
&::before {
|
||||
|
@ -142,7 +142,7 @@ $header-progress-height = 2.8px;
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: var(--normal-text-color);
|
||||
background: var(--default-text-color);
|
||||
transition();
|
||||
}
|
||||
|
||||
|
@ -153,7 +153,7 @@ $header-progress-height = 2.8px;
|
|||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: var(--normal-text-color);
|
||||
background: var(--default-text-color);
|
||||
transition();
|
||||
}
|
||||
}
|
||||
|
@ -188,7 +188,7 @@ $header-progress-height = 2.8px;
|
|||
border-radius: 20px;
|
||||
text-align: center;
|
||||
line-height: 34px;
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
transition();
|
||||
|
||||
&:hover {
|
||||
|
@ -198,7 +198,7 @@ $header-progress-height = 2.8px;
|
|||
}
|
||||
|
||||
.active {
|
||||
border: 1px solid var(--normal-text-color);
|
||||
border: 1px solid var(--default-text-color);
|
||||
color: var(--second-text-color);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
|
@ -35,7 +35,7 @@ $icon-size = 1.2em;
|
|||
z-index: $z-index-6;
|
||||
|
||||
.search-icon, .popup-btn-close {
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
font-size: $icon-size;
|
||||
padding: 0 10px;
|
||||
display: flex;
|
||||
|
@ -66,7 +66,7 @@ input.search-input {
|
|||
outline: 0;
|
||||
width: 100%;
|
||||
font-size: 1.2em;
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
|
||||
&::-webkit-search-cancel-button {
|
||||
display: none;
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
background: var(--background-color);
|
||||
font-family: $default-font-family;
|
||||
font-weight: $default-font-weight;
|
||||
|
@ -72,7 +72,7 @@ ul, ol, li {
|
|||
// ============================
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: var(--normal-text-color);
|
||||
color: var(--default-text-color);
|
||||
|
||||
&:hover, &:active {
|
||||
color: var(--primary-color);
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
@require '../variables.styl'
|
||||
|
||||
$code-foreground = lighten($normal-text-color, 2%)
|
||||
$code-foreground = lighten($default-text-color, 2%)
|
||||
$code-background = darken($background-color, 5%)
|
||||
$highlight-foreground = lighten($normal-text-color, 2%)
|
||||
$highlight-foreground = lighten($default-text-color, 2%)
|
||||
$highlight-background = darken($background-color, 2%)
|
||||
$highlight-gutter-color = lighten($normal-text-color, 5%)
|
||||
$highlight-gutter-color = lighten($default-text-color, 5%)
|
||||
$highlight-gutter-bg-color = darken($background-color, 5%)
|
||||
$highlight-comment = #8e908c
|
||||
$highlight-red = #c82829
|
||||
|
@ -17,11 +17,11 @@ $highlight-purple = #8959a8
|
|||
$highlight-deletion = #fdd
|
||||
$highlight-addition = #dfd
|
||||
|
||||
$night-code-foreground = lighten($dark-normal-text-color, 2%)
|
||||
$night-code-foreground = lighten($dark-default-text-color, 2%)
|
||||
$night-code-background = darken($dark-background-color, 10%)
|
||||
$night-highlight-foreground = lighten($dark-normal-text-color, 2%)
|
||||
$night-highlight-foreground = lighten($dark-default-text-color, 2%)
|
||||
$night-highlight-background = darken($dark-background-color, 8%)
|
||||
$night-highlight-gutter-color = lighten($dark-normal-text-color, 5%)
|
||||
$night-highlight-gutter-color = lighten($dark-default-text-color, 5%)
|
||||
$night-highlight-gutter-bg-color = darken($dark-background-color, 10%)
|
||||
$night-highlight-comment = #969896
|
||||
$night-highlight-red = #cc6666
|
||||
|
|
|
@ -14,7 +14,7 @@ disable-user-select() {
|
|||
}
|
||||
|
||||
.copy-btn {
|
||||
color: #333;
|
||||
color: var(--default-text-color);
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
|
@ -25,28 +25,19 @@ disable-user-select() {
|
|||
position: absolute;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
font-size: 1.1em;
|
||||
disable-user-select();
|
||||
the-transition();
|
||||
|
||||
if (hexo-config('code_copy.style') == 'flat') {
|
||||
background: white;
|
||||
border: 0;
|
||||
font-size: 0.8em;
|
||||
right: 0;
|
||||
top: 0;
|
||||
} else if (hexo-config('code_copy.style') == 'mac') {
|
||||
if (hexo-config('code_copy.style') == 'mac') {
|
||||
color: white;
|
||||
font-size: 1em;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
} else {
|
||||
background-color: #eee;
|
||||
background-image: linear-gradient(#fcfcfc, #eee);
|
||||
border: 1px solid #d5d5d5;
|
||||
border-radius: 3px;
|
||||
font-size: 0.8em;
|
||||
right: 6px;
|
||||
top: 6px;
|
||||
background: var(--background-color);
|
||||
border: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -103,7 +103,7 @@ root-color(mode) {
|
|||
--second-text-color: mode == 'light' ? $second-text-color : $dark-second-text-color;
|
||||
--third-text-color: mode == 'light' ? $third-text-color : $dark-third-text-color;
|
||||
--fourth-text-color: mode == 'light' ? $fourth-text-color : $dark-fourth-text-color;
|
||||
--normal-text-color: mode == 'light' ? $default-text-color : $dark-default-text-color;
|
||||
--default-text-color: mode == 'light' ? $default-text-color : $dark-default-text-color;
|
||||
--border-color: mode == 'light' ? $border-color : $dark-border-color;
|
||||
--selection-color: mode == 'light' ? $selection-color : $dark-selection-color;
|
||||
--shadow-color: mode == 'light' ? $shadow-color : $dark-shadow-color;
|
||||
|
|
Loading…
Reference in New Issue