Merge pull request #35 from ehmorris/master

Changed flutie pixel values to ems

app/assets/stylesheets/_defaults.scss

@@ -1,6 +1,6 @@
 body {
   color: #333;
-  font-size: 13px;
+  font-size: 100%;
   font-family: "helvetica neue", arial, helvetica, "lucida grande", sans-serif;
 }
 
@@ -14,8 +14,10 @@ h1, h2, h3, h4, h5, h6 {
 /* Use a .box to create a padded box inside a column.  */
 .box {
   background: #eee;
-  margin-bottom: 16px;
-  padding: 16px;
+  margin-bottom: 1em;
+  margin-bottom: 1rem;
+  padding: 1em;
+  padding: 1rem;
 }
 
 /* Use this to create a horizontal ruler across a column. */
@@ -26,7 +28,7 @@ hr {
   color: #ddd;
   float: none;
   height: 1px;
-  margin: 0 0 12px;
+  margin: 0 0 .75rem;
   width: 100%;
 }
 

app/assets/stylesheets/_flashes.scss

@@ -1,11 +1,13 @@
 /* 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-radius: 8px;
-  margin-bottom: 12px;
-  padding: 10px;
+  -moz-border-radius: .5rem;
+  -webkit-border-radius: .5rem;
+  border-radius: .5rem;
+  margin-bottom: .75em;
+  margin-bottom: .75rem;
+  padding: .75em;
+  padding: .75rem;
 }
 
 div.error, #flash_failure {

app/assets/stylesheets/_forms.scss

@@ -11,7 +11,8 @@ input[type="submit"]::-moz-focus-inner {
 
 form ol {
   list-style: none;
-  margin: 0 0 12px 0;
+  margin: 0 0 .75em 0;
+  margin: 0 0 .75rem 0;
 }
 
 form ol ol {
@@ -20,13 +21,15 @@ form ol ol {
 
 form ol li {
   list-style-position: outside;
-  margin: 0 0 12px 0;
+  margin: 0 0 .75em 0;
+  margin: 0 0 .75rem 0;
 }
 
 /*list-style-position fixes IE label margin bug*/
 form ol ol li {
   list-style-position: outside;
-  margin: 0 0 4px 0;
+  margin: 0 0 .25em 0;
+  margin: 0 0 .25rem 0;
 }
 
 form ol li.error input {
@@ -40,7 +43,8 @@ p.inline-errors {
 form ol li.file {
   background: #e1e1e1;
   border: 1px solid #c8c8c8;
-  padding: 10px;
+  padding: .75em;
+  padding: .75rem;
 }
 
 form abbr {
@@ -66,16 +70,20 @@ a.cancel {
 
 .inline-hints {
   color: #666;
-  font-size: 11px;
-  margin-bottom: 4px;
+  font-size: .75em;
+  font-size: .75rem;
+  margin-bottom: .25em;
+  margin-bottom: .25rem;
 }
 
 /* Fieldsets */
 fieldset {
   background: #f1f1f1;
   border: 1px solid #e3e3e3;
-  margin: 0 0 16px 0;
-  padding: 16px 16px 12px 16px;
+  margin: 0 0 1em 0;
+  margin: 0 0 1rem 0;
+  padding: 1rem 1rem .75em 1em;
+  padding: 1rem 1rem .75rem 1rem;
 }
 
 fieldset fieldset, fieldset fieldset fieldset {
@@ -86,7 +94,10 @@ fieldset fieldset, fieldset fieldset fieldset {
 legend {
   font-weight: bold;
 }
-.ie6 legend, .ie7 legend { margin-left: -7px; }
+.ie6 legend, .ie7 legend { 
+  margin-left: .5em; 
+  margin-left: .5rem; 
+}
 
 fieldset.buttons {
   background: inherit;
@@ -120,8 +131,8 @@ input[type="time"],
 input[type="url"],
 input[type="week"] {
   font-size: inherit;
-  padding: 3px 2px;
-  width: 300px;
+  padding: .25em;
+  padding: .25rem;
 }
 .ie6 input {
   vertical-align: text-bottom;
@@ -133,19 +144,19 @@ input[disabled='disabled'] {
 }
 
 input[type="checkbox"] {
-  margin: 0 3px 0 0;
+  margin: 0 .25em 0 0;
+  margin: 0 .25rem 0 0;
   position: relative;
-  top: -2px;
   vertical-align: middle;
 }
 .ie7 input[type="checkbox"] {
   vertical-align: baseline;
 }
 
 input[type="radio"] {
-  margin: 0 3px 0 0;
+  margin: 0 .25em 0 0;
+  margin: 0 .25rem 0 0;
   position: relative;
-  top: -2px;
   vertical-align: middle;
 }
 
@@ -162,21 +173,22 @@ input[type="radio"] {
 /* Textareas */
 textarea {
   font-size: inherit;
-  height: 200px;
-  margin: 0 6px 6px 0;
-  padding: 5px;
-  width: 440px;
+  margin: 0 .5em .5em 0;
+  margin: 0 .5rem .5rem 0;
+  padding: .5em;
+  padding: .5rem;
   overflow: auto;
 }
 
 /* Select fields */
 fieldset .select select {
-  width: 200px;
-  font-size: 11px;
+  font-size: .75em;
+  font-size: .75rem;
 }
 
 optgroup {
-  margin: 0 0 6px 0;
+  margin: 0 0 .5em 0;
+  margin: 0 0 .5rem 0;
 }
 
 /* Date & Time */

app/assets/stylesheets/_lists.scss

@@ -2,7 +2,8 @@
 
 ul, ol {
   list-style-position: inside;
-  margin-bottom:  16px;
+  margin-bottom: 1em;
+  margin-bottom: 1rem;
 }
 
 ul {
@@ -14,27 +15,31 @@ ol {
 }
 
 dl {
-  line-height: 1.4;
-  margin-bottom: 16px;
+  line-height: 1.4em;
+  margin-bottom: 1em;
+  margin-bottom: 1rem;
 }
 
 dl dt {
   font-weight: bold;
-  margin-top: 6px;
+  margin-top: .5em;
+  margin-top: .5rem;
 }
 
 dl dd {
-  margin-bottom: 0em;
+  margin-bottom: 0;
 }
 
 dd {
-  margin-left: 6px;
+  margin-left: .5em;
+  margin-left: .5rem;
 }
 
 li {
-  line-height: 1.4;
+  line-height: 1.4em;
 }
 
 ol ol, ol ul, ul ul, ul ol {
-  margin-left: 12px;
+  margin-left: .75em;
+  margin-left: .75rem;
 }

app/assets/stylesheets/_tables.scss

@@ -1,7 +1,8 @@
 /* Tables */
 
 table {
-  margin-bottom: 24px;
+  margin-bottom: 1.5em;
+  margin-bottom: 1.5rem;
   width: 100%;
 }
 
@@ -16,13 +17,16 @@ td {
 }
 
 caption, th, td {
-  padding: 4px 10px 4px 0;
+  padding: .25em .75em .25em 0;
+  padding: .25rem .75rem .25rem 0;
 }
 
 caption {
   background: #f1f1f1;
-  margin-bottom: 12px;
-  padding: 10px 0;
+  margin-bottom: .75em;
+  margin-bottom: .75rem;
+  padding: .75em 0;
+  padding: .75rem 0;
 }
 
 tr, td, th {

app/assets/stylesheets/_type.scss

@@ -1,46 +1,42 @@
 /* Headings */
 h1, h2, h3, h4, h5, h6 {
   font-weight: bold;
+  line-height: 1.2em;
 }
 
 h1 {
-  font-size: 28px;
-  line-height: 1.2;
-  margin-bottom: 12px;
+  font-size: 1.75em;
+  font-size: 1.75rem;
 }
 
 h2 {
-  font-size: 24px;
-  line-height: 1.2;
-  margin-bottom: 6px;
+  font-size: 1.5em;
+  font-size: 1.5rem;
 }
 
 h3 {
-  font-size: 18px;
-  line-height: 1.2;
-  margin-bottom: 4px;
+  font-size: 1.25em;
+  font-size: 1.25rem;
 }
 
 h4 {
-  font-size: 16px;
-  line-height: 1.3;
-  margin-bottom: 4px;
+  font-size: 1em;
+  font-size: 1rem;
 }
 
 h5 {
-  font-size: 14px;
-  margin-bottom: 4px;
+  font-size: .75em;
+  font-size: .75rem;
 }
 
 h6 {
-  font-size: 12px;
-  margin-bottom: 4px;
+  font-size: .5em;
+  font-size: .5rem;
 }
 
 /* Text elements */
 p {
-  line-height: 1.4;
-  margin-bottom: 12px;
+  line-height: 1.4em;
 }
 
 /* Use this if the image is at the top of the <p>. */
@@ -49,7 +45,8 @@ p img.top {
 }
 
 img {
-  margin: 0 0 12px;
+  margin: 0 0 .75em;
+  margin: 0 0 .75rem;
 }
 
 abbr, acronym {
@@ -59,7 +56,8 @@ abbr, acronym {
 
 address {
   font-style: italic;
-  margin-top: 16px;
+  margin-top: 1em;
+  margin-top: 1rem;
 }
 
 del {
@@ -87,8 +85,10 @@ blockquote {
   border-left: 4px solid #d1d1d1;
   color: #666;
   font-style: italic;
-  margin: 16px 0;
-  padding-left: 12px;
+  margin: 1em 0;
+  margin: 1rem 0;
+  padding-left: .75em;
+  padding-left: .75rem;
 }
 
 strong {
@@ -105,25 +105,29 @@ dfn {
 }
 
 pre, code {
-  margin: 12px 0;
+  margin: .75em 0;
+  margin: .75rem 0;
   white-space: pre; /* CSS2 */
   white-space: pre-wrap; /* CSS 2.1 */
   word-wrap: break-word; /* IE */
 }
 
 pre, code, tt {
-  font: 12px 'andale mono', 'monotype.com', 'lucida console', monospace;
-  line-height: 1.5;
+  font: .75rem 'andale mono', 'monotype.com', 'lucida console', monospace;
+  font-size: .75em;
+  font-size: .75rem;
+  line-height: 1.4em;
 }
 
 pre.code {
   background: #000;
   color: #fff;
-  padding: 20px;
+  padding: 1.25em;
+  padding: 1.25rem;
 }
 
 tt {
   display: block;
-  line-height: 1.5;
-  margin: 16px 0;
+  line-height: 1.4em;
+  margin: 1rem 0;
 }