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 dds@infineon.com 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 installor
npm installTo 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-storybookor
npm build-storybookThis 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-storybookor
npm start-storybookstart-storybook also executes watch-css and watch-storybook which automatically update storybook on code change.
Yanchev Tihomir
Werther Kai