inherentlee/district-dharma
0
0
Fork 0
generated from inherentlee/11ty
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

header and heading spacing/size

Browse Source
This commit is contained in:
inherentlee
2026-08-21 16:25:18 -07:00
parent f0289728a9
commit 589445e99b
1 changed files with 23 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/main.css
+23 -8
View File
@@ -108,8 +108,13 @@ h1 {
margin-block-end: .6em; margin-block-end: .6em;
} }
h2 { font-size: 2rem; } h2 { font-size: 2.1rem; }
h3 { font-size: 1.8rem; } h3 { font-size: 1.7rem; }
h4 { font-size: 1.4rem; }
@media (max-width: 650px) {
h1 { font-size: 2.6rem; }
}
p { p {
text-wrap: pretty; /* 9. Improve line wrapping */ text-wrap: pretty; /* 9. Improve line wrapping */
@@ -143,17 +148,27 @@ ul p {
/* Header/nav/footer */ /* Header/nav/footer */
header { header {
height: 20vh; --height-base: 20vh; /* Variable height for desktop vs mobile */
padding: calc(20vh / 8); }
@media (max-width: 650px) {
header{
--height-base: 12vh; /* Variable height for desktop vs mobile */
}
}
header {
height: var(--height-base);
padding: calc(var(--height-base) / 8);
background-color: var(--color-accent); background-color: var(--color-accent);
} }
.logo { .logo {
height: 100%; height: 100%;
width: auto; width: auto;
padding: calc(20vh / 30); padding: calc(var(--height-base) / 30);
border: calc(20vh / 50) solid var(--color-accent); border: calc(var(--height-base) / 50) solid var(--color-accent);
border-radius: calc(20vh / 3); border-radius: calc(var(--height-base) / 3);
} }
header a:focus-visible { header a:focus-visible {
@@ -162,7 +177,7 @@ header a:focus-visible {
header a:focus-visible .logo { header a:focus-visible .logo {
border-color: var(--color-text); border-color: var(--color-text);
outline: calc(20vh / 30) solid var(--color-accent-flipped); outline: calc(var(--height-base) / 30) solid var(--color-accent-flipped);
} }
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {