search

holoviz / panel

Panel: The powerful data exploration & web app framework for Python
https://panel.holoviz.org
BSD 3-Clause "New" or "Revised" License
4.68k stars 509 forks source link

Make Material Icons accessible? #3106

Open ahuang11 opened 2 years ago

ahuang11 commented 2 years ago

https://fonts.google.com/icons?selected=Material+Icons I've been using Flutter and I really like that I can access all the Material Icons with Icon(Icons.Favorite)

Maybe panel can have something similar? pn.icons.Favorite()

MarcSkovMadsen commented 2 years ago

My take on icons is that

  1. I would like it to be easy to use icons in Panel. They communicate well.
  2. There are many different frameworks of icons (Font Awesome, Bootstrap, Material etc.) and also custom SVG icons. Its difficult to settle on a specific one as they always seem to lack just the icon you need.
  3. Reading through some css blog posts it seems today the recommendation is not to include frameworks but include specific SVGs.

There is an Icon and IconButton model here https://awesome-panel.readthedocs.io/en/latest/packages/awesome-panel-extensions/index.html#icon

ahuang11 commented 2 years ago

Right, I would love to access icons easily too. I wouldn't want the second point to prevent this from being implemented (something is better than nothing imo).

Currently, I simply use emojis (e.g. copy and paste from https://emojipedia.org/large-red-circle/), but the colorful icons make the app look not too appropriate in the professional setting and also no central theme.

Here's a workaround: pn.pane.SVG("https://raw.githubusercontent.com/google/material-design-icons/c1eb6286e18cd49bec9f243e5d38a6712fcdbb0b/src/action/123/materialicons/24px.svg")

But ideally, it would be like pn.icons.Action(color="red")

If a decision is made about the icons, I'm happy to contribute a PR.

maximlt commented 2 years ago

I'd love to see more support for Icons. Anything that prevent Panel users from having to think or learn about web frameworks/CSS and even SVG is good IMO.