lianglianglee
/
hexo-theme-keep
mirror of https://github.com/liangliangle/hexo-theme-keep.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style: modified pjax loading background color

This commit is contained in:
XPoet 2021-01-07 15:42:25 +08:00
parent 8cda9c5498
commit fb955b60bf
3 changed files with 9 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
source/css/common/variables.styl
View File

@ -8,11 +8,11 @@
// ======================================================================================== // ========================================================================================
$header-height = 76px; // header height $header-height = 76px; // header height
$header-shrink-height = $header-height * 0.72; // header shrink height $header-shrink-height = $header-height * 0.72; // header shrink height
$scroll-progress-bar-height = 2px; // scroll progress bar height $scroll-progress-bar-height = 2.8px; // scroll progress bar height
$main-content-width = 80%; // main content width (tablet) $main-content-width = 80%; // main content width (PC)
$main-content-width-tablet = 86%; // main content width (PC) $main-content-width-tablet = 86%; // main content width (tablet)
$main-content-width-mobile = 90%; // main content width (mobile) $main-content-width-mobile = 90%; // main content width (mobile)
$circle-button-width = 38px; // post tool button width $post-tool-button-width = 38px; // post tool button width
$component-spacing-value = 30px; // component-spacing-value (PC) $component-spacing-value = 30px; // component-spacing-value (PC)
// main content max width // main content max width
@ -76,7 +76,7 @@ $scroll-bar-bg-color = darken($background-color, 10%);
$link-color = darken($default-text-color, 10%); $link-color = darken($default-text-color, 10%);
$copyright-info-color = #CC0033; $copyright-info-color = #CC0033;
$avatar-background-color = #0066CC; $avatar-background-color = #0066CC;
$loading-progress-bar-color = #990000; $loading-progress-bar-color = linear-gradient(45deg, #ef0e18, #ff5f00, #eea40b, #1fe708, #00d6d6, #016bd7, #f300f3);
$lazyload-background-color = rgba(200, 200, 200, 0.5); $lazyload-background-color = rgba(200, 200, 200, 0.5);
@ -100,7 +100,7 @@ $dark-scroll-bar-bg-color = lighten($dark-background-color, 10%);
$dark-link-color = lighten($dark-default-text-color, 10%); $dark-link-color = lighten($dark-default-text-color, 10%);
$dark-copyright-info-color = darken($copyright-info-color, 20%); $dark-copyright-info-color = darken($copyright-info-color, 20%);
$dark-avatar-background-color = darken($avatar-background-color, 10%); $dark-avatar-background-color = darken($avatar-background-color, 10%);
$dark-loading-progress-bar-color = lighten($loading-progress-bar-color, 50%); $dark-loading-progress-bar-color = linear-gradient(45deg, #ea404a, #ea722f, #e9a71f, #67e559, #18ecec, #1b85f1, #ee1dee);
$dark-lazyload-background-color = rgba(50, 50, 50, 0.5); $dark-lazyload-background-color = rgba(50, 50, 50, 0.5);

4
source/css/layout/_partial/post-tools.styl
View File

@ -6,8 +6,8 @@ $li-margin-bottom = 12px;
.tools-list { .tools-list {
li { li {
cursor: pointer; cursor: pointer;
width: $circle-button-width; width: $post-tool-button-width;
height: $circle-button-width; height: $post-tool-button-width;
border-radius: 50%; border-radius: 50%;
font-size: 1.2rem; font-size: 1.2rem;
display: flex; display: flex;

3
source/css/layout/_partial/progress-bar.styl
View File

@ -9,10 +9,9 @@
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
height: 1px; height: 1.8px;
width: 0; width: 0;
background: var(--loading-progress-bar-color); background: var(--loading-progress-bar-color);
box-shadow: 0 1px 2px var(--loading-progress-bar-color);
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
z-index: $z-index-8; z-index: $z-index-8;