diff options
| author | Mark Otto <[email protected]> | 2011-08-25 00:13:40 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2011-08-25 00:13:40 -0700 |
| commit | 2d99e3f8a61ef9d4a40cd0cad109d0d89ae3c661 (patch) | |
| tree | 0245170407232ac6faeba27239c58579d8feb61d /lib | |
| parent | d324a242685b433cdb48279235a7837c816052fe (diff) | |
| download | bootstrap-2d99e3f8a61ef9d4a40cd0cad109d0d89ae3c661.tar.xz bootstrap-2d99e3f8a61ef9d4a40cd0cad109d0d89ae3c661.zip | |
base import of normalize into the reset css, tweaks to selector specificity across the board
Diffstat (limited to 'lib')
| -rw-r--r-- | lib/forms.less | 308 | ||||
| -rw-r--r-- | lib/patterns.less | 1 | ||||
| -rw-r--r-- | lib/reset.less | 132 | ||||
| -rw-r--r-- | lib/scaffolding.less | 8 | ||||
| -rw-r--r-- | lib/type.less | 5 |
5 files changed, 293 insertions, 161 deletions
diff --git a/lib/forms.less b/lib/forms.less index 4265f8e59..cfcdb3f17 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -8,174 +8,176 @@ form { margin-bottom: @baseline; +} - // Groups of fields with labels on top (legends) - fieldset { - margin-bottom: @baseline; - padding-top: @baseline; - legend { - display: block; - margin-left: 150px; - font-size: 20px; - line-height: 1; - *margin: 0 0 5px 145px; /* IE6-7 */ - *line-height: 1.5; /* IE6-7 */ - color: @grayDark; - } +// Groups of fields with labels on top (legends) +fieldset { + margin-bottom: @baseline; + padding-top: @baseline; + legend { + display: block; + margin-left: 150px; + font-size: 20px; + line-height: 1; + *margin: 0 0 5px 145px; /* IE6-7 */ + *line-height: 1.5; /* IE6-7 */ + color: @grayDark; } +} - // Parent element that clears floats and wraps labels and fields together - .clearfix { - margin-bottom: @baseline; - } +// Parent element that clears floats and wraps labels and fields together +.clearfix { + margin-bottom: @baseline; +} - // Set font for forms - label, input, select, textarea { - #font > .sans-serif(normal,13px,normal); - } +// Set font for forms +label, +input, +select, +textarea { + #font > .sans-serif(normal,13px,normal); +} - // Float labels left - label { - padding-top: 6px; - font-size: 13px; - line-height: 18px; - float: left; - width: 130px; - text-align: right; - color: @grayDark; - } +// Float labels left +label { + padding-top: 6px; + font-size: 13px; + line-height: 18px; + float: left; + width: 130px; + text-align: right; + color: @grayDark; +} - // Shift over the inside div to align all label's relevant content - div.input { - margin-left: 150px; - } +// Shift over the inside div to align all label's relevant content +div.input { + margin-left: 150px; +} - // Checkboxs and radio buttons - input[type=checkbox], - input[type=radio] { - cursor: pointer; - } +// Checkboxs and radio buttons +input[type=checkbox], +input[type=radio] { + cursor: pointer; +} - // Inputs, Textareas, Selects - input[type=text], - input[type=password], - textarea, - select, - .uneditable-input { - display: inline-block; - width: 210px; - margin: 0; - padding: 4px; - font-size: 13px; - line-height: @baseline; - height: @baseline; - color: @gray; - border: 1px solid #ccc; - .border-radius(3px); - } - select, - input[type=file] { - height: @baseline * 1.5; - line-height: @baseline * 1.5; - } - textarea { - height: auto; - } - .uneditable-input { - background-color: #eee; - display: block; - border-color: #ccc; - .box-shadow(inset 0 1px 2px rgba(0,0,0,.075)); - } +// Inputs, Textareas, Selects +input[type=text], +input[type=password], +textarea, +select, +.uneditable-input { + display: inline-block; + width: 210px; + padding: 4px; + font-size: 13px; + line-height: @baseline; + height: @baseline; + color: @gray; + border: 1px solid #ccc; + .border-radius(3px); +} +select, +input[type=file] { + height: @baseline * 1.5; + line-height: @baseline * 1.5; +} +textarea { + height: auto; +} +.uneditable-input { + background-color: #eee; + display: block; + border-color: #ccc; + .box-shadow(inset 0 1px 2px rgba(0,0,0,.075)); +} - // Placeholder text gets special styles; can't be bundled together though for some reason - :-moz-placeholder { - color: @grayLight; - } - ::-webkit-input-placeholder { - color: @grayLight; - } +// Placeholder text gets special styles; can't be bundled together though for some reason +:-moz-placeholder { + color: @grayLight; +} +::-webkit-input-placeholder { + color: @grayLight; +} + +// Focus states +input[type=text], +input[type=password], +select, textarea { + @transition: border linear .2s, box-shadow linear .2s; + .transition(@transition); + .box-shadow(inset 0 1px 3px rgba(0,0,0,.1)); +} +input[type=text]:focus, +input[type=password]:focus, +textarea:focus { + outline: none; + border-color: rgba(82,168,236,.8); + @shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); + .box-shadow(@shadow); +} - // Focus states +// Error styles +form div.error { + background: lighten(@red, 57%); + padding: 10px 0; + margin: -10px 0 10px; + .border-radius(4px); + @error-text: desaturate(lighten(@red, 25%), 25%); + > label, + span.help-inline, + span.help-block { + color: @red; + } input[type=text], input[type=password], - select, textarea { - @transition: border linear .2s, box-shadow linear .2s; - .transition(@transition); - .box-shadow(inset 0 1px 3px rgba(0,0,0,.1)); - } - input[type=text]:focus, - input[type=password]:focus, - textarea:focus { - outline: none; - border-color: rgba(82,168,236,.8); - @shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); - .box-shadow(@shadow); - } - - // Error styles - div.error { - background: lighten(@red, 57%); - padding: 10px 0; - margin: -10px 0 10px; - .border-radius(4px); - @error-text: desaturate(lighten(@red, 25%), 25%); - > label, - span.help-inline, - span.help-block { - color: @red; + textarea { + border-color: @error-text; + .box-shadow(0 0 3px rgba(171,41,32,.25)); + &:focus { + border-color: darken(@error-text, 10%); + .box-shadow(0 0 6px rgba(171,41,32,.5)); } - input[type=text], - input[type=password], - textarea { + } + .input-prepend, + .input-append { + span.add-on { + background: lighten(@red, 50%); border-color: @error-text; - .box-shadow(0 0 3px rgba(171,41,32,.25)); - &:focus { - border-color: darken(@error-text, 10%); - .box-shadow(0 0 6px rgba(171,41,32,.5)); - } - } - .input-prepend, - .input-append { - span.add-on { - background: lighten(@red, 50%); - border-color: @error-text; - color: darken(@error-text, 10%); - } + color: darken(@error-text, 10%); } } +} - // Form element sizes - .input-mini, input.mini, textarea.mini, select.mini { - width: 60px; - } - .input-small, input.small, textarea.small, select.small { - width: 90px; - } - .input-medium, input.medium, textarea.medium, select.medium { - width: 150px; - } - .input-large, input.large, textarea.large, select.large { - width: 210px; - } - .input-xlarge, input.xlarge, textarea.xlarge, select.xlarge { - width: 270px; - } - .input-xxlarge, input.xxlarge, textarea.xxlarge, select.xxlarge { - width: 530px; - } - textarea.xxlarge { - overflow-y: scroll; - } +// Form element sizes +.input-mini, input.mini, textarea.mini, select.mini { + width: 60px; +} +.input-small, input.small, textarea.small, select.small { + width: 90px; +} +.input-medium, input.medium, textarea.medium, select.medium { + width: 150px; +} +.input-large, input.large, textarea.large, select.large { + width: 210px; +} +.input-xlarge, input.xlarge, textarea.xlarge, select.xlarge { + width: 270px; +} +.input-xxlarge, input.xxlarge, textarea.xxlarge, select.xxlarge { + width: 530px; +} +textarea.xxlarge { + overflow-y: scroll; +} - // Turn off focus for disabled (read-only) form elements - input[readonly]:focus, - textarea[readonly]:focus, - input.disabled { - background: #f5f5f5; - border-color: #ddd; - .box-shadow(none); - } +// Turn off focus for disabled (read-only) form elements +input[readonly]:focus, +textarea[readonly]:focus, +input.disabled { + background: #f5f5f5; + border-color: #ddd; + .box-shadow(none); } // Actions (the buttons) @@ -261,13 +263,11 @@ form { border-color: @green; } } - .input-prepend { .add-on { *margin-top: 1px; /* IE6-7 */ } } - .input-append { input[type=text] { float: left; @@ -320,7 +320,7 @@ form { } // Stacked forms -form.form-stacked { +.form-stacked { padding-left: 20px; fieldset { padding-top: @baseline / 2; @@ -364,4 +364,4 @@ form.form-stacked { margin-left: -20px; padding-left: 20px; } -} +}
\ No newline at end of file diff --git a/lib/patterns.less b/lib/patterns.less index fd728e6e7..0fbdc9d86 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -558,6 +558,7 @@ footer { .border-radius(0 0 6px 6px); .box-shadow(inset 0 1px 0 #fff); .clearfix(); + margin-bottom: 0; .btn { float: right; margin-left: 10px; diff --git a/lib/reset.less b/lib/reset.less index db1682202..28802f559 100644 --- a/lib/reset.less +++ b/lib/reset.less @@ -4,7 +4,7 @@ // ERIC MEYER RESET -// ---------------- +// -------------------------------------------------- html, body { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; } @@ -13,9 +13,133 @@ ol, ul { list-style: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } -// HTML5 -// ----- +// Normalize.css +// Pulling in select resets form the normalize.css project +// -------------------------------------------------- -header, section, footer, article, aside { +// Display in IE6-9 and FF3 +// ------------------------- +// Source: http://github.com/necolas/normalize.css +html { + overflow-y: scroll; + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +// Focus states +a:focus { + outline: thin dotted; +} + +// Display in IE6-9 and FF3 +// ------------------------- +// Source: http://github.com/necolas/normalize.css +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section { display: block; +} + +// Display block in IE6-9 and FF3 +// ------------------------- +// Source: http://github.com/necolas/normalize.css +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +// Prevents modern browsers from displaying 'audio' without controls +// ------------------------- +// Source: http://github.com/necolas/normalize.css +audio:not([controls]) { + display: none; +} + +// Prevents sub and sup affecting line-height in all browsers +// ------------------------- +// Source: http://github.com/necolas/normalize.css +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +sup { + top: -0.5em; +} +sub { + bottom: -0.25em; +} + +// Img border in a's and image quality +// ------------------------- +// Source: http://github.com/necolas/normalize.css +img { + border: 0; + -ms-interpolation-mode: bicubic; +} + +// Forms +// ------------------------- +// Source: http://github.com/necolas/normalize.css + +// Font size in all browsers, margin changes, misc consistency +button, +input, +select, +textarea { + font-size: 100%; + margin: 0; + vertical-align: baseline; + *vertical-align: middle; +} +button, +input { + line-height: normal; // FF3/4 have !important on line-height in UA stylesheet + *overflow: visible; // Inner spacing ie IE6/7 +} +button::-moz-focus-inner, +input::-moz-focus-inner { // Inner padding and border oddities in FF3/4 + border: 0; + padding: 0; +} +button, +input[type="button"], +input[type="reset"], +input[type="submit"] { + cursor: pointer; // Cursors on all buttons applied consistently + -webkit-appearance: button; // Style clicable inputs in iOS +} +input[type="search"] { // Appearance in Safari/Chrome + -webkit-appearance: textfield; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5 +} +textarea { + overflow: auto; // Remove vertical scrollbar in IE6-9 + vertical-align: top; // Readability and alignment cross-browser +} +// Tables +// ------------------------- +// Source: http://github.com/necolas/normalize.css + +// Remove spacing between table cells +table { + border-collapse: collapse; + border-spacing: 0; }
\ No newline at end of file diff --git a/lib/scaffolding.less b/lib/scaffolding.less index 50f6c96cf..137230672 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -152,6 +152,7 @@ a { background-image: none; .opacity(65); cursor: default; + .box-shadow(none); } // this can't be included with the .disabled def because IE8 and below will drop it ;_; @@ -159,10 +160,13 @@ a { background-image: none; .opacity(65); cursor: default; - color: #fff; + .box-shadow(none); + &.primary { + color: #fff; + } } &:active { - @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); + @shadow: inset 0 3px 7px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow); } } diff --git a/lib/type.less b/lib/type.less index 1091d149b..7ee69f2f5 100644 --- a/lib/type.less +++ b/lib/type.less @@ -130,7 +130,7 @@ em { line-height: inherit; } .muted { - color: @grayLighter; + color: @grayLight; } // Blockquotes @@ -181,5 +181,8 @@ pre { border: 1px solid #ccc; border: 1px solid rgba(0,0,0,.15); .border-radius(3px); + white-space: pre; white-space: pre-wrap; + word-wrap: break-word; + }
\ No newline at end of file |
