mirror of
https://git.sr.ht/~seirdy/seirdy.one
synced 2024-11-10 00:12:09 +00:00
a471edcdf0
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.
33 lines
856 B
CSS
33 lines
856 B
CSS
/* Print stylesheet: hide stuff that we don't need. */
|
|
@media print {
|
|
/* The triangle bullet on summary elements gives no actionable
|
|
* information on print. */
|
|
summary {
|
|
list-style: none;
|
|
}
|
|
|
|
/* Hide screen-only content */
|
|
a[href="#h1"], /* Skip link */
|
|
aside:not([role="note"]),
|
|
/* 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
|
|
* use, see below. */
|
|
article summary,
|
|
section[aria-labelledby="webmentions"],
|
|
/* You can't navigate in a printout. */
|
|
footer,
|
|
/* splitting up sections with <hr> is unnecesary if those
|
|
* sections are removed */
|
|
body > hr,
|
|
nav a:not([rel="home"]) span,
|
|
nav[itemprop="breadcrumb"] {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Print: don't break up self-contained items. */
|
|
figure,
|
|
section[itemprop="mentions"],
|
|
li {
|
|
break-inside: avoid;
|
|
}
|