patternfly-elements icon indicating copy to clipboard operation
patternfly-elements copied to clipboard

[feat] pfe-icon | Update to use font awesome

Open castastrophe opened this issue 4 years ago • 9 comments

Currently pfe-icon serves rh and web prefixed icons from access.redhat.com as default icon libraries. I would like to consider migrating our default to Font Awesome (in line with PatternFly Core).

I found a hosting resource for font-awesome that includes the SVG assets: https://github.com/FortAwesome/Font-Awesome/tree/master/svgs

castastrophe avatar May 12 '21 17:05 castastrophe

@castastrophe I just talked to a bunch of our UX/Design folks for the unified nav and Patternfly and they have a subset of FA free and some PF icons that they use, I was thinking instead of adding all FA we use their subset, they even have a handy lookup table: https://www.patternfly.org/v4/guidelines/icons/#all-icons

I vote we use that for consistency, I have the icons up on the portal's static file spot (where the default icons pfe-icon uses now live). I'll have a PR shortly.

wesruv avatar Jun 17 '21 17:06 wesruv

@wesruv This is listed as low priority and flagged for our 2.0 release so I'm not sure working through a PR on this right now is a great use of time unless it maps to a business need you have. Can you sync with @kylebuch8 on the prioritization board? In our internal ranking sheet, it's listed as #161.

castastrophe avatar Jun 17 '21 17:06 castastrophe

Re: the hosting and the approach

There's a movement away from access.redhat.com's hosting for the upstream and part of what this proposal lets us do is decouple Red Hat-specific sources from the component by pointing to an open source set of assets. If you want to redirect CP to the access hosting location, you can do that in a config file for the site.

castastrophe avatar Jun 17 '21 17:06 castastrophe

Example config from the pfe-icon README:

window.PfeConfig = {
  IconSets: [
    {
      name: "web",
      path: "path/to/svg/directory", // Or https://hosted-icons.com/,
      resolveIconName: function(name, iconSetName, iconSetPath) { // Optional function to resolve icon paths.
        var regex = new RegExp("^" + iconSetName + "-(.*)");
        var match = regex.exec(name);
        return iconSetPath + match[1] + ".svg";
      }
    }
  ]
};

castastrophe avatar Jun 17 '21 17:06 castastrophe

I need a pencil icon that's in FA for the account dropdown, so the good options I see are: Add this icon set to every site (not my fave) Add this icon set to PFE as an additional option (would much prefer)

wesruv avatar Jun 17 '21 17:06 wesruv

Ok, I talked to Kyle and I understand your comment better, I think I have a way forward, thanks!

wesruv avatar Jun 17 '21 18:06 wesruv

@wesruv Awesome! Would you mind sharing it here please so we include that in our planning discussions?

castastrophe avatar Jun 21 '21 12:06 castastrophe

@bennypowers Is this PR relevant anymore?

castastrophe avatar Apr 21 '22 16:04 castastrophe

This one specifically we should consider as part of the RHDS/PFE1:1 migration

bennypowers avatar Apr 24 '22 07:04 bennypowers