keith/Go-Ask-Auntie
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

🔵 other: Initial WP conversion from Eleventy
Sync TODOs with Issues / sync_todos (push) Successful in 7s
Details

Browse Source
This commit is contained in:
Keith Solomon
2026-05-25 16:48:48 -05:00
parent 2e5bfaba89
commit dcb38250f8
56 changed files with 965 additions and 318 deletions
Download Patch File Download Diff File Expand all files Collapse all files
styles/base/typography.css
+15 -54
View File
@@ -1,47 +1,9 @@
/* Basic typographical styles */
/**
* All font sizes are based on 16px base font size and 1920px wide screen
* Default size is expressed as percentage of screen width.
* text-14px: 12px-27px, default: 14px
* text-16px: 14px-28px, default: 16px
* text-18px: 14px-30px, default: 18px
* text-20px: 16px-32px, default: 20px
* text-22px: 17px-33px, default: 22px
* text-25px: 18px-35px, default: 25px
* text-30px: 19px-37px, default: 30px
* text-35px: 20px-40px, default: 35px
* text-38px: 22px-48px, default: 38px
* text-40px: 24px-56px, default: 40px
* text-45px: 25px-64px, default: 45px
* text-50px: 27px-72px, default: 50px
* text-55px: 28px-76px, default: 55px
* text-60px: 30px-80px, default: 60px
* text-70px: 30px-76px, default: 70px
* text-75px: 32px-80px, default: 75px
*
* Font sizes at standard viewport widths:
* | 360px | 640px | 768px | 1024px | 1280px | 1440px | 1920px
* |-------|-------|-------|--------|--------|--------|-------
* text-14px | 12.00 | 12.36 | 12.52 | 12.85 | 13.18 | 13.38 | 14.00
* text-16px | 14.00 | 14.36 | 14.52 | 14.85 | 15.18 | 15.38 | 16.00
* text-18px | 14.00 | 14.72 | 15.05 | 15.70 | 16.36 | 16.77 | 18.00
* text-20px | 16.00 | 16.72 | 17.05 | 17.70 | 18.36 | 18.77 | 20.00
* text-22px | 17.60 | 18.36 | 18.75 | 19.47 | 20.19 | 20.65 | 22.00
* text-25px | 18.00 | 19.26 | 19.83 | 20.98 | 22.13 | 22.85 | 25.00
* text-30px | 18.96 | 20.89 | 21.85 | 23.66 | 25.47 | 26.60 | 30.00
* text-35px | 20.00 | 22.69 | 23.92 | 26.38 | 28.85 | 30.38 | 35.00
* text-38px | 22.40 | 24.85 | 26.48 | 29.04 | 31.60 | 33.20 | 38.00
* text-40px | 24.00 | 26.87 | 28.18 | 30.81 | 33.44 | 35.08 | 40.00
* text-45px | 25.60 | 29.22 | 30.67 | 33.86 | 37.04 | 39.03 | 45.00
* text-50px | 27.20 | 31.58 | 33.16 | 36.90 | 40.65 | 42.98 | 50.00
* text-70px | 30.40 | 37.01 | 40.76 | 47.26 | 53.75 | 57.82 | 70.00
* text-75px | 32.00 | 39.46 | 43.25 | 50.30 | 57.36 | 61.77 | 75.00
*/
/* Go Ask Auntie typographical styles */
@theme {
--font-sans: "Raleway", sans-serif;
--line-height: 1.6;
--font-sans: "Passion One", sans-serif;
--font-headings: "Passion One", cursive;
--line-height: 1.6;
--text-base: 1rem;
--text-14px: clamp(0.75rem, calc(0.7212rem + 0.1282vw), 0.875rem);
@@ -68,14 +30,14 @@
}
body {
background-color: white;
color: black;
background-color: var(--color-teal-light);
color: var(--color-navy);
font-family: var(--font-sans);
font-size: var(--text-base);
line-height: var(--line-height);
}
::selection { background: var(--color-warning); }
::selection { background: var(--color-teal); color: var(--color-white); }
@layer components {
h1, h2, h3,
@@ -111,12 +73,12 @@ body {
}
a, .link {
color: var(--color-bodylinks);
color: var(--color-navy);
text-decoration: none;
transition: color 200ms;
cursor: pointer;
&:hover { color: var(--color-primary); }
&:hover { color: var(--color-red); text-decoration: underline; }
}
h1 a, .h1 a,
@@ -131,18 +93,17 @@ p {
margin-bottom: 1rem;
}
ul { list-style-type: disc; }
ol { list-style-type: decimal; }
li ul, li ol { margin: 0 1rem; }
ol ol { list-style: lower-alpha; }
ol ol { list-style-type: lower-alpha; }
ol ol ol { list-style: lower-roman; }
ol ol ol { list-style-type: lower-roman; }
ol ol ol ol { list-style: lower-alpha; }
ol ol ol ol { list-style-type: lower-alpha; }
pre, code,
samp, style { font-family: monospace; }
@@ -161,14 +122,14 @@ pre code {
}
code {
@apply bg-black/30 px-[3px] py-0.5 font-mono text-black text-xs rounded-sm;
@apply bg-navy/30 px-[3px] py-0.5 font-mono text-navy text-xs rounded-sm;
}
hr {
background-color: black;
background-color: var(--color-navy);
border: none;
display: block;
height: 1px;
margin: 1rem 0;
width: 100%;
}
}