EH22/design
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use different glow for logo in light mode
All checks were successful
/ build (push) Successful in 9s
Details

Browse source
This commit is contained in:
lilith 2025-02-16 20:16:29 +01:00
commit 434c4335d5
Signed by: lilith
SSH key fingerprint: SHA256:WMHGS60rozMrHkA/VT+Ole85sPCLZ190yemdzY68WJo
13 changed files with 939 additions and 551 deletions
Download patch file Download diff file Expand all files Collapse all files

140
styleguide/assets/image/logo_eventname_glow_off.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 63 KiB

32
styleguide/assets/style/base.css
View file

@ -128,6 +128,12 @@
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
.dark .light-only {
display: none;
}
.dark .dark-only {
display: initial;
}
.light {
--color-foreground: var(--color-light-foreground);
@ -150,6 +156,12 @@
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
.light .light-only {
display: initial;
}
.light .dark-only {
display: none;
}
html,
html.light {
@ -173,6 +185,14 @@ html.light {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html .light-only,
html.light .light-only {
display: initial;
}
html .dark-only,
html.light .dark-only {
display: none;
}
html.dark {
--color-foreground: var(--color-dark-foreground);
@ -195,6 +215,12 @@ html.dark {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html.dark .light-only {
display: none;
}
html.dark .dark-only {
display: initial;
}
@media (prefers-color-scheme: dark) {
html {
@ -218,6 +244,12 @@ html.dark {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html .light-only {
display: none;
}
html .dark-only {
display: initial;
}
}
@font-face {
font-family: "Athiti";

2
styleguide/assets/style/base.css.map
View file

File diff suppressed because one or more lines are too long

16
styleguide/assets/style/base.scss
View file

@ -143,6 +143,14 @@ $mobile-navigation-height: 4rem;
--color-glow-secondary: var(--color-white);
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
.light-only {
display: none;
}
.dark-only {
display: initial;
}
}
@mixin theme_light() {
@ -166,6 +174,14 @@ $mobile-navigation-height: 4rem;
--color-glow-secondary: var(--color-krypton-950);
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
.light-only {
display: initial;
}
.dark-only {
display: none;
}
}
.dark {

32
styleguide/assets/style/styleguide.css
View file

@ -128,6 +128,12 @@
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
.dark .light-only {
display: none;
}
.dark .dark-only {
display: initial;
}
.light {
--color-foreground: var(--color-light-foreground);
@ -150,6 +156,12 @@
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
.light .light-only {
display: initial;
}
.light .dark-only {
display: none;
}
html,
html.light {
@ -173,6 +185,14 @@ html.light {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html .light-only,
html.light .light-only {
display: initial;
}
html .dark-only,
html.light .dark-only {
display: none;
}
html.dark {
--color-foreground: var(--color-dark-foreground);
@ -195,6 +215,12 @@ html.dark {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html.dark .light-only {
display: none;
}
html.dark .dark-only {
display: initial;
}
@media (prefers-color-scheme: dark) {
html {
@ -218,6 +244,12 @@ html.dark {
--transition-glow: filter 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms,
border-color 100ms cubic-bezier(0, 2.01, .99, -0.72) 100ms;
}
html .light-only {
display: none;
}
html .dark-only {
display: initial;
}
}
@font-face {
font-family: "Athiti";

2
styleguide/assets/style/styleguide.css.map
View file

File diff suppressed because one or more lines are too long