Permalink
Browse files

Quiet comments, settings, and refactoring

  • Loading branch information...
1 parent f641589 commit e44457b4616ac83b6a2d2e028dfe6845a4b8ad52 @adamstac committed Dec 31, 2011
@@ -0,0 +1,13 @@
+// Shared
+@import zurb/includes
+
+// Foundation parts
+@import zurb/globals
+@import zurb/typography
+@import zurb/grid
+@import zurb/buttons
+@import zurb/ui
+@import zurb/forms
+@import zurb/orbit
+@import zurb/reveal
+@import zurb/mobile
@@ -0,0 +1,102 @@
+// `Buttons
+//----------------------------------------------------------------------------------------------------
+
+.button
+ background: $default-color
+ border: none
+ color: $white
+ cursor: pointer
+ display: inline-block
+ font-weight: bold
+ line-height: 1
+ padding: 9px 34px 11px
+ position: relative
+ text-align: center
+ text-decoration: none
+
+ // `Base hover state
+ &:hover, &:focus
+ background-color: darken($default-color, 5%)
+ color: #fff
+
+ // `Nice button
+ &.nice
+ background-color: $default-color
+ +background-image(linear-gradient(rgba(#fff, 0.2) 0%, rgba(#fff, 0.2) 50%, rgba(#000, 0) 51%, rgba(#000, 0) 100%))
+ +box-shadow(inset rgba(#fff, 0.5) 0 1px 0)
+ text-shadow: rgba(#000, 0.28) 0 -1px 1px
+ border: 1px solid darken($default-color, 7%)
+ +transition-property(background-color)
+ +transition-duration($button-transition-duration)
+ +transition-timing-function(ease-in-out)
+
+ // `Nie button borders
+ &.red
+ border: solid 1px darken($red, 7%)
+ &.blue
+ border: solid 1px darken($blue, 7%)
+ &.white
+ border: solid 1px darken($white, 20%)
+ text-shadow: none !important
+ &.black
+ border: solid 1px darken($black, 7%)
+
+ // `Colors and hover states
+ &.red
+ background-color: $red
+ &:hover, &:focus
+ background-color: darken($red, 5%)
+ &.blue
+ background-color: $blue
+ &:hover, &:focus
+ background-color: darken($blue, 5%)
+ &.white
+ background-color: darken($white, 15%)
+ color: #333
+ &:hover, &:focus
+ background-color: darken($white, 30%)
+ color: #333
+ &.black
+ background-color: $black
+ &:hover, &:focus
+ background-color: darken($black, 5%)
+
+ // `Button shapes
+ &.radius
+ +border-radius(3px)
+ &.round
+ +border-radius(1000px)
+
+ // `Layout
+ &.full-width
+ width: 100%
+ padding-left: 0 !important
+ padding-right: 0 !important
+ text-align: center
+ &.left-align
+ text-align: left
+ text-indent: 12px
+
+ // `Sizes
+ &.small
+ +font-size(11)
+ padding: 8px 20px 10px
+ width: auto
+ &.medium
+ +font-size(13)
+ width: auto
+ &.large
+ +font-size(18)
+ padding: 11px 48px 13px
+ width: auto
+
+ // `Disabled state
+ &.disabled, &[disabled]
+ opacity: 0.6
+ cursor: default
+
+//----------------------------------------------------------------------------------------------------
+
+// Don't use native buttons on iOS
+input[type=submit].button
+ -webkit-appearance: none
@@ -1,8 +1,6 @@
-@import includes
+// `Standard forms
+//----------------------------------------------------------------------------------------------------
-/* Artfully masterminded by ZURB :: Make sure to include app.js / foundation.js if you are going to use inline label inputs */
-
-/* Standard Forms */
form
margin: 0 0 18px
label
@@ -20,8 +18,10 @@ input.input-text, textarea, select
margin-bottom: 9px
label + input.input-text, label + textarea, label + select, label + div.dropdown, select + div.dropdown
margin-top: -9px
-
-/* Text input and textarea font and padding */
+
+// `Text input and textarea font and padding
+//----------------------------------------------------------------------------------------------------
+
input.input-text, textarea
+font-size(13)
padding: 4px 3px 2px
@@ -32,12 +32,14 @@ input.input-text, textarea
&:focus
outline: none !important
-/* Inlined Label Style */
+// Inlined label style
input, textarea
.placeholder
color: #888
-/* Text input and textarea sizes */
+// `Text input and textarea sizes
+//----------------------------------------------------------------------------------------------------
+
input
&.input-text
width: 254px
@@ -51,20 +53,26 @@ input, textarea
&.large
width: 434px
-/* Fieldsets */
+// `Fieldsets
+//----------------------------------------------------------------------------------------------------
+
form
fieldset
padding: 9px 9px 2px 9px
border: solid 1px #ddd
margin: 18px 0
-/* Inlined Radio & Checkbox */
+// `Inlined radio & checkbox
+//----------------------------------------------------------------------------------------------------
+
.form-field input[type=radio], .form-field input[type=checkbox]
display: inline
width: auto
margin-bottom: 0
-/* Errors */
+// `Errors
+//----------------------------------------------------------------------------------------------------
+
.form-field.error input, input.input-text.red
border-color: #c00000
background-color: rgba(255,0,0,0.15)
@@ -84,7 +92,9 @@ form
.large+.error
width: 440px
-/* Nicer Forms */
+// `Nicer forms
+//----------------------------------------------------------------------------------------------------
+
form.nice
input.input-text, textarea
border: solid 1px #bbb
@@ -115,7 +125,8 @@ form.nice
.large+.error
width: 432px
-/* Custom Forms */
+// `Custom forms
+//----------------------------------------------------------------------------------------------------
form.custom
span.custom
display: inline-block
@@ -1,9 +0,0 @@
-@import includes
-@import globals
-@import typography
-@import grid
-@import ui
-@import forms
-@import orbit
-@import reveal
-@import mobile
@@ -1,15 +1,16 @@
-@import includes
-
-/* Artfully masterminded by ZURB */
-/* Table of Contents */
-/* :: Reset & Standards */
-/* :: Links */
-/* :: Lists */
-/* :: Tables */
-/* :: Misc */
+// Table of Contents:
+//
+// Eric Meyer's CSS reset
+// Clearfix
+// Body
+// Links
+// Lists
+// Tables
+// Misc
+//
-/* Global Reset & Standards */
-/* Eric Meyer's CSS Reset :: http://meyerweb.com/eric/tools/css/reset/ :: v2.0 | 20110126 :: License: none (public domain) */
+// `Eric Meyer's CSS Reset - http://meyerweb.com/eric/tools/css/reset
+//----------------------------------------------------------------------------------------------------
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, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video
margin: 0
@@ -19,8 +20,7 @@ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockq
vertical-align: baseline
html
font-size: 62.5%
-
-/* HTML 5 display-role reset for older browsers */
+// HTML5 reset for older browsers
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
display: block
body
@@ -35,32 +35,54 @@ blockquote, q
table
border-collapse: collapse
border-spacing: 0
-
+
+// `Nicolas Gallagher's micro clearfix - http://nicolasgallagher.com/micro-clearfix-hack/
+//----------------------------------------------------------------------------------------------------
+
+// For modern browsers
+.clearfix
+ &:before, &:after
+ content: ""
+ display: table
+ &:after
+ clear: both
+
+// For IE 6/7 (triggers hasLayout)
+.clearfix
+ zoom: 1
+
+// `Base cascade
+//----------------------------------------------------------------------------------------------------
+
body
- background: #fff
- +HelveticaFontStack
- +font-size(13)
+ background: $body-background
+ font-family: $body-font-family
+ +font-size($body-font-size)
+font-smoothing(antialiased)
- line-height: 18px
- color: #555
+ line-height: $body-line-height
+ color: $body-color
position: relative
-/* Links */
+// `Links
+//----------------------------------------------------------------------------------------------------
+
a
color: $blue
text-decoration: none
line-height: inherit
&:hover
color: lighten($blue, 10%)
&:focus
- color: #cc4714
+ color: $orange
outline: none
p
a, a:visited
line-height: inherit
-/* Lists */
+// `Lists
+//----------------------------------------------------------------------------------------------------
+
ul, ol
margin-bottom: 18px
ul
@@ -80,7 +102,9 @@ li
ul.large li
line-height: 21px
-/* Tables */
+// `Tables
+//----------------------------------------------------------------------------------------------------
+
table
background: $white
+border-radius(3px)
@@ -121,12 +145,14 @@ table
&:last-child
border-right: none
-/* Misc */
+// `Misc
+//----------------------------------------------------------------------------------------------------
+
.left
float: left
.right
float: right
.hide
display: none
.highlight
- background: #ff0
+ background: $yellow
Oops, something went wrong.

0 comments on commit e44457b

Please sign in to comment.