danbarber/danbarber.me.hugo
1
0
Fork 0
mirror of https://github.com/danbee/danbarber.me.hugo.git synced 2025-03-04 08:59:18 +00:00
Code Issues Releases Wiki Activity

Adapt logo colors to dark mode

Browse Source
This commit is contained in:
Daniel Barber 2019-10-17 09:01:14 -04:00
parent 19495187c7
commit 74c18dd052
2 changed files with 32 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
assets/sass/components/_logo.scss
View File

@ -1,9 +1,14 @@
$_desaturate_amount: 35%;
$_color_1: desaturate(#ff6800, $_desaturate_amount);
$_color_2: desaturate(#e8ff00, $_desaturate_amount);
$_color_3: desaturate(#00a9ff, $_desaturate_amount);
$_color_4: desaturate(#b346e2, $_desaturate_amount);
$_color_1: #ff6800;
$_color_2: #e8ff00;
$_color_3: #00a9ff;
$_color_4: #b346e2;
$_color_1_dark: desaturate($_color_1, $_desaturate_amount);
$_color_2_dark: desaturate($_color_2, $_desaturate_amount);
$_color_3_dark: desaturate($_color_3, $_desaturate_amount);
$_color_4_dark: desaturate($_color_4, $_desaturate_amount);
.logo__wrapper {
width: 7rem;
@ -11,19 +16,14 @@ $_color_4: desaturate(#b346e2, $_desaturate_amount);
margin-bottom: 1em;
}
.logo__color_1 {
fill: $_color_1;
}
.logo__color_1 { fill: $_color_1; }
.logo__color_2 { fill: $_color_2; }
.logo__color_3 { fill: $_color_3; }
.logo__color_4 { fill: $_color_4; }
.logo__color_2 {
fill: $_color_2;
@media (prefers-color-scheme: dark) {
.logo__color_1 { fill: $_color_1_dark; }
.logo__color_2 { fill: $_color_2_dark; }
.logo__color_3 { fill: $_color_3_dark; }
.logo__color_4 { fill: $_color_4_dark; }
}
.logo__color_3 {
fill: $_color_3;
}
.logo__color_4 {
fill: $_color_4;
}

18
resources/_gen/assets/scss/sass/main.scss_f300667da4f5b5f84e1a9e0702b2fdde.content
View File

@ -459,13 +459,23 @@ pre {
margin-bottom: 1em; }
.logo__color_1 {
fill: #d2702d; }
fill: #ff6800; }
.logo__color_2 {
fill: #c3d22d; }
fill: #e8ff00; }
.logo__color_3 {
fill: #2d9ad2; }
fill: #00a9ff; }
.logo__color_4 {
fill: #a46bbd; }
fill: #b346e2; }
@media (prefers-color-scheme: dark) {
.logo__color_1 {
fill: #d2702d; }
.logo__color_2 {
fill: #c3d22d; }
.logo__color_3 {
fill: #2d9ad2; }
.logo__color_4 {
fill: #a46bbd; } }