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

Run prettier
All checks were successful
/ build (push) Successful in 12s
Details

Browse source
This commit is contained in:
kritzl 2025-03-03 16:46:05 +01:00
commit 155d47222e
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
20 changed files with 5172 additions and 4003 deletions
Download patch file Download diff file Expand all files Collapse all files

95
styleguide/assets/style/styleguide.scss
View file

@ -1,5 +1,5 @@
@import 'base';
@import 'icons';
@import "base";
@import "icons";
* {
box-sizing: border-box;
@ -40,10 +40,14 @@ body {
}
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4, {
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4 {
filter: var(--text-glow-primary);
}
@ -143,7 +147,8 @@ body {
}
}
> a, label {
> a,
label {
display: flex;
align-items: center;
gap: 0.5rem;
@ -171,7 +176,8 @@ body {
&:focus-within {
background-color: transparent;
a, label {
a,
label {
border: solid 0.1em var(--color-glow-primary);
background-color: transparent;
filter: var(--filter-glow-primary);
@ -242,7 +248,6 @@ body {
}
a {
&.a-regular,
&.a-regular:hover,
&.a-regular:active,
@ -294,7 +299,7 @@ a {
}
&::before {
content: '';
content: "";
position: absolute;
inset: 0;
border-radius: 1rem;
@ -344,24 +349,26 @@ pre,
}
}
main > div.generator {
display: flex;
flex-direction: column;
gap: 1em;
align-items: center;
img {
width: 400px;
height: 300px;
object-fit: contain;
filter: drop-shadow(0 0 0.0625em var(--color-white)) drop-shadow(0 0 0.125em var(--color-primary)) drop-shadow(0 0 0.25em var(--color-primary));
filter: drop-shadow(0 0 0.0625em var(--color-white))
drop-shadow(0 0 0.125em var(--color-primary))
drop-shadow(0 0 0.25em var(--color-primary));
}
i {
font-size: 3em;
filter: drop-shadow(0 0 0.0625em var(--color-white)) drop-shadow(0 0 0.125em var(--color-primary)) drop-shadow(0 0 0.25em var(--color-primary));
filter: drop-shadow(0 0 0.0625em var(--color-white))
drop-shadow(0 0 0.125em var(--color-primary))
drop-shadow(0 0 0.25em var(--color-primary));
}
}
@ -399,7 +406,7 @@ main > div.generator {
}
span {
font-family: 'Departure Mono', ui-monospace, monospace;
font-family: "Departure Mono", ui-monospace, monospace;
color: var(--color-foreground);
line-height: 1.5;
}
@ -408,113 +415,113 @@ main > div.generator {
}
.glow-16-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 16px;
color: var(--color-white);
filter: url('glows.svg#textBlur16Primary')
filter: url("glows.svg#textBlur16Primary");
}
.glow-18-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 18px;
color: var(--color-white);
filter: url('glows.svg#textBlur18Primary')
filter: url("glows.svg#textBlur18Primary");
}
.glow-24-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 24px;
color: var(--color-white);
filter: url('glows.svg#textBlur24Primary')
filter: url("glows.svg#textBlur24Primary");
}
.glow-32-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 32px;
color: var(--color-white);
filter: url('glows.svg#textBlur32Primary')
filter: url("glows.svg#textBlur32Primary");
}
.glow-48-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 48px;
color: var(--color-white);
filter: url('glows.svg#textBlur48Primary')
filter: url("glows.svg#textBlur48Primary");
}
.glow-72-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 72px;
color: var(--color-white);
filter: url('glows.svg#textBlur72Primary')
filter: url("glows.svg#textBlur72Primary");
}
.glow-160-primary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 160px;
color: var(--color-white);
filter: url('glows.svg#textBlur160Primary')
filter: url("glows.svg#textBlur160Primary");
}
.glow-16-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 16px;
color: var(--color-white);
filter: url('glows.svg#textBlur16Secondary')
filter: url("glows.svg#textBlur16Secondary");
}
.glow-18-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 18px;
color: var(--color-white);
filter: url('glows.svg#textBlur18Secondary')
filter: url("glows.svg#textBlur18Secondary");
}
.glow-24-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 24px;
color: var(--color-white);
filter: url('glows.svg#textBlur24Secondary')
filter: url("glows.svg#textBlur24Secondary");
}
.glow-32-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 32px;
color: var(--color-white);
filter: url('glows.svg#textBlur32Secondary')
filter: url("glows.svg#textBlur32Secondary");
}
.glow-48-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 48px;
color: var(--color-white);
filter: url('glows.svg#textBlur48Secondary')
filter: url("glows.svg#textBlur48Secondary");
}
.glow-72-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 72px;
color: var(--color-white);
filter: url('glows.svg#textBlur72Secondary')
filter: url("glows.svg#textBlur72Secondary");
}
.glow-160-secondary {
font-family: 'Argon Glow', ui-sans, sans-serif;
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
font-size: 160px;
color: var(--color-white);
filter: url('glows.svg#textBlur160Secondary')
}
filter: url("glows.svg#textBlur160Secondary");
}