Closed Bug 1404074 Opened 4 years ago Closed 3 years ago

White space at the edge of the window with Light/Dark theme in windowed mode with compact UI density

Categories

(Firefox :: Theme, defect, P4)

Unspecified
Windows 10
defect

Tracking

()

RESOLVED WORKSFORME
Tracking Status
firefox57 --- wontfix
firefox58 --- affected

People

(Reporter: Eddwardiq, Unassigned)

References

Details

(Keywords: regression, Whiteboard: [reserve-photon-visual])

Attachments

(1 file)

Attached image border.png
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0
Build ID: 20170928100123

Steps to reproduce:

After bug 1403951 landed (which fixed issues with Light/Dark themes after bug 
1366405) there seems to be a minor bug with a Light theme. Maybe it also affects Dark theme but I can not see any issues with this theme, however is still possible that dark color is just hiding it. 
In case of Light theme 2 px from top of the browser are not rendered and showed as white.
Component: Untriaged → Theme
Depends on: 1403951
Assignee: nobody → dao+bmo
Blocks: 1366405
Status: NEW → ASSIGNED
No longer depends on: 1403951
OS: Unspecified → Windows 10
Priority: -- → P1
Whiteboard: [reserve-photon-visual]
Yep, it is also affecting Dark theme, the line is not white but black and since the Dark theme is very dark (almost black) it's almost invisible.
Summary: Top border with Light theme is not rendered (white) in windowed mode after Bug 1403951 → Top border with Light/Dark theme is not rendered (white/black) in windowed mode after Bug 1403951
It seems to be affecting only Compact density since only in this density there is a small gap above tabs in windowed mode. Looks good in Normal / Touch.
The border is actually there, but there's another white line next to it.
Assignee: dao+bmo → nobody
Status: ASSIGNED → NEW
Priority: P1 → P4
Summary: Top border with Light/Dark theme is not rendered (white/black) in windowed mode after Bug 1403951 → White space at the of the window with Light/Dark theme in windowed mode with compact UI density
It's a minor glitch for sure. Maybe it is fixable from the other side since the question is why is there a 2px gap in windowed mode between top border of the tab and border of the browser. I don't think there is such gap in specs and it serves no purpose. In other densities there isn't.
userChrome.css workaround:

> :root[uidensity="compact"] > #titlebar {
>  margin-bottom: -31px !important;
> }
(In reply to Kestrel from comment #5)
> userChrome.css workaround:
> 
> > :root[uidensity="compact"] > #titlebar {
> >  margin-bottom: -31px !important;
> > }
not quite right,
although it basically fixed the point of this bug (no more gap with the white space), but regressed the maximized state.. title bar is too narrow and the tab highlight is not visible...
> :root[uidensity="compact"][sizemode="normal"] > #titlebar {
>   margin-bottom: -31px !important;
> }
Looks good to me, and it doesn't seem to break anything else. All themes are fine and behaviour is consistent with normal and touch density options.
The gap above tabs in windowed mode in compact density is not here also: http://design.firefox.com/people/shorlander/photon/Mockups/windows-10.html
so it basically fixed two things,
https://s1.postimg.org/8v5fpy9j4f/window.png

@Dao is this the way to do it ? Looks like an easy fix, can you look at it again if you have time pls ?
Flags: needinfo?(dao+bmo)
That's fine as userChrome.css workaround, but it's not a proper fix we can ship with Firefox.
Flags: needinfo?(dao+bmo)
Summary: White space at the of the window with Light/Dark theme in windowed mode with compact UI density → White space at the edge of the window with Light/Dark theme in windowed mode with compact UI density
See Also: → 1408079
See Also: 1408079
I'm just wondering if this bug and bug 1398395 are not related together. The unnecessary space below caption buttons in windowed compact mode is about the same as unnecessary space above tabs in windowed mode. Moving everything a bit "up" could solve both issues or better saying three issues, since white/black space above tabs are due to this space which is not as per spec.
See Also: → 1398395
Flags: qe-verify+
Duplicate of this bug: 1417713
Duplicate of this bug: 1425705
If suggested userChrome fix doesn't cut it, where does one look for a proper solution?
I assume the negative margin is not hard coded? So, if I wanted to fix this do I look for a place where it is calculated?
I really want this fixed, and would like to help if I can. Just need some pointers.

The 2px gap above the tabs in compact density mode is correctly themed with light/dark themes both with and without titlebar accent color on latest Nightly 67. The gap itself is Bug 1398395.

Fix window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=0b162c810600246a9273f337c8b23481f7f721f1&tochange=e1f93e89556df2f1147ad2ef2cb38b1309d44ad4

Fixed by Bug 1503306.

Status: NEW → RESOLVED
Closed: 3 years ago
Depends on: 1503306
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.