Giter Site home page Giter Site logo

sinatra-twitter-bootstrap's Introduction

Sinatra Twitter Bootstrap (css+js+helpers)

What?

A set of helpers that brings beauty of Twitter Bootstrap CSS to your Sinatra applications. This gem bundle all CSS and Javascript files needed for this.

Why?

I want to make my small Sinatra apps looks nice with minimal effort. Currently I need to download all CSS and Javascript, add them to public folder and include them in HAML templates. That is just too much work!

How?

Is simple. Add this line to your Gemfile:

gem 'sinatra-twitter-bootstrap', :require => 'sinatra/twitter-bootstrap'

or without bundler, gem install sinatra-twitter-bootstrap and then:

require 'sinatra/twitter-bootstrap'

Then in your Sinatra application/class you can do:

class TestApp < Sinatra::Base
  register Sinatra::Twitter::Bootstrap::Assets
end

(TODO: make this a bit shorter)

Now, surprise surprise! Your application will automatically generate routes for bootstrap CSS and JS files. It will also setup HTTP caching and ETags, so it will not be too much overheat for your app.

Since I'm old and lazy, I create small helpers you can use in your HAML views:

%html
  %head
    = bootstrap_assets
  %body
    - container :fluid do
      - row do
        - span3 do
          = yield
        - span5 :offset => 4 do
          %p hello world

The full example could be found in 'examples' directory.

License

This code is licensed under Apache Software License (ASLv2) http://www.apache.org/licenses/LICENSE-2.0.txt

Twitter Bootstrap is licenced under Apache Software License (ASL) http://www.apache.org/licenses/LICENSE-2.0.txt

JQuery is licenced under MIT license. HTML5 Shiv is licenced under MIT/GPL2 (https://github.com/aFarkas/html5shiv)

sinatra-twitter-bootstrap's People

Contributors

mfojtik avatar

Watchers

Nathan Bain 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.