Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
..
Failed to load latest commit information.
config
data
design
docs
partials
templates
ui
.jshintrc
README.mkd
app.js
dev.bat
gruntfile.js
package.json
server.bat

README.mkd

Philosophy

One of the main underlying philosophies is to use well documented design patterns that are being actively maintained.

Here are the architectural decisions made and how to develop on this project.

Browser Support

This code should support the following browsers:

  • IE: 7+
  • Firefox: 4+
  • Chrome: Latest
  • Safari: 5+

HTML

General

  • HTML5
  • ID's should not be used for styling purposes

Forms

Please structure the form markup inline with the twitter Bootstrap markup

JavaScript

This project uses the following frameworks as a basis for keeping the code modular and organised:

CSS

Fonts

The icon font is generated by ico moon using the SVG files found in the ui/fonts/icons/svg directory.

Pre-processor

This project uses the Stylus CSS pre-processor.

Conventions

  • Follow the BEM principles

     .blockname {
       ...
     }
     .blockname__element {
       ...
     }
     .blockname--modifier {
       ...
     }
    
    • Split rules out on to separate lines

Please base your CSS decisions loosely on the following guidelines: https://github.com/csswizardry/CSS-Guidelines

Getting Started

For a new machine setup you will need to have Node.js installed and the Grunt CLI ($ npm install -g grunt-cli).

  1. Go to the root of the project
  2. Install the npm dependencies run $ npm install
  3. Start the preview server in one console $ node app
  4. Start the watcher in a separate console $ grunt dev

Pre Commit

Before committing any changes you need to run grunt from the prototype root to update the production ready assets.

web/ui-prototype/ $ grunt

Components

Take a look through the project layout details for an in-depth explanation for how to build new UI templates and components.

It also includes extra components:

Further documentation

Further documentation should be placed in the docs folder.