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

Prevent breadcrumbs from overflowing containment

Browse source 
CSS containmnet crops breadcrumb focus indicators when they overflow
their containers. Instead of adding a new rule for this, refactor some
old rules so padding-increases also apply to the breadcrumb containers.
This commit is contained in:
Rohan Kumar 2022-07-15 17:17:59 -07:00
parent 757ded026c
commit a471edcdf0
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
2 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
assets/css/main.css
View file

@ -119,7 +119,7 @@ html {
/* Make superscripts a bit easier to tap. */ /* Make superscripts a bit easier to tap. */
sup > a { sup > a {
margin-left: .25em; margin-left: .25em;
padding-bottom: .25em; padding-bottom: .5em;
} }
/* SC 2.5.5, Google a11y: Increase tap target size a bit /* SC 2.5.5, Google a11y: Increase tap target size a bit
@ -161,6 +161,7 @@ html {
margin: -.75em -.25em; margin: -.75em -.25em;
} }
header > nav,
a[href="#h1"], /* skip link */ a[href="#h1"], /* skip link */
div[itemprop="comment"] dd > a , div[itemprop="comment"] dd > a ,
footer > nav, footer > nav,
@ -174,10 +175,10 @@ html {
} }
/* The nav has to be distant-enough from the top to make room for a /* The nav has to be distant-enough from the top to make room for a
* skip-link. */ * skip-link. The breadcrumbs also can't have their focus-outlines
* overflow while CSS containment is enabled. */
header > nav { header > nav {
margin: .75em 0 0 -.25em; padding: .75em 0 .25em;
display: block;
} }
/* Multiple consecutive <dt> that share a <dd> shouldn't have tap targets overlap */ /* Multiple consecutive <dt> that share a <dd> shouldn't have tap targets overlap */

2
assets/css/print.css
View file

@ -7,7 +7,7 @@
} }
/* Hide screen-only content */ /* Hide screen-only content */
header a[href="#main"], /* Skip link */ a[href="#h1"], /* Skip link */
aside:not([role="note"]), aside:not([role="note"]),
/* An un-opened summary inside an article has no use in print. /* An un-opened summary inside an article has no use in print.
* Outside an article it's used in my webring list where it has some * Outside an article it's used in my webring list where it has some