VOOZH about

URL: https://phabricator.services.mozilla.com/D301967

⇱ ⚙ D301967 Bug 2041529 - Add-ons Manager Nova icons r=#extension-reviewers!


Bug 2041529 - Add-ons Manager Nova icons r=#extension-reviewers!
ClosedPublic

Authored by sthompson on Fri, May 22, 2:12 AM.
Referenced Files
F72930659: D301967.1781803307.diff
Wed, Jun 17, 5:21 PM
Unknown Object (File)
Tue, Jun 16, 2:56 PM
Unknown Object (File)
Tue, Jun 16, 1:22 PM
Unknown Object (File)
Mon, Jun 15, 6:40 PM
Unknown Object (File)
Mon, Jun 15, 3:31 PM
Unknown Object (File)
Mon, Jun 15, 2:44 PM
Unknown Object (File)
Fri, Jun 12, 12:54 PM
Unknown Object (File)
Sat, Jun 6, 5:56 AM
Subscribers
None

Details

Summary

Displays the Nova iconography when is true.

Updates 7 existing add-ons icons with the following approach:

  1. wraps the existing <path>(s) in a
  2. appends the Nova redrawn icon's <path>(s) in a
  3. adds a <style> block with rules to show only one group at a time

This is an unorthodox approach. It has several drawbacks:

  1. increases individual SVG size
  2. increases the time required to render each SVG
  3. viewing the SVGs in normal image tools will only show the Proton variant, which is confusing

However, I think this approach is better than alternatives.

  1. do not need to add new Nova icon files and CSS rules to use them conditionally
  2. SVG uses in XHTML and similar contexts doesn't require special handling
  3. this can be undone very easily after Nova is released, leaving only the Nova paths
  4. the SVG rendering performance impact is not large, and alternatives would still have non-zero performance impact
  5. total size of SVGs is not that much larger than if we added separate Nova icons

Diff Detail

Event Timeline

phab-bot changed the visibility from "Custom Policy" to "Public (No Login Required)".
phab-bot changed the edit policy from "Custom Policy" to "Restricted Project (Project)".
phab-bot removed a project: secure-revision.
Comment Actions

note: @sthompson I have a try locally with this patch and D301960 applied locally, the icons that are being refreshed looks good to me (I try out manually how they looked like with and without nova, and confirmed the nova one to be shown when nova is enabled, nova + dark mode, nova + bidi, a non default theme light and dark and an addon card for an extension without any icon that would use the extensionGeneric.svg fallback icon, also regular and zoomed page).

And so I'm approving this patch as r+wc, where the comments are related to a few icons that are used by about:addons but not being refreshed in any of the patches in this patch stack (to double-check if they should, where to ask and track them). In a separate section at the end of this phabricator comment I'm also going to highlight a few that are being refreshed in the first patch from this patch stack (D301960) for completeness.

note: I'm mainly interested into determining what we should be doing with the ones that are not being refreshed in any of the patches in this patch stack:

to determine if there should be a followup for them (either in this patch or in a separate one), but beside that this patch looks good to me (and unless I'm mistaken non of the icons refreshed in this patch have any of the issues highlighted by Dao in D301960).


about:addons icons not refreshed in any of the patches in this patch stack

This one is used in the about:addons sidebar to represent the add-on type (and also the add-on type, where it is called but it is actually generated from at build time).

This icon will be shown in the about:addons sidebar when a dictionary or a langpack are installed.

I assume that we would like to refresh this icon for nova, sthompson should I ask in a specific nova slack channel?

I'd be ok with handling it in a separate phabricator revision if we prefer, as long as we are tracking it and highlighted the need to refresh this icon in the appropriate channels / docs.

This is basically a 180 degrees rotate version of , given that the icon refreshed for Nova is still a circle with an upward arrow like it currently is then I'd expect to also be refreshed but staying quite similar to the current icon.

Before porting the sidebar to moz-page-nav/moz-page-nav-button we used to be controlling the icon from the CSS side, and we could have opted to remove category-recent.svg and just rotate category-available.svg from the CSS rules, but now it is set by moz-page-nav-button as the src of an img tag inside moz-page-nav-button shadow DOM and so that wouldn't be possible anymore from aboutaddons.css.

At this point I guess the quickest option would be to refresh too as we are doing for .

this is used in the about:addons sidebar for the recommended view and for the badge shown on the recommended extensions (e.g. in a uBlock origin add-on card):

It doesn't seem to be used anywhere else (at least not anymore, it seems it was originally called competitiveness.svg and used in the now removed shopping component)

Questions for the short term:

  • should we refresh this icon for nova?
  • (as a potential short term followup on our side) should we rename into so that it is clear this is an about:addons specific icon while we are still keeping it around?

This one is used for the badge shown on the line extensions (the extensions owned by Mozilla, e.g. multi account containers):

It is basically a Firefox logo: https://searchfox.org/firefox-main/source/toolkit/themes/shared/extensions/line.svg

I'm not sure if this would need to be refreshed, I guess it depends if we are going to refresh the Firefox application icon.


about:addons icons refreshed by other patches in this patch stack

The following icons also used by about:addons page which are not in this revision but are still refreshed in another patch in this same patch stack (D301960):

  • : this one is the one used for the mlmodel add-on type (it was the one chosen because it is also the one used to represent AI features elsewhere)
  • : used fro the link to the nightly settings link in the sidebar (secondary-nav part of the moz-page-nav sidebar) and it is also currently used by the page options icon in the top-right corner of the about:addons page
  • : used for the SUMO link in the sidebar (also in the secondary-nav part of the moz-page-nav sidebar)
This revision is now accepted and ready to land.Tue, May 26, 1:17 PM

Revision Contents

PathSize
toolkit/
themes/
shared/
extensions/
14 lines
13 lines
13 lines
13 lines
13 lines
13 lines
13 lines
CommitTreeParentsAuthorSummaryDate
63ead8c91c018e32b1e11ac2Stephen Thompson
Bug 2041529 - Add-ons Manager Nova icons r=extension-reviewers,desktop-theme… (Show More…)

Diff 1298982

toolkit/themes/shared/extensions/category-available.svg

Loading...

toolkit/themes/shared/extensions/category-extensions.svg

Loading...

toolkit/themes/shared/extensions/category-plugins.svg

Loading...

toolkit/themes/shared/extensions/category-sitepermission.svg

Loading...

toolkit/themes/shared/extensions/category-themes.svg

Loading...

toolkit/themes/shared/extensions/extension.svg

Loading...

toolkit/themes/shared/extensions/extensionGeneric.svg

Loading...