fmaury/seirdy.one
1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-11-23 21:02:09 +00:00
Code Issues Projects Releases Wiki Activity

CSS: reduce h1 top margin

Browse source
This commit is contained in:
Rohan Kumar 2022-07-10 22:38:25 -07:00
parent 0aafdaaddf
commit a8e2de2266
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
1 changed files with 8 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
assets/css/main.css
View file

@ -2,7 +2,7 @@
* touch-friendly layout. * touch-friendly layout.
* Nothing here exists purely for aesthetics; everything addresses a * Nothing here exists purely for aesthetics; everything addresses a
* specific a11y, compatibility, or critical * specific a11y, compatibility, or critical
* usability need. * usability need. The only exception is the h1's top margin.
* *
* One exception: I re-set the input styles so Safari wouldn't make them * One exception: I re-set the input styles so Safari wouldn't make them
* pill-shaped. * pill-shaped.
@ -145,7 +145,7 @@ html {
margin: -.75em -.25em; margin: -.75em -.25em;
} }
header a[href="#main"], header a[href="#main"], /* skip link */
div[itemprop="comment"] dd > a , div[itemprop="comment"] dd > a ,
footer > nav, footer > nav,
/* List items with direct hyperlink children should only have one hyperlink. */ /* List items with direct hyperlink children should only have one hyperlink. */
@ -183,6 +183,7 @@ html {
margin-bottom: 1.75em; margin-bottom: 1.75em;
} }
/* skip link: make it invisible until focused, and put it on the top. */
header a[href="#main"] { header a[href="#main"] {
position: absolute; position: absolute;
top: -2em; top: -2em;
@ -253,11 +254,14 @@ blockquote {
border-left: 3px solid; border-left: 3px solid;
} }
/* Narrow screens: allow hyphenating titles /* Narrow screens: allow hyphenating titles I can't add soft hyphens to
* I can't add soft hyphens to these. */ * these. Also decrease the top margin a bit; the navbar and breadcrumb
* list take up plenty of space on top. The latter is a purely
* aesthetic choice, since it was annoying me a lot. */
h1 { h1 {
-webkit-hyphens: auto; -webkit-hyphens: auto;
hyphens: auto; hyphens: auto;
margin-top: .25em;
} }
/* Very narrow screens: full hyphenation. /* Very narrow screens: full hyphenation.