Closed Bug 1702474 Opened 4 years ago Closed 4 years ago

Search bar panel is missing shadow on light themes

Categories

(Firefox :: Search, defect, P2)

Firefox 89
defect

Tracking

()

VERIFIED FIXED
89 Branch
Tracking Status
firefox-esr78 --- unaffected
firefox87 --- unaffected
firefox88 --- unaffected
firefox89 --- verified

People

(Reporter: phorea, Assigned: mak)

References

(Blocks 2 open bugs, Regression)

Details

(Keywords: regression, Whiteboard: [proton-address-bar][priority:2b])

Attachments

(4 files)

Attached image search bar panel.png (deleted) —

Note

  • Mac OSX 10.14 is not affected

Affected versions

  • Fx89.0a1 20210329214331

Affected platforms

  • Windows 10 64-bit
  • Ubuntu 20.04

Preconditions

  • The following prefs are enabled in about:config:
    browser.proton.enabled
    browser.proton.toolbar.enabled
    browser.proton.urlbar.enabled

  • System theme is light

Steps to reproduce

  1. Launch Firefox and enable the search bar.
  2. Observe the search bar panel on different websites

Expected result

  • Search bar panel is consistent with Proton theme

Actual result

  • Search bar panel misses shadow so it's hard to differentiate from page content
  • On Ubuntu with default theme, the text from the panel is barely visible
  • I would also suggest that for the search bar, the blue border is visible when the panel is opened, this seems a little unaligned with address bar for which the border is shown only when the panel is closed

Regression range

hm, actually there is a border of color --arrowpanel-border-color... but yes this is missing a dropshadow

This happens because when we set a border-radius, we lose the native dropshadow.

Neil, since you recently looked into bug 1700148, do we have any luck here for Windows and Linux to draw some dropshadow? The workaround would be to remove the border-radius, but it makes the panel a bit exotic compared to others.
I tried -moz-window-shadow: cliprounded; on #PopupSearchAutoComplete but it doesn't work here.

Flags: needinfo?(enndeakin)

My central pull was too old and I didn't have the fix for bug 1700148 in. I see a dropshadow now, but it's square instead of rounded.

The change in 1700148 applied only to menus. To make it apply to panels as well the filter would need to be removed from SetThemeRegion and ClearThemeRegion. I don't see any reason to limit it anyway.

Flags: needinfo?(enndeakin)

I assume by filter you mean the "mPopupType == ePopupTypeMenu" condition

I'll do some experiments with that code to see how it looks.

Assignee: nobody → mak
Priority: -- → P2
Whiteboard: [proton-address-bar] → [proton-address-bar][priority:2b]
Pushed by mak77@bonardo.net: https://hg.mozilla.org/integration/autoland/rev/ae0f3f0e993a Search bar panel is missing shadow or border. r=harry,NeilDeakin,desktop-theme-reviewers
Status: NEW → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → 89 Branch
Regressed by: 1703741
Has Regression Range: --- → yes

Hi Marco, I checked this one on Windows10 64bit, MacOS 10.15 and Ubuntu 20 64bit using latest nightly 89.0a1 and this is what i found using the Light Theme:

Windows10: the shadow is missing on the left border only
Ubuntu: There is no shadow in any border and there is no border line also in all sides.
MacOs: It looks fine, it even has a shadow on the left border.

should i open another bug for this? each OS is looking different for light theme.

thanks

Flags: needinfo?(mak)

(In reply to Pablo from comment #11)

Hi Marco, I checked this one on Windows10 64bit, MacOS 10.15 and Ubuntu 20 64bit using latest nightly 89.0a1 and this is what i found using the Light Theme:

Windows10: the shadow is missing on the left border only

This is expected, the search bar shadow is drawn by the platform code, we have no control over it. The urlbar can do a custom shadow because the QuantumBar project rewrote it completely to use pure html boxes. The searchbar still uses XUL widgets (albeit converted to xhtml).

Ubuntu: There is no shadow in any border and there is no border line also in all sides.

I see both a shadow and a border on Ubuntu 20 Default, no border on Light (but the shadow is there for me), in either Light or Standard Appearance. Thus I cannot reproduce that. We should use the standard border on Linux Default, and the panel should not be rounded.

MacOs: It looks fine, it even has a shadow on the left border.

Yes, but it's again because macOS does that by itself, we have no control.

should i open another bug for this? each OS is looking different for light theme.

That's expected on Windows and Mac, please check again the Ubuntu problem since that sounds like a bug, but as I said I cannot reproduce.

Flags: needinfo?(mak)

hi marco
This is how it looks like on my ubuntu20 default with latest nightly. new profile and i just enabled search bar and i have set the theme to "light" con customize toolbar. Im not sure why i dont see any border or shadow on the dropdown area. sould i open a new bug just in case for ubuntu only?

here are some HD screenshots i took

Flags: needinfo?(mak)
Attached image white.png (deleted) —
Attached image black1.png (deleted) —

I don't know, that's not what I see, please file a bug and we'll try to understand why together.

Flags: needinfo?(mak)

Closing as verified fixed in Firefox 89 beta 7.
I could reproduce the Ubuntu issue mentioned above on Firefox 89 beta 5, however it is fixed in latest Nightly 90.0a1 and Firefox 89 beta 7.

Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: