feat(icons): remove autoloading material icons

BREAKING CHANGE: consumer now imports icons. see README.

Author: hobbitronics

README.md

@@ -4,7 +4,8 @@ Reusable Svelte components for some internal applications
 
 ## installation
 
-To install to your Svelte project, open your project's root directory in a terminal. Type `npm i @silintl/ui-components --save-dev` and press enter. You may also have to run `npm i [email protected]  --save-dev` and possibly `npm i [email protected]  --save-dev` to get sass stuff working if it doesn't work initially or you want to develop additional material web components in your app. It may depend on your version of npm if this is necessary. You should already have svelte@3 installed if you are using this library.
+To install to your Svelte project, open your project's root directory in a terminal. Type `npm i @silintl/ui-components --save-dev` and press enter. You may also have to run `npm i [email protected]  --save-dev` and possibly `npm i [email protected]  --save-dev` to get sass stuff working if it doesn't work initially or you want to develop additional material web components in your app. It may depend on your version of npm if this is necessary. You should already have svelte@3 installed if you are using this library. You will also want to include the following code in your index.html for material icons to work. `<link href="https://fonts.googleapis.com/icon?family=Material+Icons&display=swap" rel="stylesheet">`
+`
 
 ## bundler configuration
 

components/mdc/icons/_index.css

@@ -13,7 +13,6 @@ import Dialog from './Dialog'
 import Drawer from './Drawer'
 import Fab from './Fab'
 import IconButton from './IconButton'
-import './icons'
 import { isAboveMobile, isAboveTablet } from './breakpoints'
 import List from './List'
 import Menu from './Menu'

components/mdc/icons/index.js

@@ -6,3 +6,17 @@
 @use './components/mdc/TextInput' with (
   $radius: 16px
 );
+
+/* https://google.github.io/material-design-icons/#sizing */
+.material-icons.md-18 {
+  font-size: 18px;
+}
+.material-icons.md-24 {
+  font-size: 24px;
+} /* this is the default from https://fonts.googleapis.com/icon?family=Material+Icons */
+.material-icons.md-36 {
+  font-size: 36px;
+}
+.material-icons.md-48 {
+  font-size: 48px;
+}