Markup and styles for the **Raspberry Pi Foundation Design System**
npm install @raspberrypifoundation/design-system-coreMarkup and styles for the Raspberry Pi Foundation Design System
!DesignSystemDocumentation&labelColor=CD2355)
!ReactRepository&labelColor=00AECE)
!ReactComponents-label?style=for-the-badge&color=hsla(223%2C%209%25%2C%2085%25%2C%201)&labelColor=00AECE)
!RailsRepository&labelColor=CC0000)
!RailsComponents-label?style=for-the-badge&color=hsla(223%2C%209%25%2C%2085%25%2C%201)&labelColor=CC0000)
---
``
npm install --save @raspberrypifoundation/design-system-core
Dependencies:
* asdf (https://asdf-vm.com/)
`
asdf install
Install packages:
`
npm i
Run Storybook:
`
npm run storybook
Run the tests with npm run test.
If you get an error about Playwright not being installed, you can install it with npx playwright install.
#### Building
You can build a version of the compiled CSS by running npm run build.
#### Development and production builds
The CSS is built as part of the CD process, deploying to https://static.raspberrypi.org/styles/design-system-core/branches/insert branch name here/design-system-core.css. For example, the main branch will get built at
- https://static.raspberrypi.org/styles/design-system-core/branches/main/design-system-core.css
And tagged releases will get built to versioned URLs of the following form, allowing downstream projects to track individual releases of the design system.
- https://static.raspberrypi.org/styles/design-system-core/releases/vx.y.z/design-system-core.css
#### Releasing a version
To find the current version, run npm version (manual)
- To update the npm side of things, run npm version x.y.z, where x, y and z is a semantically versioned release number. You can also run npm version patch, for example.git tag v$version
- Create a tag by running - note the tag starts with a v
- Then run and the tag will be pushedhttps://static.raspberrypi.org/styles/design-system-core/releases/tag/design-system.css`
- Create a release on GitHub and generate the default release notes
- This will trigger GitHub actions to build and release the new version.
- It will also deploy a built version of the CSS to
#### Docker
To Do