search

riptano / docs-ui

The UI and theme for DataStax Docs.
https://riptano.github.io/docs-ui/
Mozilla Public License 2.0
2 stars 0 forks source link

Extend icon library #84

Open eric-schneider opened 5 months ago

eric-schneider commented 5 months ago

It would be nice to have easy access to additional icons, e.g. code languages and brands, and invoke them in the same/similar way to how we invoke Material icons. The current solution is to add icons as you would any other image, which usually results in poor-looking icons that don't support light/dark mode out of the box.

image

image

eric-schneider commented 5 months ago

Here's a rough framework of what I hope we can do:

  1. Set up a repository of custom icons that's shared between Docs/Design/FE/Portal. If the icons already exist in an Astra code repo, that might be sufficient.
  2. The icons should support light/dark modes by default, and should probably support inline styling via Tailwind.
  3. Implement a system (preferably automated) to regularly import the icons from the shared repo into the docs-ui repo so that we always have up-to-date access to the latest icons.
  4. Support invoking these icons in the Docs UI both in default UI elements and within the AsciiDoc syntax itself, e.g. [.ds-icons]#java_logo#
eric-schneider commented 1 week ago

I just came across fontello (GitHub), which might be of use. It purports to allow you to create your own font libraries with custom images. Unfortunately it looks like it's limited to single-color glyphs, so it may only be helpful for building a library of non-Material glyphs, for example the vector search icon from the Astra Portal:

image

Even though this is just one icon, it's one more icon we can move out of our content source repos and into our UI, so I think it would be worth it just for that.

However, I think it's worth exploring this software a little further to see if it has any further capabilities. It would be nice if we could stop relying on CDNs for things like Material icons, as it would make our UI more durable and secure.