Simple documentation-first tool to build a static design system website based on Markdown documentation files and Twig templates.
Key features:
- Documentation-first approach, builds design system website based on Markdown docs and Twig templates
- Manually control primary navigation
- Automatically generates sibling navigation
- Include code examples and full-page example templates via custom tags (displays embedded code and HTML source code)
- Include sample data for code examples and templates
- Generate colour swatches in documentation
- Extensible via custom tags
- Automatically create ZIP file of frontend assets
- PHP 7.4+
- Composer
Load the library for local development only:
composer require --dev studio24/design-system
If you already have this in your project then just run composer install
to download the files. To update your copy of
the the design system library files run composer update
To build the design system website files:
./vendor/bin/design-system
To see what files the design system is outputting pass the -v
verbose option.
./vendor/bin/design-system -v
You can then view the design system website via:
php -S localhost:8000 -t _dist
See docs for further details.
See contributing for making changes to this repo.
MIT License (MIT) Copyright (c) 2020 Studio 24 Ltd (www.studio24.net)
Developed by Simon R Jones, HTML/CSS design system layout by Nicola Saunders.
Inspired by GOVUK Design System and Drizzle.