digital-canvas / sass-workflow

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

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

About

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

License:MIT License


Languages

Language:CSS 97.4%Language:JavaScript 1.8%Language:Ruby 0.8%