1637295 - Narrate voice dropdown control bottom border causes it to shift up 0.5/1px when opened

Status: RESOLVED FIXED

(Toolkit :: Reader Mode, defect, P1)

Description

[Itiel]

1. When scrolling a page in reader mode, the top toolbar gets smaller, and the "Done" button shifts 10px to the side.
2. When scrolling a page in reader mode, the reader controls (Type controls, Listen, Save to Pocket) shift a ~1cm to the side.
3. When clicking the Sans-serif / Serif buttons in the Type controls popup, they shift a 1-2px to the side
4. When clicking the voice buttons, they shift a 1-2px to the side

Comment 1

[Tom S [:evilpie]]

In dark mode the "Done" button is a big bright spot. It should probably be changed to look more like the other buttons and be less bright.

Comment 2

[:Gijs (he/him)]

(In reply to Tom Schuster [:evilpie] from comment #1)

In dark mode the "Done" button is a big bright spot. It should probably be changed to look more like the other buttons and be less bright.

This has probably been resolved by the changes in bug 1637652, though tbh I could never reproduce it... what OS was this on?

(In reply to Itiel from comment #0)

1. When scrolling a page in reader mode, the top toolbar gets smaller, and the "Done" button shifts 10px to the side.
2. When scrolling a page in reader mode, the reader controls (Type controls, Listen, Save to Pocket) shift a ~1cm to the side.

This has definitely been resolved by the changes in bug 1637652.

3. When clicking the Sans-serif / Serif buttons in the Type controls popup, they shift a 1-2px to the side

This still needs fixing.

Comment 3

[Tom S [:evilpie]]

Attachment: Screenshot from 2020-05-23 12-57-07.png

As you can see, compared to the rest of the UI the button was a rather large area of brightness. This on Linux Mint using Mint-Y-Dark and the Firefox dark theme, because about:newtab is bright otherwise.

Comment 4

[:Gijs (he/him)]

Linux dark themes have historically been a pain, styling-wise... I can't be sure without setting up the exact same gtk config and so on in a VM (which is tricky at the best of times, as behaviour can also depend on gtk and gnome versions, icon themes, as well as other user configuration), but if the issue was limited to that button, I'm hopeful today's nightly (with the fix from bug 1637652) is better - can you doublecheck once nightlies are available? Thank you!

Comment 5

[Tom S [:evilpie]]

Nice. The new design just uses an "X". Totally unobtrusive. Actually it's almost the least visible button now.

Comment 6

[Itiel]

(In reply to :Gijs (he/him) from comment #2)

3. When clicking the Sans-serif / Serif buttons in the Type controls popup, they shift a 1-2px to the side

This still needs fixing.

Add to that the "Voice" buttons. Clicking them makes the text jump around.

Comment 7

[Itiel]

The San-serif / Serif buttons were fixed in bug 1640417.

Comment 8

[:Gijs (he/him)]

This WFM now (tested on macOS), also in the narrate buttons. Feel free to reopen if you're still seeing this.

Comment 9

[Itiel]

This is still an issue- when you click the "Voice: ..." button to expand the list of voice options, a border-bottom is added to separate it from the list below:
https://searchfox.org/mozilla-central/rev/bf243bc817f97b0bb74af710bd9d874370468e8b/toolkit/themes/shared/narrate.css#206-208

Comment 10

[:Gijs (he/him)]

(In reply to Itiel from comment #9)

This is still an issue- when you click the "Voice: ..." button to expand the list of voice options, a border-bottom is added to separate it from the list below:
https://searchfox.org/mozilla-central/rev/bf243bc817f97b0bb74af710bd9d874370468e8b/toolkit/themes/shared/narrate.css#206-208

I mean, that's not really horizontally right? :P

I'll morph the bug.

Comment 11

[Itiel]

Attachment: Bug 1637295 - Fix the narrate voice dropdown control to not shift a few pixels when open r?gijs

This way of fixing it also has the benefit of restoring the missing bottom border of the whole popup in HCM.

Comment 12

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/86c81c12b4de
Fix the narrate voice dropdown control to not shift a few pixels when open r=Gijs

Comment 13

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/86c81c12b4de