Pattern library for nib Health Funds
JavaScript CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
src
tasks
.babelrc
.editorconfig
.eslintrc
.gitattributes
.gitignore
.npmrc
README.md
gulpfile.js
package.json
server.js

README.md

nib-pattern-library

The nib-pattern-library can be viewed online here.

Authoring

The following programs are required for authoring the nib-pattern-library:

  • git (the Github app might be easier to use if you're not familier with using a command line)
  • nodejs
  • xcode (for macs) - download from the app store
  • An editor e.g. Atom
  • A browser e.g. Chrome

To submit changes to the nib-pattern-library you'll need a Github account and have setup a SSH key.

Installation

Enter the following commands in a Terminal window on OS X or a Command Prompt window on Windows:

  1. git clone git@github.com:nib-pattern-library/nib-pattern-library.git
  2. cd nib-pattern-library
  3. npm install
  4. npm run build

Open ./dist/index.html to view the nib-pattern-library.

Note: You only ever need to perform this step once.

Note: If you're using the corp wifi you'll need the buildproxy setup on your machine.

Note: You'll need to have an account on npmjs.com and be authorised to access nib's packages.

Building

When you make a change to the nib-pattern-library you'll need to build it in order to view it:

  1. npm run build

Pro tip: use npm run watch to automatically run the build step whenever you change a file.

Pro tip: use npm run start and navigate to http://localhost:5000 to view the site locally.

Publishing

When you're finished making changes to the nib-pattern-library and want to publish them for all to see:

  1. git add -A
  2. git commit -am "<insert a message describing your changes here>"
  3. git pull - check if anyone else has made changes and merge them with your changes
  4. git push

Directory structure

dist/             #all the generated files live here - any changes you make here will be lost!!!
  index.html        #the home page

src/              #all the source files live here

  assets/           #all the style and script files live here
      index.js        #the script entry file where you should write/require your code
      index.scss      #the style entry file where you should write/require your code
      package.json    #the dependency information for your styles, scripts and tests
    test/
     index.js

  content/          #the site content
    index.ejs         #the home page
    pages/            #the content pages
      buttons.ejs
      ...

  layouts/          #the site layouts
    index.ejs
    partials/
      header.ejs
      ...

  templates/        #the site templates
    partials/
      do-list.ejs
      ...