Created
October 11, 2012 15:45
-
-
Save darrentorpey/3873310 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="" class="toggle_form_style">Toggle form style</a> | |
<form accept-charset="UTF-8" action="/shopping/checkout/update/address" class="form-horizontal checkout_form formtastic spree_order" id="checkout_form_address" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="_method" type="hidden" value="put"><input name="authenticity_token" type="hidden" value="uM2v0Q6eSbGgeJgGgm7LgTFCqub/zT6c0KeNy+KpwUo="></div> | |
<section class="main_col" data-hook="checkout_content"> | |
<div class="columns alpha six" data-hook="billing_fieldset_wrapper"> | |
<div class="form_box billing_info" id="billing" data-hook=""> | |
<header><h2>Billing Information</h2></header> | |
<div class="body"> | |
<fieldset class="inputs"> | |
<div class="string control-group required stringish" id="order_bill_address_attributes_firstname_input"><label class=" control-label" for="order_bill_address_attributes_firstname">First Name<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_firstname" maxlength="255" name="order[bill_address_attributes][firstname]" type="text" value="Darren"> | |
</div></div> | |
<div class="string control-group required stringish" id="order_bill_address_attributes_lastname_input"><label class=" control-label" for="order_bill_address_attributes_lastname">Last Name<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_lastname" maxlength="255" name="order[bill_address_attributes][lastname]" type="text" value="Torpey"> | |
</div></div> | |
<div class="string control-group required stringish" id="order_bill_address_attributes_address1_input"><label class=" control-label" for="order_bill_address_attributes_address1">Address 1<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_address1" maxlength="255" name="order[bill_address_attributes][address1]" type="text" value="39 Williams Street"> | |
</div></div> | |
<div class="string control-group optional stringish" id="order_bill_address_attributes_address2_input"><label class=" control-label" for="order_bill_address_attributes_address2">Address 2</label><div class="controls"><input id="order_bill_address_attributes_address2" maxlength="255" name="order[bill_address_attributes][address2]" type="text" value=""> | |
</div></div> | |
<div class="string control-group required stringish" id="order_bill_address_attributes_city_input"><label class=" control-label" for="order_bill_address_attributes_city">City<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_city" maxlength="255" name="order[bill_address_attributes][city]" type="text" value="Worcester"> | |
</div></div> | |
<div class="select control-group required" id="order_bill_address_attributes_country_id_input" style="display:none"><label class=" control-label" for="order_bill_address_attributes_country_id">Country<abbr title="required">*</abbr></label><div class="controls"><select id="order_bill_address_attributes_country_id" name="order[bill_address_attributes][country_id]"><option value=""></option> | |
<option value="214" selected="selected">United States</option></select> | |
</div></div> | |
<div class="select control-group optional" id="order_bill_address_attributes_state_input"><label class=" control-label" for="order_bill_address_attributes_state_id">State</label><div class="controls"><select id="order_bill_address_attributes_state_id" name="order[bill_address_attributes][state_id]"><option value=""></option> | |
<option value="1061493585">Alabama</option> | |
<option value="403740659">Alaska</option> | |
<option value="948208802">Arizona</option> | |
<option value="471470972">Arkansas</option> | |
<option value="276110813">California</option> | |
<option value="536031023">Colorado</option> | |
<option value="69870734">Connecticut</option> | |
<option value="721598219">Delaware</option> | |
<option value="6764998">District of Columbia</option> | |
<option value="267271847">Florida</option> | |
<option value="876916760">Georgia</option> | |
<option value="199950338">Hawaii</option> | |
<option value="982433740">Idaho</option> | |
<option value="625629523">Illinois</option> | |
<option value="769938586">Indiana</option> | |
<option value="825306985">Iowa</option> | |
<option value="969722173">Kansas</option> | |
<option value="308473843">Kentucky</option> | |
<option value="37199952">Louisiana</option> | |
<option value="1055056709">Maine</option> | |
<option value="480368357">Maryland</option> | |
<option value="385551075" selected="selected">Massachusetts</option> | |
<option value="931624400">Michigan</option> | |
<option value="1032288924">Minnesota</option> | |
<option value="532363768">Mississippi</option> | |
<option value="653576146">Missouri</option> | |
<option value="999156632">Montana</option> | |
<option value="673350891">Nebraska</option> | |
<option value="179539703">Nevada</option> | |
<option value="426832442">New Hampshire</option> | |
<option value="750950030">New Jersey</option> | |
<option value="69729944">New Mexico</option> | |
<option value="889445952">New York</option> | |
<option value="177087202">North Carolina</option> | |
<option value="51943165">North Dakota</option> | |
<option value="485193526">Ohio</option> | |
<option value="248548169">Oklahoma</option> | |
<option value="298914262">Oregon</option> | |
<option value="471711976">Pennsylvania</option> | |
<option value="474001862">Rhode Island</option> | |
<option value="597434151">South Carolina</option> | |
<option value="615306087">South Dakota</option> | |
<option value="726305632">Tennessee</option> | |
<option value="525212995">Texas</option> | |
<option value="17199670">Utah</option> | |
<option value="989115415">Vermont</option> | |
<option value="41111624">Virginia</option> | |
<option value="414569975">Washington</option> | |
<option value="91367981">West Virginia</option> | |
<option value="103680699">Wisconsin</option> | |
<option value="66390489">Wyoming</option></select> | |
</div></div> | |
<div class="string control-group required stringish" id="order_bill_address_attributes_zipcode_input"><label class=" control-label" for="order_bill_address_attributes_zipcode">ZIP<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_zipcode" maxlength="255" name="order[bill_address_attributes][zipcode]" type="text" value="01609"> | |
</div></div> | |
<div class="phone control-group required stringish" id="order_bill_address_attributes_phone_input"><label class=" control-label" for="order_bill_address_attributes_phone">Phone<abbr title="required">*</abbr></label><div class="controls"><input id="order_bill_address_attributes_phone" maxlength="255" name="order[bill_address_attributes][phone]" type="tel" value="555.555.5555"> | |
</div></div> | |
</fieldset> </div> | |
</div> | |
</div> | |
<div class="columns omega six shipping_fieldset_wrapper" data-hook="shipping_fieldset_wrapper"> | |
<div class="form_box shipping_info" id="shipping" data-hook=""> | |
<header><h2>Shipping Information</h2></header> | |
<div class="body"> | |
<p class="field checkbox" data-hook="use_billing"> | |
<input checked="checked" id="order_use_billing" name="order[use_billing]" type="checkbox" value="1"> | |
<label for="order_use_billing" id="use_billing">Use Billing Address</label> | |
</p> | |
<fieldset class="inputs inner" style="display: none; "> | |
<div class="string control-group required stringish" id="order_ship_address_attributes_firstname_input"><label class=" control-label" for="order_ship_address_attributes_firstname">First Name<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_firstname" maxlength="255" name="order[ship_address_attributes][firstname]" type="text" value="Darren" disabled=""> | |
</div></div> | |
<div class="string control-group required stringish" id="order_ship_address_attributes_lastname_input"><label class=" control-label" for="order_ship_address_attributes_lastname">Last Name<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_lastname" maxlength="255" name="order[ship_address_attributes][lastname]" type="text" value="Torpey" disabled=""> | |
</div></div> | |
<div class="string control-group required stringish" id="order_ship_address_attributes_address1_input"><label class=" control-label" for="order_ship_address_attributes_address1">Address 1<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_address1" maxlength="255" name="order[ship_address_attributes][address1]" type="text" value="39 Williams Street" disabled=""> | |
</div></div> | |
<div class="string control-group optional stringish" id="order_ship_address_attributes_address2_input"><label class=" control-label" for="order_ship_address_attributes_address2">Address 2</label><div class="controls"><input id="order_ship_address_attributes_address2" maxlength="255" name="order[ship_address_attributes][address2]" type="text" value="" disabled=""> | |
</div></div> | |
<div class="string control-group required stringish" id="order_ship_address_attributes_city_input"><label class=" control-label" for="order_ship_address_attributes_city">City<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_city" maxlength="255" name="order[ship_address_attributes][city]" type="text" value="Worcester" disabled=""> | |
</div></div> | |
<div class="select control-group required" id="order_ship_address_attributes_country_id_input" style="display:none"><label class=" control-label" for="order_ship_address_attributes_country_id">Country<abbr title="required">*</abbr></label><div class="controls"><select id="order_ship_address_attributes_country_id" name="order[ship_address_attributes][country_id]" disabled=""><option value=""></option> | |
<option value="214" selected="selected">United States</option></select> | |
</div></div> | |
<div class="select control-group optional" id="order_ship_address_attributes_state_input"><label class=" control-label" for="order_ship_address_attributes_state_id">State</label><div class="controls"><select id="order_ship_address_attributes_state_id" name="order[ship_address_attributes][state_id]" disabled=""><option value=""></option> | |
<option value="1061493585">Alabama</option> | |
<option value="403740659">Alaska</option> | |
<option value="948208802">Arizona</option> | |
<option value="471470972">Arkansas</option> | |
<option value="276110813">California</option> | |
<option value="536031023">Colorado</option> | |
<option value="69870734">Connecticut</option> | |
<option value="721598219">Delaware</option> | |
<option value="6764998">District of Columbia</option> | |
<option value="267271847">Florida</option> | |
<option value="876916760">Georgia</option> | |
<option value="199950338">Hawaii</option> | |
<option value="982433740">Idaho</option> | |
<option value="625629523">Illinois</option> | |
<option value="769938586">Indiana</option> | |
<option value="825306985">Iowa</option> | |
<option value="969722173">Kansas</option> | |
<option value="308473843">Kentucky</option> | |
<option value="37199952">Louisiana</option> | |
<option value="1055056709">Maine</option> | |
<option value="480368357">Maryland</option> | |
<option value="385551075" selected="selected">Massachusetts</option> | |
<option value="931624400">Michigan</option> | |
<option value="1032288924">Minnesota</option> | |
<option value="532363768">Mississippi</option> | |
<option value="653576146">Missouri</option> | |
<option value="999156632">Montana</option> | |
<option value="673350891">Nebraska</option> | |
<option value="179539703">Nevada</option> | |
<option value="426832442">New Hampshire</option> | |
<option value="750950030">New Jersey</option> | |
<option value="69729944">New Mexico</option> | |
<option value="889445952">New York</option> | |
<option value="177087202">North Carolina</option> | |
<option value="51943165">North Dakota</option> | |
<option value="485193526">Ohio</option> | |
<option value="248548169">Oklahoma</option> | |
<option value="298914262">Oregon</option> | |
<option value="471711976">Pennsylvania</option> | |
<option value="474001862">Rhode Island</option> | |
<option value="597434151">South Carolina</option> | |
<option value="615306087">South Dakota</option> | |
<option value="726305632">Tennessee</option> | |
<option value="525212995">Texas</option> | |
<option value="17199670">Utah</option> | |
<option value="989115415">Vermont</option> | |
<option value="41111624">Virginia</option> | |
<option value="414569975">Washington</option> | |
<option value="91367981">West Virginia</option> | |
<option value="103680699">Wisconsin</option> | |
<option value="66390489">Wyoming</option></select> | |
</div></div> | |
<div class="string control-group required stringish" id="order_ship_address_attributes_zipcode_input"><label class=" control-label" for="order_ship_address_attributes_zipcode">ZIP<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_zipcode" maxlength="255" name="order[ship_address_attributes][zipcode]" type="text" value="01609" disabled=""> | |
</div></div> | |
<div class="phone control-group required stringish" id="order_ship_address_attributes_phone_input"><label class=" control-label" for="order_ship_address_attributes_phone">Phone<abbr title="required">*</abbr></label><div class="controls"><input id="order_ship_address_attributes_phone" maxlength="255" name="order[ship_address_attributes][phone]" type="tel" value="555.555.5555" disabled=""> | |
</div></div> | |
</fieldset> </div> | |
</div> | |
</div> | |
<div class="form-buttons" data-hook="buttons"> | |
<input class="btn btn-primary continue button primary" name="commit" type="submit" value="Save and Continue"> | |
</div> | |
<input id="post-final" name="commit" style="display:none;" type="submit"> | |
</section> | |
</form> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('.toggle_form_style').click -> | |
$('form').toggleClass('form-horizontal').toggleClass('stacked') | |
false | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@import "compass" | |
body | |
font-family: Arial | |
form | |
margin: 0 0 18px | |
fieldset | |
padding: 0 | |
margin: 0 | |
border: 0 | |
legend | |
display: block | |
width: 100% | |
padding: 0 | |
margin-bottom: 27px | |
font-size: 19.5px | |
line-height: 36px | |
color: #333333 | |
border: 0 | |
border-bottom: 1px solid #e5e5e5 | |
small | |
font-size: 13.5px | |
color: #999999 | |
label, input, button, select, textarea | |
font-size: 13px | |
font-weight: normal | |
line-height: 18px | |
input, button, select, textarea | |
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif | |
label | |
display: block | |
margin-bottom: 5px | |
select, textarea | |
display: inline-block | |
height: 18px | |
padding: 4px | |
margin-bottom: 9px | |
font-size: 13px | |
line-height: 18px | |
color: #555555 | |
input | |
&[type="text"], &[type="password"], &[type="datetime"], &[type="datetime-local"], &[type="date"], &[type="month"], &[type="time"], &[type="week"], &[type="number"], &[type="email"], &[type="url"], &[type="search"], &[type="tel"], &[type="color"] | |
display: inline-block | |
height: 18px | |
padding: 4px | |
margin-bottom: 9px | |
font-size: 13px | |
line-height: 18px | |
color: #555555 | |
.uneditable-input | |
display: inline-block | |
height: 18px | |
padding: 4px | |
margin-bottom: 9px | |
font-size: 13px | |
line-height: 18px | |
color: #555555 | |
input | |
width: 210px | |
textarea | |
width: 210px | |
height: auto | |
background-color: #ffffff | |
border: 1px solid #cccccc | |
-webkit-border-radius: 3px | |
-moz-border-radius: 3px | |
border-radius: 3px | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-webkit-transition: border linear 0.2s, box-shadow linear 0.2s | |
-moz-transition: border linear 0.2s, box-shadow linear 0.2s | |
-ms-transition: border linear 0.2s, box-shadow linear 0.2s | |
-o-transition: border linear 0.2s, box-shadow linear 0.2s | |
transition: border linear 0.2s, box-shadow linear 0.2s | |
input | |
&[type="text"], &[type="password"], &[type="datetime"], &[type="datetime-local"], &[type="date"], &[type="month"], &[type="time"], &[type="week"], &[type="number"], &[type="email"], &[type="url"], &[type="search"], &[type="tel"], &[type="color"] | |
background-color: #ffffff | |
border: 1px solid #cccccc | |
-webkit-border-radius: 3px | |
-moz-border-radius: 3px | |
border-radius: 3px | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-webkit-transition: border linear 0.2s, box-shadow linear 0.2s | |
-moz-transition: border linear 0.2s, box-shadow linear 0.2s | |
-ms-transition: border linear 0.2s, box-shadow linear 0.2s | |
-o-transition: border linear 0.2s, box-shadow linear 0.2s | |
transition: border linear 0.2s, box-shadow linear 0.2s | |
.uneditable-input | |
background-color: #ffffff | |
border: 1px solid #cccccc | |
-webkit-border-radius: 3px | |
-moz-border-radius: 3px | |
border-radius: 3px | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) | |
-webkit-transition: border linear 0.2s, box-shadow linear 0.2s | |
-moz-transition: border linear 0.2s, box-shadow linear 0.2s | |
-ms-transition: border linear 0.2s, box-shadow linear 0.2s | |
-o-transition: border linear 0.2s, box-shadow linear 0.2s | |
transition: border linear 0.2s, box-shadow linear 0.2s | |
textarea:focus | |
border-color: rgba(82, 168, 236, 0.8) | |
outline: 0 | |
outline: thin dotted \9 | |
/* IE6-9 | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
input | |
&[type="text"]:focus, &[type="password"]:focus, &[type="datetime"]:focus, &[type="datetime-local"]:focus, &[type="date"]:focus, &[type="month"]:focus, &[type="time"]:focus, &[type="week"]:focus, &[type="number"]:focus, &[type="email"]:focus, &[type="url"]:focus, &[type="search"]:focus, &[type="tel"]:focus, &[type="color"]:focus | |
border-color: rgba(82, 168, 236, 0.8) | |
outline: 0 | |
outline: thin dotted \9 | |
/* IE6-9 | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
.uneditable-input:focus | |
border-color: rgba(82, 168, 236, 0.8) | |
outline: 0 | |
outline: thin dotted \9 | |
/* IE6-9 | |
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6) | |
input | |
&[type="radio"], &[type="checkbox"] | |
margin: 3px 0 | |
*margin-top: 0 | |
/* IE7 | |
line-height: normal | |
cursor: pointer | |
&[type="submit"], &[type="reset"], &[type="button"], &[type="radio"], &[type="checkbox"] | |
width: auto | |
.uneditable-textarea | |
width: auto | |
height: auto | |
select, input[type="file"] | |
height: 28px | |
/* In IE7, the height of the select element cannot be changed by height, only font-size | |
*margin-top: 4px | |
/* For IE7, add top margin to align select with labels | |
line-height: 28px | |
select | |
width: 220px | |
border: 1px solid #bbb | |
&[multiple], &[size] | |
height: auto | |
&:focus | |
outline: thin dotted #333 | |
outline: 5px auto -webkit-focus-ring-color | |
outline-offset: -2px | |
input | |
&[type="file"]:focus, &[type="radio"]:focus, &[type="checkbox"]:focus | |
outline: thin dotted #333 | |
outline: 5px auto -webkit-focus-ring-color | |
outline-offset: -2px | |
.radio, .checkbox | |
min-height: 18px | |
padding-left: 18px | |
.radio input[type="radio"], .checkbox input[type="checkbox"] | |
float: left | |
margin-left: -18px | |
.controls > | |
.radio:first-child, .checkbox:first-child | |
padding-top: 5px | |
.radio.inline, .checkbox.inline | |
display: inline-block | |
padding-top: 5px | |
margin-bottom: 0 | |
vertical-align: middle | |
.radio.inline + .radio.inline, .checkbox.inline + .checkbox.inline | |
margin-left: 10px | |
.input-mini | |
width: 60px | |
.input-small | |
width: 90px | |
.input-medium | |
width: 150px | |
.input-large | |
width: 210px | |
.input-xlarge | |
width: 270px | |
.input-xxlarge | |
width: 530px | |
input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input[class*="span"] | |
float: none | |
margin-left: 0 | |
.row-fluid | |
input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input[class*="span"] | |
float: none | |
margin-left: 0 | |
.input-append | |
input[class*="span"], .uneditable-input[class*="span"] | |
display: inline-block | |
.input-prepend | |
input[class*="span"], .uneditable-input[class*="span"] | |
display: inline-block | |
.row-fluid | |
.input-prepend [class*="span"], .input-append [class*="span"] | |
display: inline-block | |
input, textarea, .uneditable-input | |
margin-left: 0 | |
input.span8, textarea.span8, .uneditable-input.span8 | |
width: 899px | |
input.span7, textarea.span7, .uneditable-input.span7 | |
width: 783px | |
input.span6, textarea.span6, .uneditable-input.span6 | |
width: 667px | |
input.span5, textarea.span5, .uneditable-input.span5 | |
width: 551px | |
input.span4, textarea.span4, .uneditable-input.span4 | |
width: 435px | |
input.span3, textarea.span3, .uneditable-input.span3 | |
width: 319px | |
input.span2, textarea.span2, .uneditable-input.span2 | |
width: 203px | |
input.span1, textarea.span1, .uneditable-input.span1 | |
width: 87px | |
input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] | |
cursor: not-allowed | |
background-color: #eeeeee | |
border-color: #ddd | |
input | |
&[type="radio"][disabled], &[type="checkbox"][disabled], &[type="radio"][readonly], &[type="checkbox"][readonly] | |
background-color: transparent | |
.control-group | |
&.warning | |
> label, .help-block, .help-inline | |
color: #c09853 | |
.checkbox, .radio, input, select, textarea | |
color: #c09853 | |
border-color: #c09853 | |
.checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus | |
border-color: #a47e3c | |
-webkit-box-shadow: 0 0 6px #dbc59e | |
-moz-box-shadow: 0 0 6px #dbc59e | |
box-shadow: 0 0 6px #dbc59e | |
.input-prepend .add-on, .input-append .add-on | |
color: #c09853 | |
background-color: #fcf8e3 | |
border-color: #c09853 | |
&.error | |
> label, .help-block, .help-inline | |
color: #b94a48 | |
.checkbox, .radio, input, select, textarea | |
color: #b94a48 | |
border-color: #b94a48 | |
.checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus | |
border-color: #953b39 | |
-webkit-box-shadow: 0 0 6px #d59392 | |
-moz-box-shadow: 0 0 6px #d59392 | |
box-shadow: 0 0 6px #d59392 | |
.input-prepend .add-on, .input-append .add-on | |
color: #b94a48 | |
background-color: #f2dede | |
border-color: #b94a48 | |
&.success | |
> label, .help-block, .help-inline | |
color: #468847 | |
.checkbox, .radio, input, select, textarea | |
color: #468847 | |
border-color: #468847 | |
.checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus | |
border-color: #356635 | |
-webkit-box-shadow: 0 0 6px #7aba7b | |
-moz-box-shadow: 0 0 6px #7aba7b | |
box-shadow: 0 0 6px #7aba7b | |
.input-prepend .add-on, .input-append .add-on | |
color: #468847 | |
background-color: #dff0d8 | |
border-color: #468847 | |
input:focus:required:invalid, textarea:focus:required:invalid, select:focus:required:invalid | |
color: #b94a48 | |
border-color: #ee5f5b | |
input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, select:focus:required:invalid:focus | |
border-color: #e9322d | |
-webkit-box-shadow: 0 0 6px #f8b9b7 | |
-moz-box-shadow: 0 0 6px #f8b9b7 | |
box-shadow: 0 0 6px #f8b9b7 | |
.form-actions | |
padding: 17px 20px 18px | |
margin-top: 18px | |
margin-bottom: 18px | |
background-color: #f5f5f5 | |
border-top: 1px solid #e5e5e5 | |
*zoom: 1 | |
&:before | |
display: table | |
content: "" | |
&:after | |
display: table | |
content: "" | |
clear: both | |
.uneditable-input | |
overflow: hidden | |
white-space: nowrap | |
cursor: not-allowed | |
background-color: #ffffff | |
border-color: #eee | |
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025) | |
-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025) | |
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025) | |
\:-moz-placeholder, :-ms-input-placeholder, ::-webkit-input-placeholder | |
color: #999999 | |
.help-block, .help-inline | |
color: #555555 | |
.help-block | |
display: block | |
margin-bottom: 9px | |
.help-inline | |
display: inline-block | |
*display: inline | |
/* IE7 inline-block hack | |
*zoom: 1 | |
vertical-align: middle | |
padding-left: 5px | |
.input-prepend, .input-append | |
margin-bottom: 5px | |
.input-prepend input, .input-append input, .input-prepend select, .input-append select, .input-prepend .uneditable-input, .input-append .uneditable-input | |
position: relative | |
margin-bottom: 0 | |
*margin-left: 0 | |
vertical-align: middle | |
-webkit-border-radius: 0 3px 3px 0 | |
-moz-border-radius: 0 3px 3px 0 | |
border-radius: 0 3px 3px 0 | |
.input-prepend input:focus, .input-append input:focus, .input-prepend select:focus, .input-append select:focus, .input-prepend .uneditable-input:focus, .input-append .uneditable-input:focus | |
z-index: 2 | |
.input-prepend .uneditable-input, .input-append .uneditable-input | |
border-left-color: #ccc | |
.input-prepend .add-on, .input-append .add-on | |
display: inline-block | |
width: auto | |
height: 18px | |
min-width: 16px | |
padding: 4px 5px | |
font-weight: normal | |
line-height: 18px | |
text-align: center | |
text-shadow: 0 1px 0 #ffffff | |
vertical-align: middle | |
background-color: #eeeeee | |
border: 1px solid #ccc | |
.input-prepend .add-on, .input-append .add-on, .input-prepend .btn, .input-append .btn | |
margin-left: -1px | |
-webkit-border-radius: 0 | |
-moz-border-radius: 0 | |
border-radius: 0 | |
.input-prepend .active, .input-append .active | |
background-color: #a9dba9 | |
border-color: #46a546 | |
.input-prepend | |
.add-on, .btn | |
margin-right: -1px | |
.add-on:first-child, .btn:first-child | |
-webkit-border-radius: 3px 0 0 3px | |
-moz-border-radius: 3px 0 0 3px | |
border-radius: 3px 0 0 3px | |
.input-append | |
input, select | |
-webkit-border-radius: 3px 0 0 3px | |
-moz-border-radius: 3px 0 0 3px | |
border-radius: 3px 0 0 3px | |
.uneditable-input | |
-webkit-border-radius: 3px 0 0 3px | |
-moz-border-radius: 3px 0 0 3px | |
border-radius: 3px 0 0 3px | |
border-right-color: #ccc | |
border-left-color: #eee | |
.add-on:last-child, .btn:last-child | |
-webkit-border-radius: 0 3px 3px 0 | |
-moz-border-radius: 0 3px 3px 0 | |
border-radius: 0 3px 3px 0 | |
.input-prepend.input-append | |
input, select, .uneditable-input | |
-webkit-border-radius: 0 | |
-moz-border-radius: 0 | |
border-radius: 0 | |
.add-on:first-child, .btn:first-child | |
margin-right: -1px | |
-webkit-border-radius: 3px 0 0 3px | |
-moz-border-radius: 3px 0 0 3px | |
border-radius: 3px 0 0 3px | |
.add-on:last-child, .btn:last-child | |
margin-left: -1px | |
-webkit-border-radius: 0 3px 3px 0 | |
-moz-border-radius: 0 3px 3px 0 | |
border-radius: 0 3px 3px 0 | |
.search-query | |
padding-right: 14px | |
padding-right: 4px \9 | |
padding-left: 14px | |
padding-left: 4px \9 | |
/* IE7-8 doesn't have border-radius, so don't indent the padding | |
margin-bottom: 0 | |
-webkit-border-radius: 14px | |
-moz-border-radius: 14px | |
border-radius: 14px | |
.form-search input, .form-inline input, .form-horizontal input, .form-search textarea, .form-inline textarea, .form-horizontal textarea, .form-search select, .form-inline select, .form-horizontal select, .form-search .help-inline, .form-inline .help-inline, .form-horizontal .help-inline, .form-search .uneditable-input, .form-inline .uneditable-input, .form-horizontal .uneditable-input, .form-search .input-prepend, .form-inline .input-prepend, .form-horizontal .input-prepend, .form-search .input-append, .form-inline .input-append, .form-horizontal .input-append | |
display: inline-block | |
*display: inline | |
/* IE7 inline-block hack | |
*zoom: 1 | |
margin-bottom: 0 | |
.form-search .hide, .form-inline .hide, .form-horizontal .hide | |
display: none | |
.form-search label, .form-inline label | |
display: inline-block | |
.form-search .input-append, .form-inline .input-append, .form-search .input-prepend, .form-inline .input-prepend | |
margin-bottom: 0 | |
.form-search | |
.radio, .checkbox | |
padding-left: 0 | |
margin-bottom: 0 | |
vertical-align: middle | |
.form-inline | |
.radio, .checkbox | |
padding-left: 0 | |
margin-bottom: 0 | |
vertical-align: middle | |
.form-search | |
.radio input[type="radio"], .checkbox input[type="checkbox"] | |
float: left | |
margin-right: 3px | |
margin-left: 0 | |
.form-inline | |
.radio input[type="radio"], .checkbox input[type="checkbox"] | |
float: left | |
margin-right: 3px | |
margin-left: 0 | |
.control-group | |
margin-bottom: 9px | |
legend + .control-group | |
margin-top: 18px | |
-webkit-margin-top-collapse: separate | |
.form-horizontal | |
.control-group | |
margin-bottom: 18px | |
*zoom: 1 | |
&:before | |
display: table | |
content: "" | |
&:after | |
display: table | |
content: "" | |
clear: both | |
.control-label | |
float: left | |
width: 140px | |
padding-top: 5px | |
text-align: right | |
.controls | |
*display: inline-block | |
*padding-left: 20px | |
margin-left: 160px | |
*margin-left: 0 | |
&:first-child | |
*padding-left: 160px | |
.help-block | |
margin-top: 9px | |
margin-bottom: 0 | |
.form-actions | |
padding-left: 160px | |
form.stacked | |
.control-group | |
margin-bottom: 0 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment