Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

@media print hides the sidebar and footer #767

Merged
merged 3 commits into from
Feb 13, 2024
Merged

@media print hides the sidebar and footer #767

merged 3 commits into from
Feb 13, 2024

Conversation

Fil
Copy link
Contributor

@Fil Fil commented Feb 13, 2024

@media print hides the sidebar and footer, and reshapes the main section

closes #743

(to test, try to print [or print-to-pdf] in landscape mode, because the sidebar is already hidden in portrait mode)

before (chrome, landscape) after
before-print after-print

Browsers are smart enough to try and use light mode before printing. However if you set the theme to "dark" (only) they might use some sort of "inverted" mode. It works about OK in any case, but in some cases the DOT charts and the text copy might be a bit paler than expected.

Firefox looks a lot like Chrome above. Safari was particularly wrong: it wasn't seeing the correct dimensions and made a very thin column of text. This is also fixed now. (It's a bit painful to test since you have to restart the browser between tries.)

before (safari, portrait) after
safari-before safari-after

It would be nice to have several testers, there are probably situations and browsers and OS that need more fixes. But it's better than nothing.

@Fil Fil requested a review from mbostock February 13, 2024 14:20
Copy link
Member

@mbostock mbostock left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good, but I would either move the media query to the import statement, or fold print.css entirely into layout.css (I think?) where we define the sidebar to keep sidebar-related styles together.

@mbostock mbostock merged commit c7e8c21 into main Feb 13, 2024
2 checks passed
@mbostock mbostock deleted the fil/print.css branch February 13, 2024 17:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

print.css
2 participants