0 Index

An index for all sections of the styleguide.

Technical info

Setup

git clone git@bitbucket.org:instasupply/instasupply-sass.git
cd instasupply-sass

If you want to use vagrant then at this point you can:

vagrant up
vagrant ssh
cd etc/vagrant
npm install
npm run build

If you don't want to use vagrant then you'll neeed to install node.js locally and can start from here:

npm install
npm run build

Usage

Build css and styleguide

npm run build

Builds a minified css file from the /scss folder and builds the static styleguide site.

npm run watch

Watches /scss folder and runs the above build when something changes.

More granular builds
npm run build:css

Builds just the minified css to /styleguide/css folder.

npm run build:styleguide

Builds just the static styleguide to /styleguide folder

Local server

Assuming you have previously built a styleguide via npm run build you can run a local server for the static styleguide site.

npm run start

Starts a local server for styleguide on http://localhost:8080 (This won't work if you're using vagrant and you'll need to access the files directly in your browser)

Updating styleguide theme

You can build a new css file for the styleguide theme by changing styleguide-template/scss/styleguide.scss and using these commands.

npm run build:styleguide-css

Builds css file for the styleguide builder to use.

npm run watch:styleguide-css

Watches styleguide-template/scss and runs the above build when something changes.

Deploying to styleguide.instasupply.com

Master

No production sites should use the master version as it is not considered to be the latest working version.

Anything merged into the master branch will be deployed to the S3 bucket styleguide.instasupply.com. This will usually happen within a minute. You can access https://styleguide.instasupply.com to see your latest changes once the deployment has completed.

Tagged version

Production sites should only use a tagged version.

To deploy a tagged version you need to:

The deployment process will create a new folder based on the version in your package.json version. After deployment this version of the styleguide will be available at https://styleguide.instasupply.com/x.x.x/index.html and the latest css will be available on our CDN at https://st4t1c.com/x.x.x/static/assets/css/instasupply.css