SVG icons
Icons can be used as react components or as web components.
TypeScript definitions are included.
Installation
Run one of the following commands to add @gyldendal/kobber-icons to your project:
npm install @gyldendal/kobber-icons
yarn add @gyldendal/kobber-icons
You will also need to install
react and
react-dom
Usage
Icons can be imported as react components or as web components.
As a react component:
import { ProgressBar } from "@gyldendal/kobber-icons/react";
const App = () => <ProgressBar />;
As a custom element:
<script>
import "@gyldendal/kobber-icons/web-components";
</script>
<kobber-progress-bar />
As a web component:
import { ProgressBar } from "@gyldendal/kobber-icons/web-components";
const progressBar = new ProgressBar();
document.body.appendChild(progressBar);
CSS
CSS can be imported in JavaScript if supported by your bundler:
import "@gyldendal/kobber-base/css/components.css";
Kanskje vi bør inkludere vår egen css baseline i stedet for dette? ↓
Slik som https://mui.com/material-ui/react-css-baseline/
kobber-components assumes that box-sizing
is set to border-box
:
html {
box-sizing: border-box;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
We recommend using normalize.css or something similar to normalize browser styles.