Skip to content

Chicago/design-patterns

 
 

Repository files navigation

CDS Design Library

This repository serves as a library for the City of Chicago's colors, patterns, logos, and all other assets. It is meant to serve as a guide for city web products, and is open to contribution and discussion. This project is completely open source and in the public domain under the CC0 1.0 License. Any municipality or other organization is free to use, modify, and publish content using designs created for the Design Library. In its current iteration, the CDS takes heavily from the federal government's US Web Design System, and is a direct fork of that project.

Fractal

Fractal is used to publish the atomic design elements of the Chiago Design System. You will need to install the CDS Fractal fork in order to edit and preview your changes to the CDS pattern library. Go here for more information on Fractal and here for more information on atomic design.

  1. If you haven't already, install npm. npm is a package manager for Node based projects. Below is a link to find the install method that coincides with your operating system:
  2. Navigate to the design-library directory
  3. Run
npm install
  1. Run npm start to make sure it's up and running
npm start
  1. Make changes to the components in the 'src' folder
  2. Run
npm install
  1. Install fractal
npm i -g @frctl/fractal
  1. Run fractal build to generate the static site
fractal build
  1. Open the docs folder static site to make sure it generated correctly
  2. Sync with the repo
  3. Make a pull request

For more detailed information on USWDS patterns and their fractal setup, please look at their Github repository.

Packages

No packages published

Languages

  • JavaScript 34.4%
  • CSS 33.5%
  • HTML 32.1%