bear-sass 1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: d62cdac09f980079973e75de0eb45bfb3d45f3ff
+  data.tar.gz: bb3f8ff728cd0f70f793754ff9f5c10f2420e2f9
+SHA512:
+  metadata.gz: 474ebea168d26a9861f028a33ec9164c17c4d1de7c105cc7bf86b9c49e8270be0e20b8085574dbc9c91f072ee777ab70435bece5b5bd0f55183c99d066c8abc8
+  data.tar.gz: 07522f8fc1fce6bff033efd1f4c26fb17b5b91b6e3678a14a8035eeb5b471058d87e6a345ea7d232f92335c0ff33b96d7d95625fbe7c3ab424f5a4bf46e4e411

data/.gitignore

@@ -0,0 +1,18 @@
+.sass-cache/
+*.gem
+*.rbc
+.bundle
+.config
+.yardoc
+Gemfile.lock
+InstalledFiles
+_yardoc
+coverage
+doc/
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp

data/Gemfile

@@ -0,0 +1,2 @@
+source "https://rubygems.org/"
+gemspec

data/README.md

@@ -0,0 +1,69 @@
+# Bear - A Sass kit
+
+Bear aims to be an alternative to Twitter's Bootstrap or Foundation. I used to
+take them as a base for my personnal projects but I'm not totally satisfied
+about the style and some components.
+
+* [Documentation](http://robin850.github.io/bear)
+* [Source code](https://github.com/robin850/bear)
+* [License](https://github.com/robin850/bear#license) (MIT licensed)
+
+I hope you will love this project and it will be useful. I'm just "open sourcing"
+this hoping it could be useful for someone.
+
+## Installation
+
+I'm a big fan of Ruby on Rails so the kit is available as a gem:
+
+~~~ruby
+gem 'bear-sass', '~> 1.0'
+~~~
+
+Then run `bundle` to install it and add `@import "bear"` at the top of your
+stylesheet file.
+
+Alternatively, you can download assets using curl or wget:
+
+~~~bash
+$ # To be written...
+~~~
+
+___Complete there___
+
+## Features
+
+* Simple to use and customize
+* Written in Sass
+* Lightweight
+* Make responsive design easy
+* Open source <3
+
+## Basic usage
+
+If you are using Rails, the gem ships with a rails generator for the layout.
+You can optionally give the name of the generated layout:
+
+~~~
+$ rails g bear:layout nice
+~~~
+
+If you are not using Rails, please read the next section.
+
+## Documentation
+
+The documentation is hosted on [github pages](http://robin850.github.io/bear).
+All the components are explained through examples with the necessary code to
+build them.
+
+Feel free to fix typos and contribute to the documentation in the documentation
+directory at the root of this repository. Thanks!
+
+## License
+
+Copyright (c) 2013+ Robin Dupret
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/Rakefile

@@ -0,0 +1,6 @@
+require "bundler/gem_tasks"
+
+desc "Compile the Sass file to CSS"
+task :compile do
+  sh "sass sass/bear.scss:css/bear.css -t compressed"
+end

data/bear-sass.gemspec

@@ -0,0 +1,25 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'bear/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "bear-sass"
+  spec.version       = Bear::VERSION
+  spec.authors       = ["Robin Dupret"]
+  spec.email         = ["robin.dupret@gmail.com"]
+  spec.description   = %q{Bear is a very tiny Sass kit}
+  spec.summary       = %q{The Bear Sass kit}
+  spec.homepage      = "https://robin850.github.io/bear"
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files`.split($/)
+  spec.executables   = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
+  spec.test_files    = spec.files.grep(%r{^(test|spec|features)/})
+  spec.require_paths = ["lib"]
+
+  spec.add_dependency "sass", "~> 3.2.9"
+
+  spec.add_development_dependency "bundler", "~> 1.3"
+  spec.add_development_dependency "rake"
+end

data/css/bear.css

@@ -0,0 +1 @@
+html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none}body{min-width:960px}.row{margin-left:auto;margin-right:auto;width:960px}.container{margin-top:1.5em}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12{display:inline;float:left;margin-left:10px;margin-right:10px}.push_1,.pull_1,.push_2,.pull_2,.push_3,.pull_3,.push_4,.pull_4,.push_5,.pull_5,.push_6,.pull_6,.push_7,.pull_7,.push_8,.pull_8,.push_9,.pull_9,.push_10,.pull_10,.push_11,.pull_11{position:relative}.alpha{margin-left:0}.omega{margin-right:0}.row .grid_1{width:60px}.row .grid_2{width:140px}.row .grid_3{width:220px}.row .grid_4{width:300px}.row .grid_5{width:380px}.row .grid_6{width:460px}.row .grid_7{width:540px}.row .grid_8{width:620px}.row .grid_9{width:700px}.row .grid_10{width:780px}.row .grid_11{width:860px}.row .grid_12{width:940px}.row .prefix_1{padding-left:80px}.row .prefix_2{padding-left:160px}.row .prefix_3{padding-left:240px}.row .prefix_4{padding-left:320px}.row .prefix_5{padding-left:400px}.row .prefix_6{padding-left:480px}.row .prefix_7{padding-left:560px}.row .prefix_8{padding-left:640px}.row .prefix_9{padding-left:720px}.row .prefix_10{padding-left:800px}.row .prefix_11{padding-left:880px}.row .suffix_1{padding-right:80px}.row .suffix_2{padding-right:160px}.row .suffix_3{padding-right:240px}.row .suffix_4{padding-right:320px}.row .suffix_5{padding-right:400px}.row .suffix_6{padding-right:480px}.row .suffix_7{padding-right:560px}.row .suffix_8{padding-right:640px}.row .suffix_9{padding-right:720px}.row .suffix_10{padding-right:800px}.row .suffix_11{padding-right:880px}.row .push_1{left:80px}.row .push_2{left:160px}.row .push_3{left:240px}.row .push_4{left:320px}.row .push_5{left:400px}.row .push_6{left:480px}.row .push_7{left:560px}.row .push_8{left:640px}.row .push_9{left:720px}.row .push_10{left:800px}.row .push_11{left:880px}.row .pull_1{left:-80px}.row .pull_2{left:-160px}.row .pull_3{left:-240px}.row .pull_4{left:-320px}.row .pull_5{left:-400px}.row .pull_6{left:-480px}.row .pull_7{left:-560px}.row .pull_8{left:-640px}.row .pull_9{left:-720px}.row .pull_10{left:-800px}.row .pull_11{left:-880px}.clear,.clearer{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:before,.clearfix:after,.row:before,.row:after{content:'.';display:block;overflow:hidden;visibility:hidden;font-size:0;line-height:0;width:0;height:0}.clearfix:after,.row:after{clear:both}.clearfix,.row{zoom:1}@media only screen and (min-width: 768px) and (max-width: 959px){body{min-width:768px}.row{width:768px}.row .grid_1{width:44px}.row .grid_2{width:108px}.row .grid_3{width:172px}.row .grid_4{width:236px}.row .grid_5{width:300px}.row .grid_6{width:364px}.row .grid_7{width:428px}.row .grid_8{width:492px}.row .grid_9{width:556px}.row .grid_10{width:620px}.row .grid_11{width:684px}.row .grid_12{width:748px}.row .prefix_1{padding-left:64px}.row .prefix_2{padding-left:128px}.row .prefix_3{padding-left:192px}.row .prefix_4{padding-left:256px}.row .prefix_5{padding-left:320px}.row .prefix_6{padding-left:384px}.row .prefix_7{padding-left:448px}.row .prefix_8{padding-left:512px}.row .prefix_9{padding-left:576px}.row .prefix_10{padding-left:640px}.row .prefix_11{padding-left:704px}.row .suffix_1{padding-right:64px}.row .suffix_2{padding-right:128px}.row .suffix_3{padding-right:192px}.row .suffix_4{padding-right:256px}.row .suffix_5{padding-right:320px}.row .suffix_6{padding-right:384px}.row .suffix_7{padding-right:448px}.row .suffix_8{padding-right:512px}.row .suffix_9{padding-right:576px}.row .suffix_10{padding-right:640px}.row .suffix_11{padding-right:704px}.row .push_1{left:64px}.row .push_2{left:128px}.row .push_3{left:192px}.row .push_4{left:256px}.row .push_5{left:320px}.row .push_6{left:384px}.row .push_7{left:448px}.row .push_8{left:512px}.row .push_9{left:576px}.row .push_10{left:640px}.row .push_11{left:704px}.row .pull_1{left:-64px}.row .pull_2{left:-128px}.row .pull_3{left:-192px}.row .pull_4{left:-256px}.row .pull_5{left:-320px}.row .pull_6{left:-384px}.row .pull_7{left:-448px}.row .pull_8{left:-512px}.row .pull_9{left:-576px}.row .pull_10{left:-640px}.row .pull_11{left:-704px}}@media only screen and (max-width: 767px){body{min-width:300px}.row{width:300px}.row .grid_1,.row .grid_2,.row .grid_3,.row .grid_4,.row .grid_5,.row .grid_6,.row .grid_7,.row .grid_8,.row .grid_9,.row .grid_10,.row .grid_11,.row .grid_12{margin:0;width:300px}.row .prefix_1,.row .prefix_2,.row .prefix_3,.row .prefix_4,.row .prefix_5,.row .prefix_6,.row .prefix_7,.row .prefix_8,.row .prefix_9,.row .prefix_10,.row .prefix_11{padding-left:0}.row .suffix_1,.row .suffix_2,.row .suffix_3,.row .suffix_4,.row .suffix_5,.row .suffix_6,.row .suffix_7,.row .suffix_8,.row .suffix_9,.row .suffix_10,.row .suffix_11{padding-right:0}.row .push_1,.row .push_2,.row .push_3,.row .push_4,.row .push_5,.row .push_6,.row .push_7,.row .push_8,.row .push_9,.row .push_10,.row .push_11,.row .pull_1,.row .pull_2,.row .pull_3,.row .pull_4,.row .pull_5,.row .pull_6,.row .pull_7,.row .pull_8,.row .pull_9,.row .pull_10,.row .pull_11{left:0}}@media only screen and (min-width: 480px) and (max-width: 767px){body{min-width:480px}.row{width:420px}.row .grid_1,.row .grid_2,.row .grid_3,.row .grid_4,.row .grid_5,.row .grid_6,.row .grid_7,.row .grid_8,.row .grid_9,.row .grid_10,.row .grid_11,.row .grid_12{margin:0;width:420px}}#header{background-color:#27221c;color:#fff;height:60px;line-height:1.5em;max-height:60px;overflow:hidden;width:100%}#header h1,#header h2,#header h3,#header h4,#header h5,#header h6{color:#fff;line-height:1em;padding-top:18.4px}#header a{color:#fff;font-size:14px;font-weight:bold}#header ul{list-style-type:none;padding-top:18.4px}#header ul li{display:block;float:left;margin-right:1.5em}#header ul:last-child{margin-right:0}.nav-pills{list-style-type:none}.nav-pills li{display:block;height:32px;float:left;overflow:hidden;margin-bottom:1.5em;margin-right:15px;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.nav-pills li a{color:#333;display:block;padding:5px 12px}.nav-pills li.active{background:#27221c;font-weight:bold}.nav-pills li.active a{color:white}body{color:#333;font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:14px;line-height:1.5em}p{line-height:1.5em}h1,h2,h3,h4,h5,h6{color:#333;font-weight:bold;line-height:1.5em}h1,h2,h3{line-height:2em}h1{font-size:2.25em}h2{font-size:2em}h3{font-size:1.75em}h4{font-size:1.5em}h5{font-size:1.25em}h6{font-size:1.115em;font-weight:bold}p+ul{margin-top:0.75em}ul{list-style-type:disc}ol{list-style-type:decimal}ul,ol{padding-left:2em}ul ul,ol ul{margin-top:0;margin-bottom:0;list-style-type:circle}ul ol{list-style-type:decimal}ol ol{list-style-type:lower-alpha}footer{margin:1.5em auto;line-height:1.5em;text-align:center}.alert{background:#eccdcd;color:#ac4142;min-height:20px;margin:0 0 7px 0 !important;overflow:hidden;padding:8px 10px;width:100%;-khtml-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.alert-success,.alert.success{background:#b3dbb2;color:#40833e;min-height:20px;margin:0 0 7px 0 !important;overflow:hidden;padding:8px 10px;width:100%;-khtml-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.alert-warning,.alert.warning{background:#f7ecb5;color:#c09853;min-height:20px;margin:0 0 7px 0 !important;overflow:hidden;padding:8px 10px;width:100%;-khtml-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}button.btn,button.btn-light,button.btn-green,input.btn,input.btn-light,input.btn-green{border:none;box-shadow:none}.btn{background-color:#362f27;color:#ebdeca !important;display:inline-block;font-weight:bold;font-size:14px;text-align:center;line-height:1.5em;padding:7px 20px;vertical-align:middle;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.btn:hover{background-color:#211d18;cursor:pointer}.btn-light{background-color:#e0e0e0;color:#505050 !important;display:inline-block;font-weight:bold;font-size:14px;text-align:center;line-height:1.5em;padding:7px 20px;vertical-align:middle;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.btn-light:hover{background-color:#cecece;cursor:pointer}.btn-green{background-color:#40833e;color:#fff !important;display:inline-block;font-weight:bold;font-size:14px;text-align:center;line-height:1.5em;padding:7px 20px;vertical-align:middle;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.btn-green:hover{background-color:#346b33;cursor:pointer}#header .btn-light,#header .btn-green,#header .btn{margin-top:12px}.label,.tag{background:#e0e0e0;color:#505050;display:inline-block;font-size:11px;font-weight:bold;line-height:1em;padding:3px 4px;vertical-align:baseline;white-space:nowrap;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.label.blue,.label-blue,.tag.blue,.tag-blue{background:#65bfbf;color:#fff;display:inline-block;font-size:11px;font-weight:bold;line-height:1em;padding:3px 4px;vertical-align:baseline;white-space:nowrap;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.label.green,.label-green,.tag.green,.tag-green{background:#40833e;color:#fff;display:inline-block;font-size:11px;font-weight:bold;line-height:1em;padding:3px 4px;vertical-align:baseline;white-space:nowrap;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.label.brown,.label-brown,.tag.brown,.tag-brown{background:#362f27;color:#fff;display:inline-block;font-size:11px;font-weight:bold;line-height:1em;padding:3px 4px;vertical-align:baseline;white-space:nowrap;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.label.red,.label-red,.tag.red,.tag-red{background:#ac4142;color:#fff;display:inline-block;font-size:11px;font-weight:bold;line-height:1em;padding:3px 4px;vertical-align:baseline;white-space:nowrap;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.panel{background:#f2f2f2;border:1px solid #e9e9e9;margin-bottom:2em;margin-top:2em;padding:8px 12px;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}table{background:transparent;border-collapse:collapse;line-height:2em;margin-bottom:2em;width:100%}table thead{display:table-header-group}table th{border-bottom:1px solid #e0e0e0;font-weight:bold;padding-bottom:3px;text-align:left}table td{border-bottom:1px solid #e0e0e0;padding:5px}form{margin:1.5em 0}form input[type="text"],form input[type="email"],form input[type="password"],form input[type="search"],form input[type="time"],form input[type="tel"],form input[type="date"],form input[type="datetime"],form input[type="datetime-local"],form input[type="number"],form input[type="url"],form input[type="week"],form input[type="month"]{background:#fff;border:1px solid #b6b6b6;color:#333;display:block;height:20px;font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:14px;line-height:20px;margin:0.5em 0;outline:none;padding:3px 7px;width:300px;-khtml-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}form textarea{background:#fff;border:1px solid #b6b6b6;color:#333;display:block;height:20px;font-family:Helvetica,arial,freesans,clean,sans-serif;font-size:14px;line-height:20px;margin:0.5em 0;outline:none;padding:3px 7px;width:300px;-khtml-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;min-height:200px;min-width:300px;padding-top:8px}form fieldset{border:1px solid #dcdcdc;padding:1.5em;-khtml-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}

data/lib/bear-sass.rb

@@ -0,0 +1,6 @@
+require "bear/version"
+
+if defined?(Rails)
+  require "bear/engine"
+  require "bear/generators/layout_generator"
+end

data/lib/bear/engine.rb

@@ -0,0 +1,4 @@
+module Bear
+  class Engine < ::Rails::Engine
+  end
+end

data/lib/bear/generators/USAGE

@@ -0,0 +1,8 @@
+Description:
+    Generate a super simple layout using ERb or Slim
+
+Example:
+  rails g bear:layout admin --slim
+
+  This will create a layout file located in:
+    app/views/layouts/admin.html.slim

data/lib/bear/generators/layout_generator.rb

@@ -0,0 +1,18 @@
+require 'rails/generators'
+
+module Bear
+  module Generators
+    class LayoutGenerator < Rails::Generators::Base
+      source_root File.expand_path("../templates", __FILE__)
+      argument :layout, :type => :string, :default => 'application', :banner => 'layout'
+
+      class_option :slim, :type => :boolean,
+                          :desc => "Generate a layout with Slim"
+
+      def touch_layout_file
+        ext = (options.slim?) ? "slim" : "erb"
+        template "layout.html.#{ext}", "app/views/layouts/#{layout}.html.#{ext}"
+      end
+    end
+  end
+end

data/lib/bear/generators/templates/layout.html.erb

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title><%= Rails.application.class.parent_name %></title>
+
+    <%%= stylesheet_link_tag "application" %>
+    <%%= javascript_include_tag "application" %>
+  </head>
+
+  <body>
+
+    <div id="header">
+      <div class="row">
+        <div class="alpha grid_2">
+          <h4><%= Rails.application.class.parent_name %></h4>
+        </div>
+
+        <ul class="grid_10">
+          <li class="active"><%%= link_to "Home", root_path %></li>
+          <li><%%= link_to "Section", "" %></li>
+        </div>
+      </div>
+    </div>
+
+    <div class="container row">
+      <%% if notice %>
+        <div class="alert success"><%%= notice %></div>
+      <% end %>
+
+      <%% if alert %>
+        <div class="alert"><%%= alert %></div>
+      <% end %>
+
+      <%%= yield %>
+    </div>
+
+    <footer>
+      Copyright &copy; company
+    </footer>
+
+  </body>
+</html>

data/lib/bear/generators/templates/layout.html.slim

@@ -0,0 +1,29 @@
+doctype html
+html
+  head
+    meta charset="utf-8"
+    title <%= Rails.application.class.parent_name %>
+
+    = stylesheet_link_tag "application"
+    = javascript_include_tag "application"
+
+  body
+
+    div#header
+      div.row
+        div.alpha.grid_2
+          h4 <%= Rails.application.class.parent_name %>
+        ul.grid_10
+          li.active = link_to "Home", root_path
+          li = link_to "Section", ""
+
+    div.container.row
+      - if notice
+        div.alert.success = notice
+
+      - if alert
+        div.alert = alert
+
+      = yield
+
+    footer Copyright &copy; company

data/lib/bear/version.rb

@@ -0,0 +1,3 @@
+module Bear
+  VERSION = "1.0"
+end

data/sass/_mixins.scss

@@ -0,0 +1,68 @@
+@mixin border-radius($radius: 3px) {
+  -khtml-border-radius: $radius;
+  -moz-border-radius: $radius;
+  -ms-border-radius: $radius;
+  -o-border-radius: $radius;
+  -webkit-border-radius: $radius;
+  border-radius: $radius;
+}
+
+@mixin button($color, $background) {
+  background-color: $background;
+  color: $color!important;
+  display: inline-block;
+  font-weight: bold;
+  font-size: $baseFontSize;
+  text-align: center;
+  line-height: $lineHeight;
+  padding: 7px 20px;
+  vertical-align: middle;
+  @include border-radius(2px);
+
+  &:hover {
+    background-color: darken($background, 7%);
+    cursor: pointer;
+  }
+}
+
+@mixin alert($background, $color: darken($background, 10%)) {
+  background: $background;
+  color: $color;
+  min-height: 20px;
+  margin: 0 0 7px 0!important;
+  overflow: hidden;
+  padding: 8px 10px;
+  width: 100%;
+  @include border-radius(4px);
+}
+
+@mixin label($background, $color) {
+  background: $background;
+  color: $color;
+  display: inline-block;
+  font-size: $labelFontSize;
+  font-weight: bold;
+  line-height: $lineHeight / 1.5;
+  padding: 3px 4px;
+  vertical-align: baseline;
+  white-space: nowrap;
+  @include border-radius(2px);
+}
+
+@mixin field() {
+  background: $white;
+  border: $fieldBorder;
+  color: $fieldColor;
+  display: block;
+  height: 20px;
+  font: {
+    family: $fieldFontFamily;
+    size: $fieldFontSize;
+  }
+  line-height: 20px;
+  margin: 0.5em 0;
+  outline: none;
+  padding: 3px 7px;
+  width: 300px;
+  @include border-radius(3px);
+}

data/sass/_variables.scss

@@ -0,0 +1,46 @@
+// Base
+$baseFontSize: 14px;
+$baseFontFamily: Helvetica, arial, freesans, clean, sans-serif;
+$baseColor: #333333;
+$lineHeight: 1.5em;
+
+// Colors
+$lightGray: #e0e0e0;
+$darkGray: #505050;
+$green: #40833e;
+$white: white;
+$yellow: darken(#fcf8e3, 10%);
+$darkYellow: #c09853;
+$red: #ac4142;
+$blue: #65bfbf;
+$brown: lighten(#211d18, 7%);
+
+// Header
+// $headerBackground: #202523;
+$headerBackground: #27221c;
+$headerHeight: 60px;
+$headerColor: $white;
+
+// Buttons
+$btnBackground: $brown;
+$btnColor: lighten(#e8d9c3, 2%);
+
+$btnGreenBackground: $green;
+$btnGreenColor: $white;
+
+$btnLightBackground: $lightGray;
+$btnLightColor: $darkGray;
+
+// Tags/labels
+$labelFontSize: 11px;
+
+// Panels
+$panelBackground: lighten($lightGray, 7%);
+$panelBorder: 1px solid lighten($darkGray, 60%);
+
+// Forms
+$fieldBorder: 1px solid lighten($darkGray, 40%);
+$fieldFontFamily: $baseFontFamily;
+$fieldFontSize: $baseFontSize;
+$fieldColor: $baseColor;
+$fieldSetBorder: 1px solid lighten($darkGray, 55%);

data/sass/alerts.scss

@@ -0,0 +1,11 @@
+.alert {
+  @include alert(lighten($red, 40%), $red);
+}
+
+.alert-success, .alert.success {
+  @include alert(lighten($green, 40%), $green);
+}
+
+.alert-warning, .alert.warning {
+  @include alert($yellow, $darkYellow);
+}

data/sass/bear.scss

@@ -0,0 +1,20 @@
+@charset "UTF-8";
+
+// Import partials
+@import "variables";
+@import "mixins";
+
+// Import components
+@import "reset";
+@import "grid";
+
+@import "header";
+@import "navs";
+
+@import "typography";
+@import "alerts";
+@import "buttons";
+@import "tags";
+@import "panels";
+@import "tables";
+@import "forms";

data/sass/buttons.scss

@@ -0,0 +1,24 @@
+button, input {
+  &.btn, &.btn-light, &.btn-green {
+    border: none;
+    box-shadow: none;
+  }
+}
+
+.btn {
+  @include button($btnColor, $btnBackground);
+}
+
+.btn-light {
+  @include button($btnLightColor, $btnLightBackground);
+}
+
+.btn-green {
+  @include button($btnGreenColor, $btnGreenBackground);
+}
+
+#header {
+  .btn-light, .btn-green, .btn {
+    margin-top: $headerHeight / 5;
+  }
+}

data/sass/forms.scss

@@ -0,0 +1,32 @@
+form {
+  margin: 1.5em 0;
+
+  input[type="text"],
+  input[type="email"],
+  input[type="password"],
+  input[type="search"],
+  input[type="time"],
+  input[type="tel"],
+  input[type="date"],
+  input[type="datetime"],
+  input[type="datetime-local"],
+  input[type="number"],
+  input[type="url"],
+  input[type="week"],
+  input[type="month"] {
+    @include field();
+  }
+
+  textarea {
+    @include field();
+    min-height: 200px;
+    min-width: 300px;
+    padding-top: 8px;
+  }
+
+  fieldset {
+    border: $fieldSetBorder;
+    padding: 1.5em;
+    @include border-radius(2px);
+  }
+}

data/sass/grid.scss

@@ -0,0 +1,317 @@
+// Based on
+// * http://960.gs/
+// * https://github.com/tylerwolff/960-Responsive-Grid
+
+body { min-width: 960px; }
+
+.row {
+  margin-left: auto;
+  margin-right: auto;
+  width: 960px;
+}
+
+.container {
+  margin-top: 1.5em;
+}
+
+.grid_1,
+.grid_2,
+.grid_3,
+.grid_4,
+.grid_5,
+.grid_6,
+.grid_7,
+.grid_8,
+.grid_9,
+.grid_10,
+.grid_11,
+.grid_12 {
+  display: inline;
+  float: left;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.push_1, .pull_1,
+.push_2, .pull_2,
+.push_3, .pull_3,
+.push_4, .pull_4,
+.push_5, .pull_5,
+.push_6, .pull_6,
+.push_7, .pull_7,
+.push_8, .pull_8,
+.push_9, .pull_9,
+.push_10, .pull_10,
+.push_11, .pull_11 {
+  position: relative
+}
+
+
+.alpha {  margin-left: 0; }
+.omega { margin-right: 0; }
+
+.row {
+
+  .grid_1  { width: 60px; }
+  .grid_2  { width: 140px; }
+  .grid_3  { width: 220px; }
+  .grid_4  { width: 300px; }
+  .grid_5  { width: 380px; }
+  .grid_6  { width: 460px; }
+  .grid_7  { width: 540px; }
+  .grid_8  { width: 620px; }
+  .grid_9  { width: 700px; }
+  .grid_10 { width: 780px; }
+  .grid_11 { width: 860px; }
+  .grid_12 { width: 940px; }
+
+  .prefix_1  { padding-left: 80px; }
+  .prefix_2  { padding-left: 160px; }
+  .prefix_3  { padding-left: 240px; }
+  .prefix_4  { padding-left: 320px; }
+  .prefix_5  { padding-left: 400px; }
+  .prefix_6  { padding-left: 480px; }
+  .prefix_7  { padding-left: 560px; }
+  .prefix_8  { padding-left: 640px; }
+  .prefix_9  { padding-left: 720px; }
+  .prefix_10 { padding-left: 800px; }
+  .prefix_11 { padding-left: 880px; }
+
+  .suffix_1  { padding-right: 80px; }
+  .suffix_2  { padding-right: 160px; }
+  .suffix_3  { padding-right: 240px; }
+  .suffix_4  { padding-right: 320px; }
+  .suffix_5  { padding-right: 400px; }
+  .suffix_6  { padding-right: 480px; }
+  .suffix_7  { padding-right: 560px; }
+  .suffix_8  { padding-right: 640px; }
+  .suffix_9  { padding-right: 720px; }
+  .suffix_10 { padding-right: 800px; }
+  .suffix_11 { padding-right: 880px; }
+
+  .push_1  { left: 80px; }
+  .push_2  { left: 160px; }
+  .push_3  { left: 240px; }
+  .push_4  { left: 320px; }
+  .push_5  { left: 400px; }
+  .push_6  { left: 480px; }
+  .push_7  { left: 560px; }
+  .push_8  { left: 640px; }
+  .push_9  { left: 720px; }
+  .push_10 { left: 800px; }
+  .push_11 { left: 880px; }
+
+  .pull_1  { left: -80px; }
+  .pull_2  { left: -160px; }
+  .pull_3  { left: -240px; }
+  .pull_4  { left: -320px; }
+  .pull_5  { left: -400px; }
+  .pull_6  { left: -480px; }
+  .pull_7  { left: -560px; }
+  .pull_8  { left: -640px; }
+  .pull_9  { left: -720px; }
+  .pull_10 { left: -800px; }
+  .pull_11 { left: -880px; }
+}
+
+.clear, .clearer {
+  clear: both;
+  display: block;
+  overflow: hidden;
+  visibility: hidden;
+  width: 0;
+  height: 0;
+}
+
+.clearfix:before,
+.clearfix:after,
+.row:before,
+.row:after {
+  content: '.';
+  display: block;
+  overflow: hidden;
+  visibility: hidden;
+  font-size: 0;
+  line-height: 0;
+  width: 0;
+  height: 0;
+}
+
+.clearfix:after, .row:after { clear: both; }
+.clearfix, .row { zoom: 1; }
+
+// Tablet Portrait width to 960px
+@media only screen and (min-width: 768px) and (max-width: 959px) {
+
+  body { min-width: 768px; }
+
+  .row {
+    width: 768px;
+
+    .grid_1  { width: 44px; }
+    .grid_2  { width: 108px; }
+    .grid_3  { width: 172px; }
+    .grid_4  { width: 236px; }
+    .grid_5  { width: 300px; }
+    .grid_6  { width: 364px; }
+    .grid_7  { width: 428px; }
+    .grid_8  { width: 492px; }
+    .grid_9  { width: 556px; }
+    .grid_10 { width: 620px; }
+    .grid_11 { width: 684px; }
+    .grid_12 { width: 748px; }
+
+
+    .prefix_1  { padding-left: 64px; }
+    .prefix_2  { padding-left: 128px; }
+    .prefix_3  { padding-left: 192px; }
+    .prefix_4  { padding-left: 256px; }
+    .prefix_5  { padding-left: 320px; }
+    .prefix_6  { padding-left: 384px; }
+    .prefix_7  { padding-left: 448px; }
+    .prefix_8  { padding-left: 512px; }
+    .prefix_9  { padding-left: 576px; }
+    .prefix_10 { padding-left: 640px; }
+    .prefix_11 { padding-left: 704px; }
+
+
+    .suffix_1  { padding-right: 64px; }
+    .suffix_2  { padding-right: 128px; }
+    .suffix_3  { padding-right: 192px; }
+    .suffix_4  { padding-right: 256px; }
+    .suffix_5  { padding-right: 320px; }
+    .suffix_6  { padding-right: 384px; }
+    .suffix_7  { padding-right: 448px; }
+    .suffix_8  { padding-right: 512px; }
+    .suffix_9  { padding-right: 576px; }
+    .suffix_10 { padding-right: 640px; }
+    .suffix_11 { padding-right: 704px; }
+
+    .push_1  { left: 64px; }
+    .push_2  { left: 128px; }
+    .push_3  { left: 192px; }
+    .push_4  { left: 256px; }
+    .push_5  { left: 320px; }
+    .push_6  { left: 384px; }
+    .push_7  { left: 448px; }
+    .push_8  { left: 512px; }
+    .push_9  { left: 576px; }
+    .push_10 { left: 640px; }
+    .push_11 { left: 704px; }
+
+    .pull_1  { left: -64px; }
+    .pull_2  { left: -128px; }
+    .pull_3  { left: -192px; }
+    .pull_4  { left: -256px; }
+    .pull_5  { left: -320px; }
+    .pull_6  { left: -384px; }
+    .pull_7  { left: -448px; }
+    .pull_8  { left: -512px; }
+    .pull_9  { left: -576px; }
+    .pull_10 { left: -640px; }
+    .pull_11 { left: -704px; }
+  }
+}
+// All Mobile Widths
+@media only screen and (max-width: 767px) {
+
+  body { min-width: 300px; }
+
+  .row {
+    width: 300px;
+
+    .grid_1,
+    .grid_2,
+    .grid_3,
+    .grid_4,
+    .grid_5,
+    .grid_6,
+    .grid_7,
+    .grid_8,
+    .grid_9,
+    .grid_10,
+    .grid_11,
+    .grid_12 {
+      margin: 0;
+      width: 300px;
+    }
+
+    .prefix_1,
+    .prefix_2,
+    .prefix_3,
+    .prefix_4,
+    .prefix_5,
+    .prefix_6,
+    .prefix_7,
+    .prefix_8,
+    .prefix_9,
+    .prefix_10,
+    .prefix_11 {
+      padding-left: 0
+    }
+
+    .suffix_1,
+    .suffix_2,
+    .suffix_3,
+    .suffix_4,
+    .suffix_5,
+    .suffix_6,
+    .suffix_7,
+    .suffix_8,
+    .suffix_9,
+    .suffix_10,
+    .suffix_11 {
+      padding-right: 0
+    }
+
+    .push_1,
+    .push_2,
+    .push_3,
+    .push_4,
+    .push_5,
+    .push_6,
+    .push_7,
+    .push_8,
+    .push_9,
+    .push_10,
+    .push_11,
+    .pull_1,
+    .pull_2,
+    .pull_3,
+    .pull_4,
+    .pull_5,
+    .pull_6,
+    .pull_7,
+    .pull_8,
+    .pull_9,
+    .pull_10,
+    .pull_11 {
+      left: 0
+    }
+  }
+}
+// Mobile Landscape Width to Tablet Portrait Width
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+
+  body { min-width: 480px; }
+
+  .row {
+    width: 420px;
+
+    .grid_1,
+    .grid_2,
+    .grid_3,
+    .grid_4,
+    .grid_5,
+    .grid_6,
+    .grid_7,
+    .grid_8,
+    .grid_9,
+    .grid_10,
+    .grid_11,
+    .grid_12 {
+      margin: 0;
+      width: 420px;
+    }
+  }
+}

data/sass/header.scss

@@ -0,0 +1,33 @@
+#header {
+  background-color: $headerBackground;
+  color: $headerColor;
+  height: $headerHeight;
+  line-height: $lineHeight;
+  max-height: $headerHeight;
+  overflow: hidden;
+  width: 100%;
+
+  h1, h2, h3, h4, h5, h6 {
+    color: $headerColor;
+    line-height: 1em;
+    padding-top: ($headerHeight - $baseFontSize) / 2.5;
+  }
+
+  a {
+    color: $headerColor;
+    font-size: $baseFontSize;
+    font-weight: bold;
+  }
+
+  ul {
+    list-style-type: none;
+    padding-top: ($headerHeight - $baseFontSize) / 2.5;
+    li {
+      display: block;
+      float: left;
+      margin-right: $lineHeight;
+    }
+    &:last-child { margin-right: 0; }
+  }
+
+}

data/sass/navs.scss

@@ -0,0 +1,26 @@
+.nav-pills {
+  list-style-type: none;
+
+  li {
+    display: block;
+    height: 32px;
+    float: left;
+    overflow: hidden;
+    margin-bottom: 1.5em;
+    margin-right: 15px;
+    @include border-radius(2px);
+
+    a {
+      color: $baseColor;
+      display: block;
+      padding: 5px 12px;
+    }
+
+    &.active {
+      background: $headerBackground;
+      font-weight: bold;
+      a { color: white; }
+    }
+
+  }
+}

data/sass/panels.scss

@@ -0,0 +1,10 @@
+.panel {
+  background: $panelBackground;
+  border: $panelBorder;
+  margin: {
+    bottom: 2em;
+    top: 2em;
+  }
+  padding: 8px 12px;
+  @include border-radius(2px);
+}

data/sass/reset.scss

@@ -0,0 +1,48 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain) */
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+  display: block
+}
+
+body { line-height: 1; }
+
+ol, ul { list-style: none; }
+
+blockquote, q { quotes: none; }
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+  content: '';
+  content: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+a { text-decoration: none; }

data/sass/tables.scss

@@ -0,0 +1,23 @@
+table {
+  background: transparent;
+  border-collapse: collapse;
+  line-height: 2em;
+  margin-bottom: 2em;
+  width: 100%;
+
+  thead {
+    display: table-header-group;
+  }
+
+  th {
+    border-bottom: 1px solid $lightGray;
+    font-weight: bold;
+    padding-bottom: 3px;
+    text-align: left;
+  }
+
+  td {
+    border-bottom: 1px solid $lightGray;
+    padding: 5px;
+  }
+}

data/sass/tags.scss

@@ -0,0 +1,19 @@
+.label, .tag {
+  @include label($lightGray, $darkGray);
+}
+
+.label.blue, .label-blue, .tag.blue, .tag-blue {
+  @include label($blue, $white);
+}
+
+.label.green, .label-green, .tag.green, .tag-green {
+  @include label($green, $white);
+}
+
+.label.brown, .label-brown, .tag.brown, .tag-brown {
+  @include label($brown, $white);
+}
+
+.label.red, .label-red, .tag.red, .tag-red {
+  @include label($red, $white);
+}

data/sass/typography.scss

@@ -0,0 +1,54 @@
+body {
+  color: $baseColor;
+  font-family: $baseFontFamily;
+  font-size: $baseFontSize;
+  line-height: $lineHeight;
+}
+
+p { line-height: $lineHeight; }
+
+
+h1, h2, h3, h4, h5, h6 {
+  color: $baseColor;
+  font-weight: bold;
+  line-height: $lineHeight;
+}
+
+h1, h2, h3 {
+  line-height: 2em;
+}
+
+h1 { font-size: 2.25em; }
+h2 { font-size: 2em; }
+h3 { font-size: 1.75em; }
+h4 { font-size: 1.5em; }
+h5 { font-size: 1.25em; }
+h6 {
+  font-size: 1.115em;
+  font-weight: bold;
+}
+
+
+p + ul {
+  margin-top: $lineHeight / 2;
+}
+
+ul { list-style-type: disc; }
+ol { list-style-type: decimal; }
+
+ul, ol { padding-left: 2em; }
+
+ul ul, ol ul {
+  margin-top: 0;
+  margin-bottom: 0;
+  list-style-type: circle;
+}
+
+ul ol { list-style-type: decimal; }
+ol ol { list-style-type: lower-alpha; }
+
+footer {
+  margin: $lineHeight auto;
+  line-height: $lineHeight;
+  text-align: center;
+}

metadata

@@ -0,0 +1,113 @@
+--- !ruby/object:Gem::Specification
+name: bear-sass
+version: !ruby/object:Gem::Version
+  version: '1.0'
+platform: ruby
+authors:
+- Robin Dupret
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2013-05-19 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: 3.2.9
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: 3.2.9
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '1.3'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ~>
+      - !ruby/object:Gem::Version
+        version: '1.3'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+description: Bear is a very tiny Sass kit
+email:
+- robin.dupret@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- README.md
+- Rakefile
+- bear-sass.gemspec
+- css/bear.css
+- lib/bear-sass.rb
+- lib/bear/engine.rb
+- lib/bear/generators/USAGE
+- lib/bear/generators/layout_generator.rb
+- lib/bear/generators/templates/layout.html.erb
+- lib/bear/generators/templates/layout.html.slim
+- lib/bear/version.rb
+- sass/_mixins.scss
+- sass/_variables.scss
+- sass/alerts.scss
+- sass/bear.scss
+- sass/buttons.scss
+- sass/forms.scss
+- sass/grid.scss
+- sass/header.scss
+- sass/navs.scss
+- sass/panels.scss
+- sass/reset.scss
+- sass/tables.scss
+- sass/tags.scss
+- sass/typography.scss
+homepage: https://robin850.github.io/bear
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.0.3
+signing_key: 
+specification_version: 4
+summary: The Bear Sass kit
+test_files: []