Now that more mobile browsers support text zoom, I don't need to worry
about font size as much. Moreover, iOS and Android support a zoomed mode
that makes all tap targets and text larger. This mode made my site's
larger text uncomfortably larger than other sites. On Android, this is
the "Display size" setting; on iOS, this is the "display zoom" setting
under "Display and Brightness" section.
This commit switches everything back to the browser's default font
sizes to better accomodate non-default zoom levels and display zoom
settings.
New foreground colors when BOTH "prefers-color-scheme: dark" and
"prefers-contrast: more" media queries evaluate to "true" at the same
time. Regular and reduced-contrast dark-mode remain unchanged, and
non-dark colors continue to be browser-defaults.
High-contrast dark-mode now has visually distinct visited/unvisited
links for red-green and blue-yellow color blindness, and targets an even
higher APCA contrast.
- CSS containment was cutting off nested list-item markers; increase
their padding to compensate
- Remove nested <details> use, it was causing problems and was probably
unnecessary
- Increase list padding so that ordered-list decimal markers have space
to fit without overflowing.
- Improve style for removing underline between h-card name and photo, so
it doesn't apply to any unnecessary elements.
- Reduce budget for document size.
- Fix unnecessarily excessive spacing around "li > article" entry data
(was due to containment)
- Aesthetic tweak: ugly underline between microformat u-photo and p-name
- Make CSS file smaller by using some microformats2 classnames instead
of microdata attributes.
- Remove unnecessary elements from attribute selectors wherever it
improves compression.
- Dark theme: prevent active link color from being overridden.
- Sort properties/attributes to improve compression ratios.
- Bump font size from 109% to 109.375% so the default font size hits
17.5px and we get nice round numbers.
