Table of Contents
As part of the Infineon brand guidelines, the Infineon Digital Design System supports designers, developers and project managers to build user interfaces faster and better – with the ultimate goal to create a coherent and optimal user journey across all internal and external Infineon digital touchpoints.
This repository contains an Bootstrap implementation of Infineons Digital Design System and it's Storybook sourcecode.
Use it to build & run storybook and distribute the Bootstrap SCSS.
npm install --save @infineon/design-system-bootstrap
yarn add @infineon/design-system-bootstrap
import "@infineon/design-system-bootstrap";
- Send an email to [email protected] to get the fontawesome token key. Then execute these two commands:
npm config set "@fortawesome:registry" https://npm.fontawesome.com/
npm config set "//npm.fontawesome.com/:_authToken" <PASTE KEY HERE>
Additional Fontawesome installation instructions can be found here:
For Angular: https://fontawesome.com/v5/docs/web/use-with/angular
For Vue https://fontawesome.com/v6/docs/web/use-with/vue/
For React: https://fontawesome.com/v6/docs/web/use-with/react/
Explore our components in Storybook.
https://storybook-bootstrap.icp.infineon.com
Install all the modules and dependencies listed on the package.json
file with:
yarn install
or
npm install
To deploy Storybook, we first need to export it as a static web app.
To do so, we can use the inbuild build-storybook
command with npm
or yarn
.
yarn build-storybook
or
npm build-storybook
This will generate a static Storybook in the storybook-static
directory.
To start storybook, simply run the inbuild command start-storybook
with npm
or yarn
.
yarn start-storybook
or
npm start-storybook
start-storybook
also executes watch-css
and watch-storybook
which automatically update storybook on code change.
Yanchev Tihomir
Werther Kai