GithubHelp home page GithubHelp logo

sirithink / compass-html5-boilerplate Goto Github PK

View Code? Open in Web Editor NEW

This project forked from sporkd/compass-html5-boilerplate

0.0 2.0 0.0 518 KB

Compass version of the Html5 Boilerplate project by Paul Irish

Home Page: http://html5boilerplate.com

License: Other

compass-html5-boilerplate's Introduction

NOTICE!!! (And Now for Something Completely Different)

If you are using Rails, you should now be using html5-rails instead of this gem. It has all you need to get Html5Boilerplate up and running with the Rails 3 asset pipeline, plus a bunch of other nice new conventions.

For the rest of you who still want to use this gem for standalone projects or for older verisons of Rails, here's what you need to know:

  • The compass CSS library has been moved out of this gem and into the compass-h5bp gem. This allows all implementations using it to benefit from updates to the compass library.
  • The newest version of compass-h5bp uses normalize.css instead of reset, just like current Html5Boilerplate. So stay on v2.0.x if you don't feel like upgrading.

So in short, I have shifted my efforts to html5-rails as the default Rails implementation of compass-h5bp, and I now view this gem as a standalone implementation of compass-h5bp. To this end I will continue to merge selected pull requests.

Of course, I encourage anyone to create other implementations of compass-h5bp for [insert your framework here].

About

HTML5 Boilerplate is a Compass extension based on HTML5 Boilerplate by Paul Irish. You can use it to kick-start fully compliant HTML5 applications. Setup your Rails applications with with fully integrated Haml and Sass/Scss templates that implement Boilerplate's functionality, or generate stand-alone Html5 Compass projects.

Browse html5boilerplate.com for the full workup.

Features

(In addition to Html5 Boilerplate itself)

  • Html5 Boilerplate stylesheets implemented as a modularized Compass library
  • Lets you pick and choose only the Boilerplate mixins and includes you want
  • Generates sass/scss partials to keep your stylesheets organized
  • Generates modularized haml layouts for Rails apps (header, footer, flashes, etc.)
  • Fully commented source, but the haml/sass output remains comment free
  • Not tested on animals

Installation

(This is for stand-alone. Rails install instructions live on only in the git history)

gem install html5-boilerplate
compass create my_project -r compass-h5bp -r html5-boilerplate -u html5-boilerplate --javascripts-dir js --css-dir css

The --javascripts-dir and --css-dir flags are to keep consistent with the original project layout. If you omit them, be sure to edit your javascript and style tags accordingly in index.html.

This will create a my_project directory containing the following files:

index.html
index.html.haml
404.html
crossdomain.xml
robots.txt
humans.txt
apple-touch-icon.png
apple-touch-icon-57x57-precomposed.png
apple-touch-icon-72x72-precomposed.png
apple-touch-icon-114x114-precomposed.png
apple-touch-icon-precomposed.png
favicon.ico

src/style.scss
src/partials/_base.scss
src/partials/_overrides.scss
src/partials/_page.scss
src/partials/_fonts.scss
src/partials/_media.scss

js/jquery-1.6.2.min.js
js/modernizr-2.0.6.min.js
js/plugins.js
js/script.js

.htaccess
config.rb

Run compass watch my_project and the SCSS files above will automatically get compiled to your Sass compilation directory whenever a change is made:

css/style.css

License

HTML5 Boilerplate by Paul Irish
(comments left intact in scss files)

Compass Extension Copyright (c) 2010-2011, Peter Gumeson
http://creativecommons.org/licenses/by/3.0

compass-html5-boilerplate's People

Contributors

corydeppen avatar eugenebolshakov avatar heygrady avatar hughevans avatar kucaahbe avatar rawsyntax avatar sporkd avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.