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

Styleguide: update heading styles

Browse source
This commit is contained in:
kritzl 2025-02-12 02:12:08 +01:00
commit 55fb595be9
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
7 changed files with 138 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -54,6 +54,7 @@
--color-red-800: #780404;
--color-red-900: #5C0202;
--color-red-950: #3F0101;
--color-white: #FFFFFF;
--color-dark-foreground: var(--color-neutral-50);
--color-dark-background: var(--color-neutral-900);
--color-dark-shade-1: var(--color-neutral-800);
@ -67,7 +68,7 @@
--color-dark-accent-1: #60a5f9;
--color-dark-accent-2: #d381f7;
--color-dark-accent-3: #ff7975;
--color-light-foreground: var(--color-neutral-900);
--color-light-foreground: var(--color-neutral-950);
--color-light-background: var(--color-neutral-50);
--color-light-shade-1: var(--color-neutral-100);
--color-light-shade-2: var(--color-neutral-200);
@ -266,18 +267,11 @@ html.dark {
}
body {
margin: 0;
padding: 1rem;
background-color: var(--color-background);
color: var(--color-foreground);
font-family: "Athiti", ui-sans, sans-serif;
}
main {
max-width: var(--container-4xl);
margin-left: 4rem;
}
h1, .h1,
h2, .h2,
h3, .h3,
@ -285,12 +279,45 @@ h4, .h4,
h5, .h5,
h6, .h6 {
font-family: "Argon Glow", ui-sans, sans-serif;
font-weight: 400;
margin: 0;
}
h1, .h1 {
font-size: var(--text-5xl);
line-height: var();
}
h2, .h2 {
font-size: var(--text-4xl);
line-height: var();
}
h3, .h3 {
font-size: var(--text-3xl);
line-height: var();
}
h4, .h4 {
font-size: var(--text-2xl);
line-height: var();
}
h5, .h5 {
font-size: var(--text-xl);
line-height: var();
}
h6, .h6 {
font-size: var(--text-lg);
line-height: var();
}
code, .code {
font-family: "Departure Mono", ui-monospace, monospace;
display: inline-block;
padding: 1rem 2rem;
padding: 1rem;
border-radius: 1rem;
background-color: var(--color-shade-1);
}
@ -311,6 +338,31 @@ a:visited:hover, a:visited:active, a:visited:focus {
color: var(--color-accent-3);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
min-height: 100vh;
min-width: 100vw;
}
header {
padding: 1rem;
}
main {
max-width: min(var(--container-4xl), 100vw);
padding: 1rem;
overflow: hidden;
}
@media (min-width: 40rem) {
main {
padding-left: 2rem;
}
}
a.a-regular {
color: var(--color-accent-1);
}
@ -321,6 +373,11 @@ a.a-visited {
color: var(--color-accent-2);
}
code, .code {
max-width: 100%;
overflow-x: auto;
}
.layout-column {
display: flex;
}