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

WIP

Browse Source
This commit is contained in:
Daniel Barber 2024-04-10 22:40:57 -05:00
parent 54bd8fc3cf
commit 7b17d91b9c
1 changed files with 45 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
assets/css/components/_logo.scss
View File

@ -8,6 +8,15 @@
--color-7: hsl(278, 100%, 63%); --color-7: hsl(278, 100%, 63%);
--color-8: hsl(335, 85%, 63%); --color-8: hsl(335, 85%, 63%);
--color-1-p3: oklch(69.72% 0.2097 49.49133450146859);
--color-2-p3: oklch(80.92% 0.1932 75.48);
--color-3-p3: oklch(83.84% 0.2306 120.02);
--color-4-p3: oklch(76.31% 0.2833 139.57);
--color-5-p3: oklch(70.72% 0.1801 242.04198289887938);
--color-6-p3: oklch(60.22% 0.2317 273.21);
--color-7-p3: oklch(63.36% 0.2866 309.55425882845935);
--color-8-p3: oklch(66.97% 0.292 358.57);
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
--color-1: hsl(28, 90%, 48%); --color-1: hsl(28, 90%, 48%);
--color-2: hsl(41, 90%, 50%); --color-2: hsl(41, 90%, 50%);
@ -47,126 +56,126 @@
} }
.logo__color_1 { .logo__color_1 {
fill: var(--color-1); fill: var(--color-1-p3);
} }
.logo__color_2 { .logo__color_2 {
fill: var(--color-3); fill: var(--color-3-p3);
} }
.logo__color_3 { .logo__color_3 {
fill: var(--color-5); fill: var(--color-5-p3);
} }
.logo__color_4 { .logo__color_4 {
fill: var(--color-7); fill: var(--color-7-p3);
} }
@keyframes cycle_color_1 { @keyframes cycle_color_1 {
0%, 0%,
100% { 100% {
fill: var(--color-1); fill: var(--color-1-p3);
} }
12.5% { 12.5% {
fill: var(--color-2); fill: var(--color-2-p3);
} }
25% { 25% {
fill: var(--color-3); fill: var(--color-3-p3);
} }
37.5% { 37.5% {
fill: var(--color-4); fill: var(--color-4-p3);
} }
50% { 50% {
fill: var(--color-5); fill: var(--color-5-p3);
} }
62.5% { 62.5% {
fill: var(--color-6); fill: var(--color-6-p3);
} }
75% { 75% {
fill: var(--color-7); fill: var(--color-7-p3);
} }
87.5% { 87.5% {
fill: var(--color-8); fill: var(--color-8-p3);
} }
} }
@keyframes cycle_color_2 { @keyframes cycle_color_2 {
0%, 0%,
100% { 100% {
fill: var(--color-3); fill: var(--color-3-p3);
} }
12.5% { 12.5% {
fill: var(--color-4); fill: var(--color-4-p3);
} }
25% { 25% {
fill: var(--color-5); fill: var(--color-5-p3);
} }
37.5% { 37.5% {
fill: var(--color-6); fill: var(--color-6-p3);
} }
50% { 50% {
fill: var(--color-7); fill: var(--color-7-p3);
} }
62.5% { 62.5% {
fill: var(--color-8); fill: var(--color-8-p3);
} }
75% { 75% {
fill: var(--color-1); fill: var(--color-1-p3);
} }
87.5% { 87.5% {
fill: var(--color-2); fill: var(--color-2-p3);
} }
} }
@keyframes cycle_color_3 { @keyframes cycle_color_3 {
0%, 0%,
100% { 100% {
fill: var(--color-5); fill: var(--color-5-p3);
} }
12.5% { 12.5% {
fill: var(--color-6); fill: var(--color-6-p3);
} }
25% { 25% {
fill: var(--color-7); fill: var(--color-7-p3);
} }
37.5% { 37.5% {
fill: var(--color-8); fill: var(--color-8-p3);
} }
50% { 50% {
fill: var(--color-1); fill: var(--color-1-p3);
} }
62.5% { 62.5% {
fill: var(--color-2); fill: var(--color-2-p3);
} }
75% { 75% {
fill: var(--color-3); fill: var(--color-3-p3);
} }
87.5% { 87.5% {
fill: var(--color-4); fill: var(--color-4-p3);
} }
} }
@keyframes cycle_color_4 { @keyframes cycle_color_4 {
0%, 0%,
100% { 100% {
fill: var(--color-7); fill: var(--color-7-p3);
} }
12.5% { 12.5% {
fill: var(--color-8); fill: var(--color-8-p3);
} }
25% { 25% {
fill: var(--color-1); fill: var(--color-1-p3);
} }
37.5% { 37.5% {
fill: var(--color-2); fill: var(--color-2-p3);
} }
50% { 50% {
fill: var(--color-3); fill: var(--color-3-p3);
} }
62.5% { 62.5% {
fill: var(--color-4); fill: var(--color-4-p3);
} }
75% { 75% {
fill: var(--color-5); fill: var(--color-5-p3);
} }
87.5% { 87.5% {
fill: var(--color-6); fill: var(--color-6-p3);
} }
} }