Make h1 and h2 headings much more prominent on mobile

- h1: Increased to font-weight 800, size 2.2rem, pure black color
- h2: Increased to font-weight 700, size 1.65rem, removed italic style
- h3: Increased to font-weight 700, size 1.3rem
- Homepage title: Extra bold at font-weight 900, size 2.75rem
- All headings now pure #000 (white in dark mode) for maximum contrast
- Added tight letter-spacing to h1 for better readability

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-23 12:25:45 -05:00
parent 13b157f300
commit b19a48d1b8
2 changed files with 32 additions and 9 deletions
+25 -8
View File
@@ -581,20 +581,37 @@
}
h1 {
font-size: 2rem;
line-height: 2.2rem;
font-weight: 500;
font-size: 2.2rem;
line-height: 2.4rem;
font-weight: 800;
color: #000;
letter-spacing: -0.02em;
}
[data-theme="dark"] h1 {
color: #fff;
}
h2 {
font-size: 1.5rem;
line-height: 1.7rem;
font-weight: 500;
font-size: 1.65rem;
line-height: 1.85rem;
font-weight: 700;
color: #000;
font-style: normal;
}
[data-theme="dark"] h2 {
color: #fff;
}
h3 {
font-size: 1.2rem;
font-weight: 600;
font-size: 1.3rem;
font-weight: 700;
color: #000;
}
[data-theme="dark"] h3 {
color: #fff;
}
p {
+7 -1
View File
@@ -132,8 +132,14 @@ section a[href^="/book/"] {
}
.title-page h1 {
font-size: 2.5rem;
font-size: 2.75rem;
margin-bottom: 1rem;
font-weight: 900;
color: #000;
}
[data-theme="dark"] .title-page h1 {
color: #fff;
}
.title-details {