firefoxux / icons Goto Github PK

Hi everyone, newbie here. So I've been testing the Nightly build for some time now and over time, and I started to feel like the Home icon seems a little busy so I made a couple mockups.

Original:

V1

V2

SVGs (Just rename it back to .svg)
home-16-edit.svg.zip
home-16-edit2.svg.zip

moved from Photon repo, original issue deleted

The default profile pictures (a.k.a. avatars) for Firefox Accounts are now different on every version of Firefox (and different twice in desktop).

I would love to have a default profile picture that worked well on every platform, in a round or square crop.

This is a hard problem, as we need to be inclusive as possible. Luckily some great articles exist for inspiration.

A bonus would be an avatar variation to indicate required actions (e.g. if the account requires verification).

As you can see, it does appear in different sizes. Anything in SVG will work fine.

To make it easier to refer people to specific icons, it would be great if the selected icon would be reflected in the url. (bonus if also the selected platform is reflected in the url)

expected result: a link that will bring someone directly to a view like this:

As reported here consider if we should highlight icons direction.

https://docs.travis-ci.com/user/deployment/pages/

For Tab Hiding we need a 12px Audio Icon to indicate active audio on a hidden tab on the all tabs button in the tabstrip.

Here is the icon I created and Stephen reviewed. Please add it to the repo. Thanks.

Audio 12.zip
Please also add this to the sketch libary. proposed path: Icons / Media / Audio 12

We use both on this page: https://firefoxux.github.io/StyleGuide/#/buttons

But we should probably settle on one.

Can you please detach this repo?

You can this either do it manually or – which I recommend – just contact the GitHub support to do it for you.

This…

1. shows that this is a real maintained project and not just a repo of someone who (once) made a pull request
2. linking to the original repo on every page does not make sense anymore as it has been discontinued/is not maintained anymore and you…
3. can (and IMHO should) still link to the original repo/website/author/… for crediting them, but you can do so in better ways (in the Readme, wiki or so)
4. allows searching in this repo on GitHub and
5. it just looks much nicer

This repo is going to contain not only SVG but also different kind of format according to the platform. So having SVG in the name doesn't make sense anymore.

We “just” need to include https://github.com/FirefoxUX/StyleGuide/blob/gh-pages/index.html#L15 and make sure the sticky search bar is ~50px lower, I think… 😉

It's handy for the web if we could generate an icon font from the SVGs.

There are some tools to do that, like fontello: http://fontello.com/

STR:

1. Enter error.
2. Click "Light".
3. Download.

What happens:
I get this icon:

What should happen: get light icon

https://youwenliang.github.io/Firefox_Icon-Fonts/

(Created by @mark.liang from the Taipei office! 🙂)

Ship the icons with Firefox, reachable through the chrome:// URI.

This allows Firefox to internally make use of the icons.
It also allows third-party WebExtension developers to reference the icons directly without redundantly bundling the icons with every WebExtension.

cc @brassy-

The Dictionaries icon used for the Add-ons Manager looks weird. What is that little thing on the bottom right? A check mark in a circle? Or a download arrow in a circle?

On the screen it looks like this:

If it's meant to be an arrow, perhaps the arrow "body" should be white.

At SF, @brassy- and @aminalhazwani mentioned generating iOS and Android icons. Generating PNGs isn't very hard to do, however, I don't know the exact specification of these PNGs (size, shape, color, ...)

As reported here a camera icons is needed.

Screenshot (on Firefox 54.0.1):

It looks like the "header" lacks a stroke or fill attribute making these SVG transparent on the viewer.
Example (http://design.firefox.com/icons/icons/new/arrowhead-right-16.svg):

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">

Came from Robyn's iOS bookmark and reading list mocks

• Live bookmark folder (like a folder with an rss icon on top?)
• Create new
• Move/Share folder

Now that we have a new fancy domain design.firefox.com we can rename this repository to simply icons so that the product is accessible under design.firefox.com/icons.

One of the section of FxA is locked until users verify their email. Would love a lock icon.

For re-building the all tabs menu as a panel we need an icon for the undo functionality.

Here is the icon I created and Stephen reviewed:
Undo 16.zip
Please also add this to the sketch libary. proposed path: Icon / Navigation / Undo 16

Zip aboutaddons-photon-icon.zip

context-fill isn't supported for the web.

From issue #257

Firefox Accounts would like to make use of a padlock icon to better communicate the encryption and security of parts of its authentication process. We’d love a padlock icon. mozilla/fxa-content-server#5856

Would be nice to have this icon on the photon site

The link in the github repo description is broken.

I filed an issue against the wrong repo. I didn't know this one was here?

Is ignorance of the repo an excuse? Not sure. But help UX find their way by linking here.

It would be nice if devtools could simply use icons from this repo.

Since devtools will be using a more NPM based workflow, I think it would be a good idea to pull assets directly from here.

/cc @jlaster @bgrins

• Add a deprecated category
• Move the current icons into deprecated
• Add the photon new icons

FxA used to offer a Show Password toggle that stayed on until clicked again. For various reasons, we now only show the password when the button is held down.

This matches Microsoft's show password behaviour.

Is this okay for an eyeball password toggle? If not, can we get one?

For some reason, caching no longer works, which means we quickly reach Github's API rate. I know it used to work before though.

The Glyph for the debugger toggleBreakpoints doesn't seem readable to me in the list of glyphs. Is the SVG displaying properly?

http://i.sevaan.com/180T2m2O0j1g

When the new icons were added in, it seems like the new directory wasn't detected by the deploy script

Activity stream has one, and I'm sure this icon would be useful in a lot of places in Firefox.

Step to replicate:

• click on an icon to open the download sidebar
• select icon fill dark
• click on another icon

Is there a tablet icon coming? Send to device knows and shows the difference.

https://design.firefox.com/icons/viewer/#device

• Accessibility Icon.svg.zip
• Report site icon
• about:addons icons
• about:preferences icons

@shorlander suggested this, and I think it's a good idea.

For example let the menu icon be discoverable if a user types hamburger. Let the bookmark icon if a user types star. And so on ☺️

Doesn't look like I can link an individual icon, so here is the search page for window.