Follow these steps to get up and running to demo or test Mayflower. Developers should see our Contribute docs for directions on how to set up your repo for development and contribution purposes.
- Clone this repo
git clone [email protected]:massgov/mayflower.git
- Move into the styleguide directory
cd mayflower/styleguide
- Generate pattern lab default files
php core/console --generate
- Install npm dependencies
npm install
- Run
gulp
- Browse to http://localhost:3000/ (or port shown in gulp output if you've configured it differently)
- Take a look through Mayflower!
- You can use the menu to look at whole page layouts (pages), templates, components (organisms and molecules), child elements (molecules and atoms), and some nuts and bolts (base).
- You can emulate different device sizes by using the size buttons at the top right of the menu bar (S M L FULL RANDOM DISCO).
- You can learn about patterns by clicking the top right COG icon, then selecting "Show Pattern Info" from the drop down.
- When you're done looking, type
CTRL
+C
from your active terminal session to kill thegulp
task. You can always rungulp
again from themayflower/styleguide
directory to get it back up and running. - We're constantly working to add new features, so if you want to make sure you have the latest and greatest remember to run
git pull
before you rungulp
!