7 Commits

Author SHA1 Message Date
Calixte Denizet
b4d028132b Sync the viewer chrome with the Firefox design system
The chrome is now authored against Firefox design-token names with the shipped
value as a fallback `var(--fx-token, <literal>)` so colors, borders and radii
follow Firefox instead of having to be re-synced by hand.

In MOZCENTRAL viewer.css imports chrome://global/skin/design-system/tokens-brand.css,
gated on the new pdfjs.enableNova pref (default false, read straight from CSS via -moz-pref()).
With the pref off the sheet isn't applied, every fallback resolves, and the
viewer renders as before, as it also does in the GENERIC and components builds,
which never see the chrome sheet.

Consuming a token means never declaring its name in an unlayered rule, which
would shadow Firefox's for the whole subtree; --focus-outline, --border-color and
--text-color/--button-border-color are therefore renamed to
--editor-selection-outline, --signature-border-color and --views-*. In forced
colors each state reads a matching background/foreground/border triple so it
can't collapse to a single system color.

The dialog button styling also moves out of `.dialog .mainContainer button` into
a shared .primaryButton/.secondaryButton primitive (buttons.css, imported from
pdf_viewer.css so the components build gets it too). The password,
document-properties, print and undo-bar buttons use it in place of .dialogButton,
and the custom radio appearance gives way to native controls tinted with
accent-color.
2026-07-30 23:13:43 +02:00
Calixte Denizet
4bf759404c
Add a new linting task in order to detect unused/unknown css variables in the Firefox build
The goal is to be able to catch the errors before making a release.
And fix some css issues (especially the missing css code for the newly added menu.css)
2025-12-08 09:44:33 +01:00
Jonas Jenwald
ae1cbc6a9e Use the light-dark CSS function in the viewer (issue 17780)
This removes the need for (most) separate `@media (prefers-color-scheme: dark)` blocks when defining colors values, and also provides a simple way of forcing use of either the light or dark theme.

Please refer to https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark and https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme

*NOTE:* To support this in older browsers, we utilize a [PostCSS plugin](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-light-dark-function).
2025-04-23 15:31:39 +02:00
Calixte Denizet
1608e36de6 Remove unused CSS variables 2025-01-07 10:29:23 +01:00
Calixte Denizet
6db49bedbe Update the toggle-button css after the changes in m-c (bug 1940085) 2025-01-06 18:34:08 +01:00
Jonas Jenwald
3596a03279 Fix the RTL-rule for the editorHighlightShowAll button, such that it works outside of the Firefox PDF Viewer
These CSS rules were imported straight from mozilla-central, and contains a property that causes the RTL-rule to be skipped everywhere else (even when using the development viewer in Firefox).
2024-04-10 11:35:04 +02:00
Calixte Denizet
39aeea3e94 [Editor] Add a toggle button to show/hide all the highlights (bug 1867740) 2024-03-07 13:16:59 +01:00