Getting setup with ISO locally

Getting all of your ducks in a row 🦆.

Setting up your computer

Run these commands in your terminal. You'll only need to ever run these once.

  # Getting setup with ruby to install gems and other fun stuff
  $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  $ brew update
  $ brew doctor
  $ export PATH="/usr/local/bin:$PATH"
  $ brew install node
  $ brew install ruby

Install dependencies

After your computer has homebrew and ruby all set, you'll need to install grunt, jekyll and bundler to run the styleguide locally.

  # Install global stuff
  $ npm install -g grunt-cli # You'll need
  $ gem install jekyll bundler
  $ bundle install

  # Run this every time you want to work on or load the docs locally
  $ grunt

Reference ISO in other projects

Include ISO in the package file.

  # Add in package.json
  "adorama-iso": "git+ssh://git@bitbucket.org/adorama/ux-styleguide.git#dist"

Write CSS in Adorama's codebase

Run grunt to kick off a build script. The build script will copy files from node_modules and start the sass task.

  # In terminal
  $ grunt
  // Load in the settings file into a partial to get started.
  @import "~adorama-iso/sass/settings/settings";

  // Note, that every project will have a different inclusion
  // process for getting ISO out of node_modules.
  // Load in the settings file into a partial to get started.
  @import "~adorama-iso/sass/settings/settings";

  // Now you can use variables
  .elm {
    color: $color-error;
    font-size: $text-size-10;
  }

  // And mixins
  .elm {
    width: 100px;

    @include small {
      width: 200px;
    }

    @include medium {
      width: 300px;
    }
  }