Closed Bug 1631496 Opened 4 years ago Closed 4 years ago

about:networking "categories" list <hr> is impossible to see, and so just creates a subtle odd-looking gap

Categories

(Firefox :: Theme, defect)

defect

Tracking

()

RESOLVED FIXED
Firefox 77
Tracking Status
firefox77 --- fixed

People

(Reporter: dholbert, Assigned: aarushivij, Mentored)

References

Details

(Keywords: good-first-bug)

Attachments

(2 files)

STR:

  1. Visit about:networking
  2. Look at the left "categories" list, between "WebSockets" and "DNS Lookup"

ACTUAL RESULTS:
There's an odd gap.

EXPECTED RESULTS:
There should (maybe?) be a visible horizontal rule there, to separate sections. If I look at the page DOM in devtools, I can see there's a hr element, but its color is nearly-transparent white, which is imperceptible on top of the page's light-gray background.

(Alternately: maybe the hr should be legitimately transparent, rather than almost-but-not-quite-transparent?)

Searchfox link for the styling in question (which makes this hr invisible):
https://searchfox.org/mozilla-central/rev/d2cec90777d573585f8477d5170892e5dcdfb0ab/toolkit/themes/shared/aboutNetworking.css#44

Looks like this styling dates back to bugs 1246498 (which just tweaked some styling that was added in bug 1242073).

ntim, maybe you could take a look? Do you know if this hr was intended to be more visible?

Flags: needinfo?(ntim.bugs)
Attached image screenshot

On the other hand: if this look is in fact what we want, then we can achieve it more declaratively by changing

  border-top-color: rgba(255,255,255,0.15);

...to use transparent as the color (instead of the current nearly-but-not-quite-transparent, effectively-imperceptible-but-still-there color).

The rgba(255,255,255,0.15) color made sense when we had the dark blue category background. The categories have since been redesigned to not have a background with Photon.

The original intent was to have a visible separator, but this is broken now.

Those rules should just be deleted, so the default common.css hr styling can apply:

https://searchfox.org/mozilla-central/rev/d2cec90777d573585f8477d5170892e5dcdfb0ab/browser/components/enterprisepolicies/content/aboutPolicies.css#35-38
https://searchfox.org/mozilla-central/rev/d2cec90777d573585f8477d5170892e5dcdfb0ab/toolkit/themes/shared/aboutNetworking.css#43-46
https://searchfox.org/mozilla-central/rev/d2cec90777d573585f8477d5170892e5dcdfb0ab/toolkit/themes/mobile/global/aboutNetworking.css#41-44

Mentor: ntim.bugs
Flags: needinfo?(ntim.bugs)
Keywords: good-first-bug

Hello, Can I take up this issue?
Thanks :)

Flags: needinfo?(ntim.bugs)

(In reply to aarushivij from comment #4)

Hello, Can I take up this issue?
Thanks :)

Yes, please go ahead :)

Flags: needinfo?(ntim.bugs)
Assignee: nobody → aarushivij
Status: NEW → ASSIGNED
Attachment #9141836 - Attachment description: Bug 1631496 - about:networking 'categories' list <hr> is impossible to see, and so just creates a subtle odd-looking gap r=ntim → Bug 1631496 - Remove outdated `#categories hr` styling. r=ntim
Pushed by ntim.bugs@gmail.com:
https://hg.mozilla.org/integration/autoland/rev/190c19f63256
Remove outdated `#categories hr` styling. r=ntim
Status: ASSIGNED → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 77
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: