flutie 1.1.8 → 1.2.2

data/README.md

@@ -10,13 +10,13 @@ Flutie is a Rails engine. It works with versions of Rails greater than 3.0.
 
 Flutie is recommended to be run as a gem and included in your Gemfile:
 
-    gem "flutie", "~> 1.1"
+    gem "flutie"
 
 After you've bundled, run the installer:
 
     rake flutie:install
 
-The installer will copy the Flutie stylesheets into public/flutie/stylesheets
+The installer will copy the Flutie stylesheets sass into public/stylesheets/sass/flutie, and a static flutie.css into public/stylesheets/ in your app.
 
 Once Flutie is installed, with your application running (not in production environment) you can browse to /styleguides.  This will present you with many standard markup elements that are present in a Rails application, in your default application layout.
 
@@ -35,12 +35,16 @@ bc. <%= stylesheet_link_tag :flutie, 'admin', :cache => true %>
 
 ### Sass
 
-If you use Sass in your application, the flutie stylesheets are also available as scss files, installed in public/flutie/sass.  This location is automatically added to your Sass template load path.  These files can be imported into your own sass files for use with the following:
+If you use Sass in your application, the flutie stylesheets are also available as scss files, installed in public/stylesheets/sass/flutie.  These files can be imported into your own sass files for use with the following:
 
-    @import "flutie";
+    @import "flutie/flutie";
 
 You'll want to import flutie before any of your own styles so that you can do things like extend your classes with flutie classes.
 
+We have a [Sass-Mixins repository](https://github.com/thoughtbot/sass-mixins) available, which extends flutie with sass mixins.
+
+You should either add that repository as a git submodule in your project, or find some other way to copy the files into sass's load path.
+
 ### Custom Styles
 
 To add custom styles to the styleguide add partials to the app/views/styleguides directory. For example:
@@ -51,9 +55,7 @@ To add custom styles to the styleguide add partials to the app/views/styleguides
       <li class="todo">This is a todo item</li>
     </ol>
 
-Plugin authors can also add to the styleguide by ensuring that their view path
-is in ActionController::Base.view_paths and by placing a partial under the
-styleguides directory. For example:
+Plugin authors can also add to the styleguide by ensuring that their view path is in ActionController::Base.view_paths and by placing a partial under the styleguides directory. For example:
 
     ActionController::Base.append_view_path(File.join(File.dirname(__FILE__), 'views'))
 
@@ -72,10 +74,10 @@ Fork away and create a "Github Issue":http://github.com/thoughtbot/flutie/issues
 Development
 -----------
 
-The actual stylesheet source files are sass, so edit the files in public/stylesheets/sass.
+The actual stylesheet source files are sass, so edit the files in public/stylesheets/sass/flutie.
 To rebuild the normal scss run:
 
-    sass -C --update public/stylesheets/sass:public/stylesheets
+    sass -C --update public/stylesheets/sass/flutie:public/stylesheets
 
 You can run a server which will allow you to view the flutie styleguide locally:
 

data/app/views/flutie/styleguides/show.erb

@@ -1,12 +1,4 @@
 <div>
-  <div style="padding: 15px; text-align: right;">
-    <% if params[:flutie] %>
-      <a href="?flutie=false">Application Styles</a>
-    <% else %>
-      <a href="?flutie=true">Default Styles</a>
-    <% end %>
-  </div>
-
   <h1>This is an example page of our basic styles</h1>
   <h2>This is an h2 level heading</h2>
 
@@ -16,14 +8,12 @@
 
   <blockquote>
     <p>Blockquoted text.  Not too long ago, two friends of mine were talking to a Cuban refugee, a businessman who had escaped from Castro, and in the midst of his story one of my friends turned to the other and said, "We don't know how lucky we are." And the Cuban stopped and said, "How lucky you are? I had someplace to escape to." And in that sentence he told us the entire story. If we lose freedom here, there's no place to escape to. This is the last stand on earth.</p>
-  </blockquote>    
+  </blockquote>
 
   <h3>This is an h3 level heading</h3>
   <p>Senator Humphrey last week charged that Barry Goldwater, as President, would seek to eliminate farmers. He should do his homework a little better, because he'll find out that we've had a decline of 5 million in the farm population under these government programs. He'll also find that the Democratic administration has sought to get from Congress [an] extension of the farm program to include that three-fourths that is now free. He'll find that they've also asked for the right to imprison farmers who wouldn't keep books as prescribed by the federal government. The Secretary of Agriculture asked for the right to seize farms through condemnation and resell them to other individuals. And contained in that same program was a provision that would have allowed the federal government to remove 2 million farmers from the soil.</p>
 
-  <br />
   <hr />
-  <br />
 
   <h1>This is an h1 heading</h1>
   <h2>This is an h2 heading</h2>
@@ -32,9 +22,7 @@
   <h5>This is an h5 heading</h5>
   <h6>This is an h6 heading</h6>
 
-  <br />
   <hr />
-  <br />
 
   <h1>This is an h1 heading. It's extremely long and will undoubtedly wrap on a line or two by the time it's completely and utterly finished in ultimate perpetuity.</h1>
   <p>And this is some text in a paragraph below it. Looks good. To understand what is really going on in a colony of ants or bees, Dr. Dornhaus, an assistant professor of ecology and evolutionary biology at the University of Arizona, tracks the little creatures individually — hence the paint and the numbers. Individual ants, she said, have “their own brains and legs, as well as complex and flexible behaviors.” She continues, “Each ant’s behavior and the rules under which it operates generate a pattern for the colony, so it’s crucial to discover its individual cognitive skill.”</p>
@@ -98,7 +86,7 @@
     <dt>definition list dt</dt>
     <dd>definition list dd one</dd>
     <dd>definition list dd two</dd>
-  </dl>			
+  </dl>
 
 
 
@@ -616,7 +604,7 @@
   </div>
   <div class="notice">
     This is a &lt;div&gt; with the class <strong>.notice</strong>.
-  </div>		
+  </div>
   <div class="success">
     This is a &lt;div&gt; with the class <strong>.success</strong>.
   </div>
@@ -724,10 +712,10 @@ end</code></pre>
 
   <tt>&lt;tt&gt;
     This tt text should be monospaced
-    and 
-    wrap as if 
+    and
+    wrap as if
     one line of text
-    even though the code has newlines, spaces, and tabs. 
+    even though the code has newlines, spaces, and tabs.
     It should be the same size as &lt;p&gt; text.
   </tt>
 

data/app/views/layouts/flutie.erb

@@ -1,28 +1,45 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!DOCTYPE html>
+<html lang="en">
   <head>
-    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta charset="utf-8" />
     <%= stylesheet_link_tag :flutie %>
     <title>Flutie v1</title>
 
     <style type="text/css">
-    /* These are styles to make the page look nice */
+    /* Styleguide-specific styles */
+    body {
+      background-color: #dadada;
+    }
+
+    .switcher {
+      margin: 30px auto 0;
+      text-align: right;
+      width: 880px;
+    }
 
-    body { background-color: #dadada;}
     .content {
       background: #fff;
+      -webkit-border-radius: 10px;
+      -moz-border-radius: 10px;
+      border-radius: 10px;
+      margin: 30px auto;
       padding: 40px;
-      margin: 40px auto;
       width: 880px;
-      -moz-border-radius: 24px;
-      -webkit-border-radius: 24px;
     }
     </style>
 
   </head>
 
   <body>
+
+    <div class="switcher">
+      <% if params[:flutie] %>
+        <a href="?flutie=false">Application Styles</a>
+      <% else %>
+        <a href="?flutie=true">Default Styles</a>
+      <% end %>
+    </div>
+
     <div class="content">
       <%= yield %>
     </div>

data/lib/tasks/flutie.rake

@@ -11,7 +11,7 @@ directory = File.dirname(__FILE__)
 namespace :flutie do
   desc 'install flutie stylesheets into public/ directory'
   task :install => :environment do
-    # Copy the flutie stylesheets into rails_root/public/flutie
-    copy_files("../../public/stylesheets", "/public/flutie", directory)
+    # Copy the flutie stylesheets into rails_root/public/stylesheets/sass
+    copy_files("../../public/stylesheets", "/public", directory)
   end
 end

data/public/stylesheets/flutie.css

@@ -1,7 +1,9 @@
 /*
-  html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
-  v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark
-  html5doctor.com/html-5-reset-stylesheet/
+html5doctor.com Reset Stylesheet
+v1.6.1
+Last Updated: 2010-09-17
+Author: Richard Clark - http://richclarkdesign.com
+Twitter: @rich_clark
 */
 html, body, div, span, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
@@ -23,6 +25,9 @@ time, mark, audio, video {
   vertical-align: baseline;
   background: transparent; }
 
+body {
+  line-height: 1; }
+
 article, aside, details, figcaption, figure,
 footer, header, hgroup, menu, nav, section {
   display: block; }
@@ -45,11 +50,13 @@ a {
   vertical-align: baseline;
   background: transparent; }
 
+/* change colours to suit your needs */
 ins {
   background-color: #ff9;
   color: #000;
   text-decoration: none; }
 
+/* change colours to suit your needs */
 mark {
   background-color: #ff9;
   color: #000;
@@ -60,30 +67,27 @@ del {
   text-decoration: line-through; }
 
 abbr[title], dfn[title] {
+  border-bottom: 1px dotted;
   cursor: help; }
 
-/* tables still need cellspacing="0" in the markup */
 table {
   border-collapse: collapse;
   border-spacing: 0; }
 
+/* change border colour to suit your needs */
 hr {
   display: block;
   height: 1px;
   border: 0;
-  border-top: 1px solid #ccc;
+  border-top: 1px solid #cccccc;
   margin: 1em 0;
   padding: 0; }
 
 input, select {
   vertical-align: middle; }
 
-/* this hack is courtesy of gbbowers on github
-   https://gist.github.com/601810 */
-/* Useful with form inputs and textareas */
-/* Legacy support for inline-block in IE7 (maybe IE6) */
 body {
-  color: #222;
+  color: #333;
   font-size: 13px;
   font-family: "helvetica neue", arial, helvetica, "lucida grande", sans-serif; }
 
@@ -94,11 +98,12 @@ h1, h2, h3, h4, h5, h6 {
 /* Success, error & notice boxes for messages and errors. */
 div.error, div.notice, div.success,
 #flash_failure, #flash_success, #flash_notice {
+  border: 1px solid #ddd;
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
-  border: 1px solid #ddd;
-  margin-bottom: 1em;
-  padding: 0.8em; }
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 10px; }
 
 div.error,
 #flash_failure {
@@ -134,8 +139,8 @@ div.success a,
 /* Use a .box to create a padded box inside a column.  */
 .box {
   background: #eee;
-  margin-bottom: 1.5em;
-  padding: 1.5em; }
+  margin-bottom: 16px;
+  padding: 16px; }
 
 /* Use this to create a horizontal ruler across a column. */
 hr {
@@ -145,7 +150,7 @@ hr {
   color: #ddd;
   float: none;
   height: 1px;
-  margin: 0 0 1.4em;
+  margin: 0 0 12px;
   width: 100%; }
 
 hr.space {
@@ -159,7 +164,7 @@ hr.space {
   display: block;
   overflow: hidden;
   text-align: left;
-  text-indent: -999em; }
+  text-indent: -9999px; }
 
 /* Hide for both screenreaders and browsers
    css-discuss.incutio.com/wiki/Screenreader_Visibility */
@@ -237,57 +242,49 @@ hr.space {
 
   h2, h3 {
     page-break-after: avoid; } }
-
 /* Headings */
 h1, h2, h3, h4, h5, h6 {
   font-weight: bold; }
 
 h1 {
-  font-size: 2.2em;
-  line-height: 1;
-  margin-bottom: 0.25em; }
+  font-size: 28px;
+  line-height: 1.2;
+  margin-bottom: 12px; }
 
 h2 {
-  font-size: 1.6em;
-  line-height: 1.1;
-  margin-bottom: 0.25em; }
+  font-size: 24px;
+  line-height: 1.2;
+  margin-bottom: 6px; }
 
 h3 {
-  font-size: 1.3em;
-  line-height: 1;
-  margin-bottom: 0.25em; }
+  font-size: 18px;
+  line-height: 1.2;
+  margin-bottom: 4px; }
 
 h4 {
-  font-size: 1.1em;
-  line-height: 1.25;
-  margin-bottom: 0.25em; }
+  font-size: 16px;
+  line-height: 1.3;
+  margin-bottom: 4px; }
 
 h5 {
-  font-size: 1em;
-  margin-bottom: 0.25em; }
+  font-size: 14px;
+  margin-bottom: 4px; }
 
 h6 {
-  font-size: 1em;
-  margin-bottom: 0.25em; }
+  font-size: 12px;
+  margin-bottom: 4px; }
 
 /* Text elements */
 p {
-  margin-bottom: 0.5em; }
-
-p.last {
-  margin-bottom: 0; }
-
-p img {
-  float: left;
-  margin: 1.5em 1.5em 1.5em 0;
-  padding: 0; }
+  line-height: 1.4;
+  margin-bottom: 12px; }
 
 /* Use this if the image is at the top of the <p>. */
 p img.top {
   margin-top: 0; }
 
 img {
-  margin: 0 0 1.5em; }
+  margin: 0 0 12px; }
 
 abbr, acronym {
   border-bottom: 1px dotted #666;
@@ -295,7 +292,7 @@ abbr, acronym {
 
 address {
   font-style: italic;
-  margin-top: 1.5em; }
+  margin-top: 16px; }
 
 del {
   color: #666; }
@@ -318,8 +315,8 @@ blockquote {
   border-left: 4px solid #d1d1d1;
   color: #666;
   font-style: italic;
-  margin: 1.5em 0;
-  padding-left: 1em; }
+  margin: 16px 0;
+  padding-left: 12px; }
 
 strong {
   font-weight: bold; }
@@ -332,7 +329,7 @@ dfn {
   font-weight: bold; }
 
 pre, code {
-  margin: 1.5em 0;
+  margin: 12px 0;
   white-space: pre;
   /* CSS2 */
   white-space: pre-wrap;
@@ -341,7 +338,7 @@ pre, code {
   /* IE */ }
 
 pre, code, tt {
-  font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace;
+  font: 12px 'andale mono', 'monotype.com', 'lucida console', monospace;
   line-height: 1.5; }
 
 pre.code {
@@ -352,28 +349,32 @@ pre.code {
 tt {
   display: block;
   line-height: 1.5;
-  margin: 1.5em 0; }
+  margin: 16px 0; }
 
 /* Forms */
-/*removes dotted outline on submit buttons when clicking in firefox */
+/*
+ * Remove inner padding and border in FF3/4
+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
+ */
 input[type="submit"]::-moz-focus-inner {
-  border: none; }
+  border: 0;
+  padding: 0; }
 
 form ol {
   list-style: none;
-  margin: 0 0 1em 0; }
+  margin: 0 0 12px 0; }
 
 form ol ol {
   margin-left: 0; }
 
 form ol li {
   list-style-position: outside;
-  margin: 0 0 1em 0; }
+  margin: 0 0 12px 0; }
 
 /*list-style-position fixes IE label margin bug*/
 form ol ol li {
   list-style-position: outside;
-  margin: 0 0 .25em 0; }
+  margin: 0 0 4px 0; }
 
 form ol li.error input {
   background: #FBE3E4; }
@@ -404,15 +405,15 @@ a.cancel {
 
 .inline-hints {
   color: #666;
-  font-size: 0.8em;
-  margin-bottom: 0.25em; }
+  font-size: 11px;
+  margin-bottom: 4px; }
 
 /* Fieldsets */
 fieldset {
   background: #f1f1f1;
   border: 1px solid #e3e3e3;
-  margin: 0 0 1.5em 0;
-  padding: 1.5em 1.5em 1em 1.5em; }
+  margin: 0 0 16px 0;
+  padding: 16px 16px 12px 16px; }
 
 fieldset fieldset,
 fieldset fieldset fieldset {
@@ -491,7 +492,7 @@ input[type="radio"] {
 textarea {
   font-size: inherit;
   height: 200px;
-  margin: 0 0.5em 0.5em 0;
+  margin: 0 6px 6px 0;
   padding: 5px;
   width: 440px;
   overflow: auto; }
@@ -499,32 +500,26 @@ textarea {
 /* Select fields */
 fieldset .select select {
   width: 200px;
-  font-size: 0.9em; }
+  font-size: 11px; }
 
 optgroup {
-  margin: 0 0 .5em 0; }
+  margin: 0 0 6px 0; }
 
 /* Date & Time */
-form ol li.date ol li,
-form ol li.time ol li {
-  display: inline; }
-
-form ol li.datetime ol li {
-  display: inline-block; }
-
-form ol li.datetime select,
 form ol li.date select,
-form ol li.time select {
+form ol li.time select,
+form ol li.datetime select {
   display: inline;
   width: auto; }
 
-form ol li.date label,
-form ol li.time label {
-  display: none; }
+form ol li.date ol li,
+form ol li.time ol li,
+form ol li.datetime ol li {
+  display: inline-block; }
 
 /* Tables */
 table {
-  margin-bottom: 2em;
+  margin-bottom: 24px;
   width: 100%; }
 
 th {
@@ -540,7 +535,7 @@ caption, th, td {
 
 caption {
   background: #f1f1f1;
-  margin-bottom: 1em;
+  margin-bottom: 12px;
   padding: 10px 0; }
 
 tr, td, th {
@@ -553,7 +548,7 @@ table .last {
 /* Lists */
 ul, ol {
   list-style-position: inside;
-  margin-bottom: 1.5em; }
+  margin-bottom: 16px; }
 
 ul {
   list-style-type: disc; }
@@ -563,20 +558,20 @@ ol {
 
 dl {
   line-height: 1.4;
-  margin-bottom: 1.5em; }
+  margin-bottom: 16px; }
 
 dl dt {
   font-weight: bold;
-  margin-top: 0.5em; }
+  margin-top: 6px; }
 
 dl dd {
   margin-bottom: 0em; }
 
 dd {
-  margin-left: 0.5em; }
+  margin-left: 6px; }
 
 li {
   line-height: 1.4; }
 
 ol ol, ol ul, ul ul, ul ol {
-  margin-left: 1em; }
+  margin-left: 12px; }

data/public/stylesheets/sass/{_defaults.scss → flutie/_defaults.scss}

@@ -1,5 +1,5 @@
 body {
-  color: #222;
+  color: #333;
   font-size: 13px;
   font-family: "helvetica neue", arial, helvetica, "lucida grande", sans-serif;
 }
@@ -12,11 +12,12 @@ h1, h2, h3, h4, h5, h6 {
 /* Success, error & notice boxes for messages and errors. */
 div.error, div.notice, div.success,
 #flash_failure, #flash_success, #flash_notice {
+  border: 1px solid #ddd;
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
-  border: 1px solid #ddd;
-  margin-bottom: 1em;
-  padding: 0.8em;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 10px;
 }
 
 div.error,
@@ -59,8 +60,8 @@ div.success a,
 /* Use a .box to create a padded box inside a column.  */
 .box {
   background: #eee;
-  margin-bottom: 1.5em;
-  padding: 1.5em;
+  margin-bottom: 16px;
+  padding: 16px;
 }
 
 /* Use this to create a horizontal ruler across a column. */
@@ -71,7 +72,7 @@ hr {
   color: #ddd;
   float: none;
   height: 1px;
-  margin: 0 0 1.4em;
+  margin: 0 0 12px;
   width: 100%;
 }
 
@@ -87,7 +88,7 @@ hr.space {
   display: block;
   overflow: hidden;
   text-align: left;
-  text-indent: -999em;
+  text-indent: -9999px;
 }
 
 /* Hide for both screenreaders and browsers

data/public/stylesheets/sass/{_forms.scss → flutie/_forms.scss}

@@ -1,13 +1,17 @@
 /* Forms */
 
-/*removes dotted outline on submit buttons when clicking in firefox */
+/*
+ * Remove inner padding and border in FF3/4
+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
+ */
 input[type="submit"]::-moz-focus-inner {
-  border: none;
+  border: 0;
+  padding: 0;
 }
 
 form ol {
   list-style: none;
-  margin: 0 0 1em 0;
+  margin: 0 0 12px 0;
 }
 
 form ol ol {
@@ -16,13 +20,13 @@ form ol ol {
 
 form ol li {
   list-style-position: outside;
-  margin: 0 0 1em 0;
+  margin: 0 0 12px 0;
 }
 
 /*list-style-position fixes IE label margin bug*/
 form ol ol li {
   list-style-position: outside;
-  margin: 0 0 .25em 0;
+  margin: 0 0 4px 0;
 }
 
 form ol li.error input {
@@ -62,16 +66,16 @@ a.cancel {
 
 .inline-hints {
   color: #666;
-  font-size: 0.8em;
-  margin-bottom: 0.25em;
+  font-size: 11px;
+  margin-bottom: 4px;
 }
 
 /* Fieldsets */
 fieldset {
   background: #f1f1f1;
   border: 1px solid #e3e3e3;
-  margin: 0 0 1.5em 0;
-  padding: 1.5em 1.5em 1em 1.5em;
+  margin: 0 0 16px 0;
+  padding: 16px 16px 12px 16px;
 }
 
 fieldset fieldset,
@@ -160,7 +164,7 @@ input[type="radio"] {
 textarea {
   font-size: inherit;
   height: 200px;
-  margin: 0 0.5em 0.5em 0;
+  margin: 0 6px 6px 0;
   padding: 5px;
   width: 440px;
   overflow: auto;
@@ -169,31 +173,23 @@ textarea {
 /* Select fields */
 fieldset .select select {
   width: 200px;
-  font-size: 0.9em;
+  font-size: 11px;
 }
 
 optgroup {
-  margin: 0 0 .5em 0;
+  margin: 0 0 6px 0;
 }
 
 /* Date & Time */
-form ol li.date ol li,
-form ol li.time ol li {
-  display: inline;
-}
-
-form ol li.datetime ol li {
-  display: inline-block;
-}
-
-form ol li.datetime select,
 form ol li.date select,
-form ol li.time select {
+form ol li.time select,
+form ol li.datetime select {
   display: inline;
   width: auto;
 }
 
-form ol li.date label,
-form ol li.time label {
-  display: none;
+form ol li.date ol li,
+form ol li.time ol li,
+form ol li.datetime ol li {
+  display: inline-block;
 }

data/public/stylesheets/sass/{_lists.scss → flutie/_lists.scss}

@@ -2,7 +2,7 @@
 
 ul, ol {
   list-style-position: inside;
-  margin-bottom:  1.5em;
+  margin-bottom:  16px;
 }
 
 ul {
@@ -15,12 +15,12 @@ ol {
 
 dl {
   line-height: 1.4;
-  margin-bottom: 1.5em;
+  margin-bottom: 16px;
 }
 
 dl dt {
   font-weight: bold;
-  margin-top: 0.5em;
+  margin-top: 6px;
 }
 
 dl dd {
@@ -28,7 +28,7 @@ dl dd {
 }
 
 dd {
-  margin-left: 0.5em;
+  margin-left: 6px;
 }
 
 li {
@@ -36,5 +36,5 @@ li {
 }
 
 ol ol, ol ul, ul ul, ul ol {
-  margin-left: 1em;
+  margin-left: 12px;
 }

data/public/stylesheets/sass/flutie/_reset.scss

@@ -0,0 +1,102 @@
+/*
+html5doctor.com Reset Stylesheet
+v1.6.1
+Last Updated: 2010-09-17
+Author: Richard Clark - http://richclarkdesign.com
+Twitter: @rich_clark
+*/
+
+html, body, div, span, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+abbr, address, cite, code,
+del, dfn, em, img, ins, kbd, q, samp,
+small, strong, sub, sup, var,
+b, i,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section, summary,
+time, mark, audio, video {
+  margin:0;
+  padding:0;
+  border:0;
+  outline:0;
+  font-size:100%;
+  vertical-align:baseline;
+  background:transparent;
+}
+
+body {
+  line-height:1;
+}
+
+article,aside,details,figcaption,figure,
+footer,header,hgroup,menu,nav,section {
+  display:block;
+}
+
+nav ul {
+  list-style:none;
+}
+
+blockquote, q {
+  quotes:none;
+}
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+  content:'';
+  content:none;
+}
+
+a {
+  margin:0;
+  padding:0;
+  font-size:100%;
+  vertical-align:baseline;
+  background:transparent;
+}
+
+/* change colours to suit your needs */
+ins {
+  background-color:#ff9;
+  color:#000;
+  text-decoration:none;
+}
+
+/* change colours to suit your needs */
+mark {
+  background-color:#ff9;
+  color:#000;
+  font-style:italic;
+  font-weight:bold;
+}
+
+del {
+  text-decoration: line-through;
+}
+
+abbr[title], dfn[title] {
+  border-bottom:1px dotted;
+  cursor:help;
+}
+
+table {
+  border-collapse:collapse;
+  border-spacing:0;
+}
+
+/* change border colour to suit your needs */
+hr {
+  display:block;
+  height:1px;
+  border:0;
+  border-top:1px solid #cccccc;
+  margin:1em 0;
+  padding:0;
+}
+
+input, select {
+  vertical-align: middle;
+}

data/public/stylesheets/sass/{_tables.scss → flutie/_tables.scss}

@@ -1,7 +1,7 @@
 /* Tables */
 
 table {
-  margin-bottom: 2em;
+  margin-bottom: 24px;
   width: 100%;
 }
 
@@ -21,7 +21,7 @@ caption, th, td {
 
 caption {
   background: #f1f1f1;
-  margin-bottom: 1em;
+  margin-bottom: 12px;
   padding: 10px 0;
 }
 

data/public/stylesheets/sass/{_type.scss → flutie/_type.scss}

@@ -4,52 +4,43 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 h1 {
-  font-size: 2.2em;
-  line-height: 1;
-  margin-bottom: 0.25em;
+  font-size: 28px;
+  line-height: 1.2;
+  margin-bottom: 12px;
 }
 
 h2 {
-  font-size: 1.6em;
-  line-height: 1.1;
-  margin-bottom: 0.25em;
+  font-size: 24px;
+  line-height: 1.2;
+  margin-bottom: 6px;
 }
 
 h3 {
-  font-size: 1.3em;
-  line-height: 1;
-  margin-bottom: 0.25em;
+  font-size: 18px;
+  line-height: 1.2;
+  margin-bottom: 4px;
 }
 
 h4 {
-  font-size: 1.1em;
-  line-height: 1.25;
-  margin-bottom: 0.25em;
+  font-size: 16px;
+  line-height: 1.3;
+  margin-bottom: 4px;
 }
 
 h5 {
-  font-size: 1em;
-  margin-bottom: 0.25em;
+  font-size: 14px;
+  margin-bottom: 4px;
 }
 
 h6 {
-  font-size: 1em;
-  margin-bottom: 0.25em;
+  font-size: 12px;
+  margin-bottom: 4px;
 }
 
 /* Text elements */
 p {
-  margin-bottom: 0.5em;
-}
-
-p.last {
-  margin-bottom: 0;
-}
-
-p img {
-  float: left;
-  margin: 1.5em 1.5em 1.5em 0;
-  padding: 0;
+  line-height: 1.4;
+  margin-bottom: 12px;
 }
 
 /* Use this if the image is at the top of the <p>. */
@@ -58,7 +49,7 @@ p img.top {
 }
 
 img {
-  margin: 0 0 1.5em;
+  margin: 0 0 12px;
 }
 
 abbr, acronym {
@@ -68,7 +59,7 @@ abbr, acronym {
 
 address {
   font-style: italic;
-  margin-top: 1.5em;
+  margin-top: 16px;
 }
 
 del {
@@ -97,8 +88,8 @@ blockquote {
   border-left: 4px solid #d1d1d1;
   color: #666;
   font-style: italic;
-  margin: 1.5em 0;
-  padding-left: 1em;
+  margin: 16px 0;
+  padding-left: 12px;
 }
 
 strong {
@@ -115,14 +106,14 @@ dfn {
 }
 
 pre, code {
-  margin: 1.5em 0;
+  margin: 12px 0;
   white-space: pre; /* CSS2 */
   white-space: pre-wrap; /* CSS 2.1 */
   word-wrap: break-word; /* IE */
 }
 
 pre, code, tt {
-  font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace;
+  font: 12px 'andale mono', 'monotype.com', 'lucida console', monospace;
   line-height: 1.5;
 }
 
@@ -135,5 +126,5 @@ pre.code {
 tt {
   display: block;
   line-height: 1.5;
-  margin: 1.5em 0;
+  margin: 16px 0;
 }

data/public/stylesheets/sass/flutie/flutie.scss

@@ -0,0 +1,10 @@
+// Optional import of sass mixins. See read me for instructions.
+// @import 'sass-mixins/mixins';
+@import 'reset';
+@import 'defaults';
+@import 'type';
+@import 'forms';
+@import 'tables';
+@import 'lists';
+@import 'screen';
+

metadata

@@ -1,13 +1,8 @@
 --- !ruby/object:Gem::Specification 
 name: flutie
 version: !ruby/object:Gem::Version 
-  hash: 3
-  prerelease: false
-  segments: 
-  - 1
-  - 1
-  - 8
-  version: 1.1.8
+  prerelease: 
+  version: 1.2.2
 platform: ruby
 authors: 
 - Chad Pytel
@@ -19,23 +14,31 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2010-12-01 00:00:00 -05:00
+date: 2010-06-29 00:00:00 -04:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
-  name: haml
+  name: sass
   prerelease: false
   requirement: &id001 !ruby/object:Gem::Requirement 
     none: false
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
-        segments: 
-        - 0
         version: "0"
   type: :development
   version_requirements: *id001
+- !ruby/object:Gem::Dependency 
+  name: rails
+  prerelease: false
+  requirement: &id002 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - "="
+      - !ruby/object:Gem::Version 
+        version: 3.0.8
+  type: :development
+  version_requirements: *id002
 description: Flutie is a starting point for personal discovery
 email: support@thoughtbot.com
 executables: []
@@ -51,26 +54,19 @@ files:
 - app/views/flutie/styleguides/show.erb
 - app/views/layouts/flutie.erb
 - config/initializers/expansion.rb
-- config/initializers/sass.rb
 - config/routes.rb
 - lib/flutie/engine.rb
 - lib/flutie.rb
 - lib/tasks/flutie.rake
 - public/stylesheets/flutie.css
-- public/stylesheets/sass/_border-radius.scss
-- public/stylesheets/sass/_box-shadow.scss
-- public/stylesheets/sass/_box-sizing.scss
-- public/stylesheets/sass/_defaults.scss
-- public/stylesheets/sass/_forms.scss
-- public/stylesheets/sass/_inline-block.scss
-- public/stylesheets/sass/_linear-gradient.scss
-- public/stylesheets/sass/_lists.scss
-- public/stylesheets/sass/_reset.scss
-- public/stylesheets/sass/_screen.scss
-- public/stylesheets/sass/_tables.scss
-- public/stylesheets/sass/_transition.scss
-- public/stylesheets/sass/_type.scss
-- public/stylesheets/sass/flutie.scss
+- public/stylesheets/sass/flutie/_defaults.scss
+- public/stylesheets/sass/flutie/_forms.scss
+- public/stylesheets/sass/flutie/_lists.scss
+- public/stylesheets/sass/flutie/_reset.scss
+- public/stylesheets/sass/flutie/_screen.scss
+- public/stylesheets/sass/flutie/_tables.scss
+- public/stylesheets/sass/flutie/_type.scss
+- public/stylesheets/sass/flutie/flutie.scss
 has_rdoc: true
 homepage: http://github.com/thoughtbot/flutie
 licenses: []
@@ -85,23 +81,17 @@ required_ruby_version: !ruby/object:Gem::Requirement
   requirements: 
   - - ">="
     - !ruby/object:Gem::Version 
-      hash: 3
-      segments: 
-      - 0
       version: "0"
 required_rubygems_version: !ruby/object:Gem::Requirement 
   none: false
   requirements: 
   - - ">="
     - !ruby/object:Gem::Version 
-      hash: 3
-      segments: 
-      - 0
       version: "0"
 requirements: []
 
 rubyforge_project: 
-rubygems_version: 1.3.7
+rubygems_version: 1.6.2
 signing_key: 
 specification_version: 3
 summary: Flutie adds default stylesheets to web apps

data/config/initializers/sass.rb

@@ -1,3 +0,0 @@
-if defined?(Sass::Plugin) && defined?(Rails)
-  Sass::Plugin.add_template_location(Rails.root.join('public', 'flutie', 'stylesheets', 'sass').to_s)
-end

data/public/stylesheets/sass/_border-radius.scss

@@ -1,5 +0,0 @@
-@mixin border-radius ($radii) {
-  -moz-border-radius: $radii;
-  -webkit-border-radius: $radii;
-  border-radius: $radii;
-}

data/public/stylesheets/sass/_box-shadow.scss

@@ -1,35 +0,0 @@
-/* this hack is courtesy of gbbowers on github
-   https://gist.github.com/601810 */
-@mixin box-shadow ($shadow-1, $shadow-2: false, $shadow-3: false, $shadow-4: false, $shadow-5: false, $shadow-6: false, $shadow-7: false, $shadow-8: false, $shadow-9: false) {
-  $full: $shadow-1;
-
-  @if $shadow-2 {
-    $full: $full + ", " + $shadow-2;
-  }
-  @if $shadow-3 {
-    $full: $full + ", " + $shadow-3;
-  }
-  @if $shadow-4 {
-    $full: $full + ", " + $shadow-4;
-  }
-  @if $shadow-5 {
-    $full: $full + ", " + $shadow-5;
-  }
-  @if $shadow-6 {
-    $full: $full + ", " + $shadow-6;
-  }
-  @if $shadow-7 {
-    $full: $full + ", " + $shadow-7;
-  }
-  @if $shadow-8 {
-    $full: $full + ", " + $shadow-8;
-  }
-  @if $shadow-9 {
-    $full: $full + ", " + $shadow-9;
-  }
-
-  -moz-box-shadow: $full;
-  -webkit-box-shadow: $full;
-  -o-box-shadow: $full;
-  box-shadow: $full;
-}

data/public/stylesheets/sass/_box-sizing.scss

@@ -1,7 +0,0 @@
-/* Useful with form inputs and textareas */
-@mixin box-sizing ($box) {
-  -webkit-box-sizing: $box; 
-  -moz-box-sizing: $box; 
-  box-sizing: $box; // border-box, content-box, padding-box (moz), margin-box (moz)
-}
-

data/public/stylesheets/sass/_inline-block.scss

@@ -1,10 +0,0 @@
-/* Legacy support for inline-block in IE7 (maybe IE6) */
-@mixin inline-block {
-  display: -moz-inline-box; 
-  -moz-box-orient: vertical; 
-  display: inline-block; 
-  vertical-align: baseline;
-  zoom: 1; 
-  *display: inline; 
-  *vertical-align: auto;
-}

data/public/stylesheets/sass/_linear-gradient.scss

@@ -1,5 +0,0 @@
-@mixin linear-gradient ($from, $to) {
-  background: $from;
-  background: -moz-linear-gradient(top, $from, $to);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, $from), color-stop(1, $to));
-}

data/public/stylesheets/sass/_reset.scss

@@ -1,54 +0,0 @@
-/*
-  html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
-  v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark
-  html5doctor.com/html-5-reset-stylesheet/
-*/
-html, body, div, span, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-abbr, address, cite, code,
-del, dfn, em, img, ins, kbd, q, samp,
-small, strong, sub, sup, var,
-b, i,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section, summary,
-time, mark, audio, video {
-  margin:0;
-  padding:0;
-  border:0;
-  outline:0;
-  font-size:100%;
-  vertical-align:baseline;
-  background:transparent;
-}
-
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-  display:block;
-}
-
-nav ul { list-style:none; }
-
-blockquote, q { quotes:none; }
-
-blockquote:before, blockquote:after,
-q:before, q:after { content:''; content:none; }
-
-a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
-
-ins { background-color:#ff9; color:#000; text-decoration:none; }
-
-mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
-
-del { text-decoration: line-through; }
-
-abbr[title], dfn[title] { cursor:help; }
-
-/* tables still need cellspacing="0" in the markup */
-table { border-collapse:collapse; border-spacing:0; }
-
-hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
-
-input, select { vertical-align:middle; }

data/public/stylesheets/sass/_transition.scss

@@ -1,6 +0,0 @@
-@mixin transition($property: all, $ratio: 0.15s, $ease: ease-out) {
-  -webkit-transition: $property $ratio $ease; 
-  -moz-transition: $property $ratio $ease; 
-  -o-transition: $property $ratio $ease; 
-  transition: $property $ratio $ease;
-}

data/public/stylesheets/sass/flutie.scss

@@ -1,13 +0,0 @@
-@import 'reset';
-@import 'border-radius';
-@import 'box-shadow';
-@import 'box-sizing';
-@import 'inline-block';
-@import 'transition';
-@import 'linear-gradient';
-@import 'defaults';
-@import 'type';
-@import 'forms';
-@import 'tables';
-@import 'lists';
-@import 'screen';