Integrate Chalk to Existing Projects.
When using Chalk, we recommend beginning from the starter project for the most seamless development experience. However, we know that's not always possible, so here are some tips on integrating Chalk into your existing project.
1. Starting from an existing project (non Client-First)
If you plan to add Chalk components to an existing project that is not Client-First, then you will need to setup some styles.
Chalk components have some dependences in the form of global classes which should be added to your project prior to pasting them in. The following steps out all the requirements before pasting into a non-client-first project.
- Install the Finsweet Chrome Extension and add the Client-First Spacing System to an empty page on your project
- Navigate to the margin spacing section and add three new custom margin spaces with the class names and values as outlined below
- margin-custom1 = 0.75rem
- margin-custom2 = 1.5rem
- margin-custom3 = 2.5rem
- Install the xAtom Chrome Extension and turn it on
- Copy the starter project style guide into the empty page
