Closed Bug 1706084 Opened 4 years ago Closed 3 years ago

The audio blocked, playing, and muted icons on pinned tabs need an inverted stroke

Categories

(Firefox :: Tabbed Browser, defect, P2)

defect

Tracking

()

VERIFIED FIXED
90 Branch
Tracking Status
firefox89 --- verified
firefox90 --- verified

People

(Reporter: jaws, Assigned: mconley)

References

(Blocks 2 open bugs)

Details

(Whiteboard: [proton-tabs-bar] [proton-icons] [priority:2a] [proton-uplift])

Attachments

(3 files)

Attached image image.png (deleted) —

These icons currently lack an inverted stroke and when overlayed on top of a favicon with similar colors they can become indistinguishable.

See attachment for example.

Summary: The audio blocked and audio muted icons on pinned tabs need an inverted stroke → The audio blocked, playing, and muted icons on pinned tabs need an inverted stroke
Assignee: nobody → sfoster
Status: NEW → ASSIGNED

I looks like we'll need updated icons here. I've raised this with UX and will follow up when I know more.

Priority: -- → P2
Whiteboard: [proton-tabs-bar] [proton-icons] → [proton-tabs-bar] [proton-icons] [priority-2a]
Whiteboard: [proton-tabs-bar] [proton-icons] [priority-2a] → [proton-tabs-bar] [proton-icons] [priority:2a]

I've uploaded new/updated icons to the drive folder: audio-blocked-fill-12.svg, audio-circle-fill-12.svg and I've marked them as updated in the spreadsheet. We'll want to check -moz-context-properties include fill and stroke, with fill being the primary icon fill color, and stroke being the background color in this case. We should end up with :

  • Primary icon colour: #5B5B66, background: #FFFFFF for light theme
  • Primary icon colour: #FBFBFE, background: #42414D for dark theme.

Attaching a mini badge spec for audio and audio blocked badges for Pinned Tabs

i'm not currently working on this. The new assets are in the drive folder, see https://docs.google.com/document/d/114gLvaDoZpYnhtK_pPGgbMizphBbjrKp23_YHmWHHLE

Assignee: sfoster → nobody
Status: ASSIGNED → NEW
Assignee: nobody → mconley

It looks like some of the new assets already landed in https://hg.mozilla.org/mozilla-central/rev/f57b728d597bf1f6f906ca2b2d5054a62b5443a3 ... but not browser/themes/shared/tabbrowser/tab-audio-blocked-small.svg.

We're missing an icon for the media blocked state here, so needinfo'ing KatieC for that.

Flags: needinfo?(kcaldwell)

Sam is optimizing the icons for media / media blocked - which now have 2 fills in the SVGs (Sam can you confirm when those are ready?)
file names
• media-blocked-fill-12.svg
• media-fill-12.svg

COLOUR SPECS
In Dark Theme:
primary fill: #FBFBFE // Dark Theme/Icons/Icon on Dark
background fill : #42414D // Dark Theme/Background/Base Layer 03 (Match tab background colour)

In Light Theme
primary fill: ##5B5B66 // Light Theme/Icons/Icon on Light
background fill : ##FFFFFF // Light Theme/Background/Base Layer 03 (Match tab background colour)

Flags: needinfo?(kcaldwell) → needinfo?(sfoster)

I've updated the icon assets in the google drive folder.

Flags: needinfo?(sfoster)
Pushed by mconley@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/7a687102872a Update tab-audio-blocked-small.svg icon and tab icon overlay fill/stroke values for Proton. r=jaws
Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Target Milestone: --- → 90 Branch

Hello I have managed to reproduce the issue with Firefox 89.0a1 (2021-04-18) on Windows 10. I can confirm that the issue is fixed with firefox 90.0a1 (2021-05-04) and 89.0b8.

Thank you!

Status: RESOLVED → VERIFIED
Has STR: --- → yes

To be clear, the original bug was probably fixed by bug 1693384 - but this bug updates some of the colours, as well as the autoplay blocked icon.

Comment on attachment 9219949 [details]
Bug 1706084 - Update tab-audio-blocked-small.svg icon and tab icon overlay fill/stroke values for Proton. r?jaws!

Beta/Release Uplift Approval Request

  • User impact if declined: Users would see slightly off-spec colours for dark/light mode in the tab overlay icons for pinned tabs, and the "blocked autoplay" tab overlay icon would appear without a solid background.
  • Is this code covered by automated tests?: No
  • Has the fix been verified in Nightly?: Yes
  • Needs manual test from QE?: No
  • If yes, steps to reproduce:
  • List of other uplifts needed: Bug 1708154
  • Risk to taking this patch: Low
  • Why is the change risky/not risky? (and alternatives if risky): This is mainly a colour replacement in CSS, as well as an icon asset swap. Very low risk.
  • String changes made/needed: None.
Attachment #9219949 - Flags: approval-mozilla-beta?

Mike, your patch doesn't graft cleanly to beta as I believe it was done on top of changes in bug 1708154 which was marked as wontfix for 89. Could you rebase your patch on beta or could your team decide to uplift bug 1708154 as well? Thanks

Flags: needinfo?(mconley)

(In reply to Pascal Chevrel:pascalc from comment #15)

Mike, your patch doesn't graft cleanly to beta as I believe it was done on top of changes in bug 1708154 which was marked as wontfix for 89. Could you rebase your patch on beta or could your team decide to uplift bug 1708154 as well? Thanks

I think we should push back on marking bug 1708154 as wontfix for 89. It's a simple CSS change and will make future uplifts (this being a prime example) easier and less error-prone.

Waiting to hear back about the needinfo in bug 1708154.

We've requested beta uplift on bug 1708154, which is a dependency for getting this one landed.

Depends on: 1708154
Flags: needinfo?(mconley)

Comment on attachment 9219949 [details]
Bug 1706084 - Update tab-audio-blocked-small.svg icon and tab icon overlay fill/stroke values for Proton. r?jaws!

p2a for MR1, low risk, approved for 89 beta 10, thanks.

Attachment #9219949 - Flags: approval-mozilla-beta? → approval-mozilla-beta+
Whiteboard: [proton-tabs-bar] [proton-icons] [priority:2a] → [proton-tabs-bar] [proton-icons] [priority:2a] [proton-uplift]
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: