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

Fix stylesheet's overflow for <pre>, less indent

Browse source
This commit is contained in:
Rohan Kumar 2022-03-28 18:11:21 -07:00
parent bbe85b76e9
commit aa631df58b
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
1 changed files with 14 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
assets/css/main.css
View file

@ -58,7 +58,7 @@ html {
blockquote { blockquote {
border-left: 6px solid #bbb; border-left: 6px solid #bbb;
margin-left: 0; margin-left: 0;
padding-left: 1em; padding-left: 0.75em;
} }
/* narrow screens: remove unused figure margin. */ /* narrow screens: remove unused figure margin. */
@ -74,7 +74,8 @@ nav li,
/* Lists without bullets: navlinks, posts lists, webmentions. /* Lists without bullets: navlinks, posts lists, webmentions.
* Those three are lists whose items are already easily distinguishable, * Those three are lists whose items are already easily distinguishable,
* rendering bullet points as unnecessary extra visual noise. */ * rendering bullet points as unnecessary extra visual noise. Pretty
* much the only purely-aesthetic change in this CSS file. */
.unstyled-list { .unstyled-list {
padding-left: 0; padding-left: 0;
} }
@ -83,7 +84,8 @@ nav li,
list-style-type: none; list-style-type: none;
} }
/* single-line nav on widescreen */ /* single-line nav on widescreen and print.
* Single-line nav on print saves almost half a page. */
@media print, (min-width: 32em) { @media print, (min-width: 32em) {
header nav li { header nav li {
display: inline; display: inline;
@ -91,10 +93,12 @@ nav li,
} }
} }
/* browsers make <pre> small for some dumb legacy reason /* browsers make monospace small and unreadable for some dumb legacy
* and this somehow fixes that. */ * reason and this somehow fixes that without overriding the user's
* font size preferences. */
code, code,
pre { pre,
kbd {
/* stylelint-disable -- compatibility hack */ /* stylelint-disable -- compatibility hack */
font-family: monospace, monospace; font-family: monospace, monospace;
@ -113,11 +117,10 @@ pre {
padding: 0 0.1em; padding: 0 0.1em;
} }
/* Narrow screens: allow horizontal scroll in a pre block, but don't /* Narrow screens: allow horizontal scroll in a pre block. */
* clip it vertically */
pre { pre {
/* csslint ignore:start */ /* csslint ignore:start */
overflow: auto visible; overflow: auto;
/* csslint ignore:end */ /* csslint ignore:end */
padding: 0.5em; padding: 0.5em;
@ -135,7 +138,8 @@ pre,
} }
/* center images that aren't my indieweb icon; same justification as /* center images that aren't my indieweb icon; same justification as
* for centering the body contents. */ * for centering the body contents. Also makes images easier to see
* for people holding a device with one hand. */
img:not(.u-photo) { img:not(.u-photo) {
display: block; display: block;
height: auto; height: auto;
@ -152,7 +156,6 @@ img:not(.u-photo) {
* - Investigate reduced-contrast for dark mode * - Investigate reduced-contrast for dark mode
* - Wait till Webkit fixes its broken-ass default dark stylesheet * - Wait till Webkit fixes its broken-ass default dark stylesheet
* then consider trimming the dark stylesheet I provide. * then consider trimming the dark stylesheet I provide.
* - Narrow screen optimization for bullet indents.
* - Investigate CSS-based hints to screenreaders. * - Investigate CSS-based hints to screenreaders.
* - See if any "-left" properties should switch to "-right" for users * - See if any "-left" properties should switch to "-right" for users
* who machine-translate the page to a RTL language. */ * who machine-translate the page to a RTL language. */