Closed Bug 1657020 Opened 4 years ago Closed 3 years ago

In our new tab-modal printing UI, the print-preview scrollbar looks like it's a scrollbar for the settings UI


(Toolkit :: Printing, defect, P3)




Tracking Status
firefox81 --- affected


(Reporter: dholbert, Unassigned, NeedInfo)



(Whiteboard: [print2020_v83])


(3 files)

Attached image screenshot


  1. Start Firefox Nightly with a fresh profile.
  2. Go to about:config and toggle print.tab_modal.enabled to true.
  3. Visit or some other long document that's sure to produce multiple pages.
  4. Ctrl+P to trigger the print UI.
  5. Look for the scrollbar that controls the print-preview area (which you would use to scroll through the pages).

The scrollbar looks like it's part of the Settings UI. In particular, it looks like it's an overlay-style scrollbar for the settings area, since the scrollbar tray is the same color as the settings area's background, which makes it look like it's just hovering above that UI and hence part of that UI.

The scrollbar should be easier to differentiate from the settings area, to make it clearer that it's part of the print-preview-area.

My platform is Ubuntu 20.04 (Linux), if it matters, BTW.

This looks off-hand like an unfortunate consequence of the default OS scrollbar background and the hardcoded background for the settings area. Worse is that the same problem occurs on Windows 10, see attachment 9167867 [details] .

Mark, can you prio/severity this, and maybe check with UX what we should do about this?

Flags: needinfo?(mstriemer)
Whiteboard: [print2020] → [print2020_v81]

Heh, note that in RTL this actually looks good...

Attached image Screenshot in RTL

Stephen, do you have any suggestions for what to do here? The mocks seem to have a white background colour for the settings area which could help. Using var(--in-content-box-background) would make it white in light mode, but in dark mode the darker background significantly reduces the contrast between the background and form elements (see bug 1644558 for example screenshots from the about:addons report abuse dialog).

Should we use white as the background in light mode and the regular dark background in dark mode?

Severity: -- → S3
Flags: needinfo?(mstriemer) → needinfo?(shorlander)
Priority: -- → P2
Priority: P2 → P3
Whiteboard: [print2020_v81] → [print2020_v82]

:dholbert, we have adjusted the background color on the settings side. Do you think this is still an issue?

Flags: needinfo?(dholbert)

Moving to 83, but maybe we should close it if Daniel isn't seeing it anymore…

Whiteboard: [print2020_v82] → [print2020_v83]

Sorry, I missed/forgot about the needinfo. The new color is still similar to the scrollbar-tray color (on Linux), but I think it's a bit more differentiated now.

In any case, I'm not perceiving this as being a usability/confusion sort of issue when I open the dialog at this point, so I think this is fine to close.

Closed: 3 years ago
Flags: needinfo?(dholbert)
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.