digital-canvas / sass-workflow

A starting point for streamlined responsive css / html workflow for rapid front-end development with clean, managable css3, html5.

sass-workflow

sass-workflow project is a starting point for streamlined responsive css / html workflow for rapid front-end development with clean, managable css3, html5.

Project uses:

• sass
• compass
• grunt
• bower
• susy 2
• custom bootstrap
• google fonts
• font-awesome
• jquery
• smartmenus

Workflow Setup

##Install Node.js & project dependencies

1. visit Nodejs and click install
2. check version by > node -v
3. change to working directly

4. npm install

5. sudo npm install -g grunt-cli

6. install ruby
7. install bower > sudo npm -g install bower
8. bower install
9. install bundler

10. sudo bundle install

Use

Setup for development. The css will not be compress (nested). For production enviroment change the grunt.js to use compass:production

Change _/components/sass/_base.css fonts url to customize fonts for your project

ToDo

• scaffold useable/useful html file(s) for home and interior pages
• sample html / scss files for layouts
• experiment with breakpoints for adapative/responsive design samples
• default socialmedia icons (font-awesome?)

Ref Notes

http://anthonyshort.me/using-bower-with-sass-and-compass/

Solorize for color schemes