New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adding CSS / Icons from External Sources #27

sympmarc opened this Issue Feb 5, 2018 · 1 comment


None yet
1 participant

sympmarc commented Feb 5, 2018


  • Question
  • Bug
  • Enhancement

There are times where we'd like to apply some custom CSS to a column, which is possible, but not in any sort of extensive way. I can see why that might be, but it does feel like a limitation.

Here's a specific use case. We have a column for Gender, and would like to be able to add an icon and potentially change the color. Think something like the gender icons in Font Awesome, maybe with blue for boys and pink for girls. We have gender columns in a lot of lists in heath care, as an example.

To do this, we could add a background-image for the icon and set the icon color. However, we'd need to be sure that Font Awesome was loaded in the page. This applies to any icon we might want to use which isn't in Office UI Fabric, which only covers certain things.

Another approach would be to use a CSS-only approach, something like this example. The nice thing about this approach is it wouldn't rely on any external dependencies. However, I don't think there's a good way to add the CSS.

What's the thinking here? I'd love to be able to put a gender example into the samples here, as I think it's a nice visual, leaving all political correctness out of the discussion.


This comment has been minimized.

sympmarc commented Feb 5, 2018

I notice that the Create a button to launch a Flow example includes a chunk of CSS, so maybe this is the preferred approach?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment