Closed Bug 1399235 Opened 2 years ago Closed 2 years ago

The corners of the last urlbar icon overlap the urlbar's rounded corners

Categories

(Firefox :: Theme, defect)

defect
Not set

Tracking

()

RESOLVED FIXED
Firefox 57
Tracking Status
firefox57 --- fixed

People

(Reporter: adw, Assigned: dao)

References

(Depends on 1 open bug)

Details

Attachments

(2 files, 1 obsolete file)

Attached image screenshot
It's hard to see in light mode, but it's obvious in dark mode.
I can't figure out how to do this only in CSS.  Normally the star button is always last, but you can hide it.  The last visible icon could be anything, and there could be any number of hidden icons between it and the end of the urlbar.  (Well, two such icons currently, the star and Pocket.)  There's no way to winnow down a list of matched nodes in CSS, right?

This is based on my patch in bug 1397395.
Duplicate of this bug: 1399296
Comment on attachment 8907318 [details]
Bug 1399235 - The corners of the last urlbar icon overlap the urlbar's rounded corners.

https://reviewboard.mozilla.org/r/178990/#review184280

Can't we just set the border radius on `#page-action-buttons` and set overflow: hidden on that container, or is there some reason that won't work? That would not require any JS.

::: browser/themes/shared/urlbar-searchbar.inc.css:211
(Diff revision 1)
> +.urlbar-icon.last-visible:-moz-locale-dir(rtl),
> +.urlbar-icon-wrapper.last-visible:-moz-locale-dir(rtl) {

Note that now in RTL this item will have both left and right radius. We should probably use :-moz-locale-dir(ltr) for the left radiuses.
Attachment #8907318 - Flags: review?(gijskruitbosch+bugs)
(In reply to :Gijs from comment #4)
> Comment on attachment 8907318 [details]
> Bug 1399235 - The corners of the last urlbar icon overlap the urlbar's
> rounded corners.
> 
> https://reviewboard.mozilla.org/r/178990/#review184280
> 
> Can't we just set the border radius on `#page-action-buttons` and set
> overflow: hidden on that container, or is there some reason that won't work?
> That would not require any JS.

Even simpler, we can set it on #urlbar, and -moz-hidden-unscrollable should be cheaper than hidden since the latter creates a scroll frame.
Comment on attachment 8907585 [details]
Bug 1399235 - Prevent the urlbar-icon hover feedback from bleeding outside the location and search bars.

https://reviewboard.mozilla.org/r/179284/#review184552
Attachment #8907585 - Flags: review?(adw) → review+
Attachment #8907318 - Attachment is obsolete: true
Assignee: adw → dao+bmo
Pushed by dgottwald@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/431fb0d124cd
Prevent the urlbar-icon hover feedback from bleeding outside the location and search bars. r=adw
https://hg.mozilla.org/mozilla-central/rev/431fb0d124cd
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 57
Depends on: 1400231
Duplicate of this bug: 1370401
Duplicate of this bug: 1390754
You need to log in before you can comment on or make changes to this bug.