Altinn Design System
This design system is based on Pattern Lab code and atomic design principles. The repo contains the source code and configuration for building and running the design system locally and for creating distribution files.
git clone https://github.com/Altinn/DesignSystem.git
Navigate to the root of the code and run:
The design system is divided into three projects: Altinn.no (Infoportal and Portal), Altinn Digital and common.
To run the design system for altinn.no
npm run start:altinn
To run the design system for Altinn Digital
npm run start:altinndigital
To run the design system for components that are common to all projects
npm run start:common
The command will build and run the design system locally on http://127.0.0.1:3000 and automatically rebuild if the source code is changed.
To update the /dist folder
npm run dist
To update the live version of the design system
npm run update:gh-pages
then commit and push the changes to git.
The source code is structured as follows:
###/_patternlab PatternLab specific files: patterns, meta, data and config.
Each project has its own folder. Common components should only be changed in the /common folder, where they will automatically be copied to all other projects. Changes to common components anywhere else will be automatically overwritten.
###/css Changes to css should be made in the scss files under /css/scss. The css files will be automatically updated.