blogs/FixIt
1
0
Fork 0
mirror of https://github.com/hugo-fixit/FixIt.git synced 2026-08-24 15:28:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

🎨 Style: optimize box-shadow style in dark mode

Browse Source
This commit is contained in:
Cell
2023-03-26 00:04:32 +08:00
parent 0ac4c06d66
commit f2b0bd5aca
3 changed files with 21 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/_core/_header.scss
+14 -2
View File
@@ -11,6 +11,10 @@ header {
&:hover {
@include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.1));
[data-theme='dark'] & {
@include box-shadow(0 0 1.5rem 0 rgba(255, 255, 255, 0.1));
}
}
}
@@ -252,14 +256,14 @@ header {
border: 1px solid $global-border-color;
background-color: $header-background-color;
@include transition(box-shadow 0.3s ease);
@include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.1));
[data-theme='dark'] & {
background-color: $header-background-color-dark;
border-color: $global-border-color-dark;
@include box-shadow(0 0 1.5rem 0 rgba(255, 255, 255, 0.1));
}
@include box-shadow(0 0 1.5rem 0 rgba(0, 0, 0, 0.1));
.menu-item {
height: $header-height*0.5;
line-height: $header-height*0.5;
@@ -353,6 +357,10 @@ header {
overflow-y: overlay;
max-height: 70vh;
@include box-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.1));
[data-theme='dark'] & {
@include box-shadow(0 0.125rem 0.25rem rgba(255, 255, 255, 0.1));
}
&::-webkit-scrollbar {
width: 0;
@@ -517,6 +525,10 @@ header {
@include z-index(2);
@include box-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.1));
[data-theme='dark'] & {
@include box-shadow(0 0.125rem 0.25rem rgba(255, 255, 255, 0.1));
}
&.desktop {
right: 2rem;
width: 30rem;
assets/css/_page/_home.scss
+4
View File
@@ -14,6 +14,10 @@
@include box-shadow(0 0 0 0.3618em rgba(0, 0, 0, 0.05));
@include transition(all 0.4s ease);
[data-theme='dark'] & {
@include box-shadow(0 0 0 0.3618em rgba(255, 255, 255, 0.05));
}
&:hover {
position: relative;
@include transform(translateY(-0.75rem));
assets/css/_page/_single.scss
+3 -3
View File
@@ -367,18 +367,18 @@
background-color: $global-background-color;
border: 1px solid $global-border-color;
border-bottom-color: $global-border-color;
@include border-radius($global-border-radius);
@include box-shadow(inset 0 -1px 0 $global-border-color);
font-size: 0.8rem;
font-family: $code-font-family;
color: $code-color;
@include border-radius($global-border-radius);
@include box-shadow(inset 0 -1px 0 $global-border-color);
[data-theme='dark'] & {
background-color: $global-background-color-dark;
border: 1px solid $global-border-color-dark;
border-bottom-color: $global-border-color-dark;
@include box-shadow(inset 0 -1px 0 $global-border-color-dark);
color: $code-color-dark;
@include box-shadow(inset 0 -1px 0 $global-border-color-dark);
}
}
}