mt-snackbar
v0.0.3
Published
Stencil Component Starter
Downloads
10
Readme
Use icons in stencil
Demo of how to use icon libraries in stenciljs
Getting Started
To try this demo, clone this repo to a new directory:
git clone https://github.com/drygnet/stenciljs-icons-example.git
cd stenciljs-icons-example
git remote rm origin
and run:
npm install
npm start
To build the component for production, run:
npm run build
Three approaches
FontAwesome
... uses the downloaded all.min.css
that expects the font-files to be in the webfonts-directory on the server, look at the copy-block in stencil.config.js
Material Icons
... has all the CSS that is needed included in the component, the same webfonts-directory is used for simplicity
Office UI Fabric Icons
... uses the downloaded fabric-icons-inline.css
that contains all the CSS and the actual font.
Extra files in assets-directory
Not all files in the assets directory are needed, just the ones referenced in the components and the font files that are copied via stencil.config.js
I kept the files if you e.g. don't need the brand-icons in FontAwesome (replace all.min.css
with the CSS you need in the component) or if you want to change the Material Icons implementation to use copied webfonts.