diff options
| author |  Inverle <inverle@proton.me>
| 2025-08-06 21:49:13 +0200 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2025-08-06 21:49:13 +0200 |
| commit | 149136fbe252cca4cb8dcdb463df135094bc0f87 (patch) | |
| tree | 9ca659760b0be19b71bff5c41cdc351a376e9cab /p/themes | |
| parent | 9faf2c1fa3c8c3ed82ff4c95733a018d0f9977a7 (diff) | |
Improve sharing via Print (#7728)
List of changes:
* The temporary document for printing is now in an `<iframe>` instead of a new tab
* The whole `<head>` element is copied to the temporary document, except for `<script>` tags to copy over the `<meta>` tags as well
* URLs that contain the instance base URL are now removed from the printed PDF
* The saved filename (PDF) will now default to the article title
* `<details>` is auto expanded
* Styling:
* The main document's `<html>` class is copied over to preserve some styling that might use those classes
* Instead of writing `content_el.innerHTML` to the temporary document, `content_el.outerHTML` is now written instead to apply the styles that select `.content`
* `.dropdown-menu` is now hidden in the printed document, because it can't be expanded anyway
* Headers and footers are hidden in the printed document
* The printed document will now display correctly all the time, by waiting for it to load before calling `print()`
* Before, the stylesheets might've not finished loading and the document was broken
* Better browser support on mobile for this feature
* Before, the document would fail to print on Chrome Mobile
Tested on:
* Firefox - both desktop and mobile, works ✅
* Chrome - both desktop and mobile, works ✅
* Opera - desktop, works (same as Chrome) ✅
* Brave - both desktop and mobile (same as Chrome), works ✅
* Safari - both desktop and mobile, works✅
* Microsoft Edge - both desktop and mobile, works ✅
* GNOME Web - desktop, works ✅
* SeaMonkey - desktop, works ✅
Known issues:
* Images may not finish loading the first time the print dialog is opened
TODO:
* [x] Test on Safari
* [x] Try to fix GNOME Web
Diffstat (limited to 'p/themes')
| -rw-r--r-- | p/themes/base-theme/frss.css | 19 | ||||
| -rw-r--r-- | p/themes/base-theme/frss.rtl.css | 19 |
2 files changed, 36 insertions, 2 deletions
diff --git a/p/themes/base-theme/frss.css b/p/themes/base-theme/frss.css index 01f13635e..23d8876c9 100644 --- a/p/themes/base-theme/frss.css +++ b/p/themes/base-theme/frss.css @@ -2796,13 +2796,30 @@ html.slider-active { /*============*/ @media print { + /* This hides the headers and footers in the printed document on Chrome */ + /* Supported since Chrome 131: https://developer.chrome.com/release-notes/131#page_margin_boxes */ + + @page { + /* Firefox and Safari do not support those yet */ + /* See: https://developer.mozilla.org/en-US/docs/Web/CSS/@page#browser_compatibility */ + + @top-left { content: ''; } + + @top-right { content: ''; } + + @bottom-left { content: ''; } + + @bottom-right { content: ''; } + } + .header, .aside, .nav_menu, .day, .flux_header, .flux_content .bottom, .pagination, #stream-footer, - #nav_entries { + #nav_entries, + .dropdown-toggle { display: none; } diff --git a/p/themes/base-theme/frss.rtl.css b/p/themes/base-theme/frss.rtl.css index 046133dee..9af2c6e2c 100644 --- a/p/themes/base-theme/frss.rtl.css +++ b/p/themes/base-theme/frss.rtl.css @@ -2796,13 +2796,30 @@ html.slider-active { /*============*/ @media print { + /* This hides the headers and footers in the printed document on Chrome */ + /* Supported since Chrome 131: https://developer.chrome.com/release-notes/131#page_margin_boxes */ + + @page { + /* Firefox and Safari do not support those yet */ + /* See: https://developer.mozilla.org/en-US/docs/Web/CSS/@page#browser_compatibility */ + + @top-left { content: ''; } + + @top-right { content: ''; } + + @bottom-left { content: ''; } + + @bottom-right { content: ''; } + } + .header, .aside, .nav_menu, .day, .flux_header, .flux_content .bottom, .pagination, #stream-footer, - #nav_entries { + #nav_entries, + .dropdown-toggle { display: none; } |