🎽⚡️ Living pattern library generator. Move fast and don't break your patterns.
- Colour definitions
- Type styles
- Components documentation
- Guidelines for writing content
npm install --save-dev rikki-patterns
Running the preview server
We use a system of Design Tokens similar to SalesForce Lightning Design System, so that you can export the tokens for your environment.
rikki tokens# Potential future arguments: --tokens colours,breakpoints,typography --path ./my_app/tokens --format sass
Available formats are Sass, CSS, JSON, XML.
Creating a new component
rikki component <name>
Installing into Python apps
The templates use Nunjucks/Jinja2 and React. You can add the template paths to your application to make direct use of the components.
Installing into your Sass workflow
To build the frontend assets into your application's static file directory:
npm run build ./my_app/static
To watch changes to the Design System and automatically export them to your app:
npm run watch ./my_app/static
nvm install# Then, install all project dependencies.npm install# Install the git hooks../.githooks/deploy# Set up a `.env` file with the appropriate secrets.touch .env
Working on the project
Everything mentioned in the installation process should already be done.
# Make sure you use the right node version.nvm use# Start the server and the development tools.npm run start# Runs linting.npm run lint# Runs tests.npm run test# View other available commands with:npm run
- Make a new branch for the release of the new version.
- Update the CHANGELOG.
- Update the version number in
package.json, following semver.
- Make a PR and squash merge it.
- Back on master with the PR merged, follow the instructions below.
npm run dist# Use irish-pub to check the package content. Install w/ npm install -g first.irish-pubnpm publish
- Finally, go to GitHub and create a release and a tag for the new version.