0.1.0 • Published 9 years ago

slate-framework v0.1.0

Weekly downloads
3
License
MIT
Repository
github
Last release
9 years ago

Slate

##PRE-ALPHA This framework is in pre alpha so expect many bugs. Check out the milestones for release dates.

npm.io

Basic Installation

The basic usage is intended for users who want to plug and play the Slate framework.

To do this all you need to do is downlaod the slate project files then cop the files form the dist folder into your own structure

Ensure that you have the fonts, js and style all in the same directory so the css knows where to locate the fonts.

To include this in your project is as simple as can be. It is eential that you include the viewport tag because this ensures your website will successfully scale down to mobile view

<head>
	<meta name="viewport" content="width=device-width, initial-scale=1">
    
    <title>Example</title>
    
    <link rel="stylesheet" href="[YOUR LOCATION]/style/slate.min.css">
    <script type="text/javascript" src="[YOUR LOCATION]/js/slate.min.js" ></script>
</head>

Advanced installation (Developers)

Prerequisites

These prerequisites only need to be installed if you plan on editing the core sass files and variables otherwise you can just use the dist css and reffer to basic installation

Run following command in administrative command window once prerequisites are installed to install Grunt task runner.

npm install -g grunt-cli

Initialise Project

Once all the dependancies are installed you can initialise the project to ensure it is working correctly

In the root of the project folder open a command window ( shift + right click for windows users and select open command window here or use change directory) Run npm install which will download all the project dependiencies (which can be found in package.json). This should create a node_modules folder. The node modules should have 3 modules installed:

  • grunt
  • grunt-contrib-sass
  • grunt-contrib-uglify

Once you have all the modules installed run a grunt command in the root of the project. This should return Done, without errors. If this is the messaged you see then the project is set up successfully.

Build Commands

There are 3 commands preset for the task runner.

grunt This command runs the syle task and js task so should be used when you make both style and javascript/jquery changes.

grunt style This command only compiles the scss. This should be used when making changes to the scss only. This outputs a slate.css and a slate.min.css into the dist folder.

grunt js This command compiles all he JS inside the JS folder into one sheet. This should be used when making js changes. This outputs a slate.min.js into the dist folder.