aboutsummaryrefslogtreecommitdiff
path: root/lib
diff options
context:
space:
mode:
Diffstat (limited to 'lib')
-rw-r--r--lib/bootstrap.less2
-rw-r--r--lib/forms.less306
-rw-r--r--lib/patterns.less202
-rw-r--r--lib/preboot.less82
-rw-r--r--lib/reset.less133
-rw-r--r--lib/scaffolding.less70
-rw-r--r--lib/type.less5
7 files changed, 515 insertions, 285 deletions
diff --git a/lib/bootstrap.less b/lib/bootstrap.less
index 6547f0397..aa0e24b96 100644
--- a/lib/bootstrap.less
+++ b/lib/bootstrap.less
@@ -1,5 +1,5 @@
/*!
- * Bootstrap v1.1.0
+ * Bootstrap v1.1.1
*
* Copyright 2011 Twitter, Inc
* Licensed under the Apache License v2.0
diff --git a/lib/forms.less b/lib/forms.less
index b38163f33..88ae08d8a 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)
@@ -262,13 +264,11 @@ form {
border-color: @green;
}
}
-
.input-prepend {
.add-on {
*margin-top: 1px; /* IE6-7 */
}
}
-
.input-append {
input[type=text],
input[type=password] {
@@ -322,7 +322,7 @@ form {
}
// Stacked forms
-form.form-stacked {
+.form-stacked {
padding-left: 20px;
fieldset {
padding-top: @baseline / 2;
diff --git a/lib/patterns.less b/lib/patterns.less
index 528e6ffdc..d0e4cda12 100644
--- a/lib/patterns.less
+++ b/lib/patterns.less
@@ -288,101 +288,168 @@ footer {
}
}
+// BUTTON STYLES
+// -------------
+
+
+// Base .btn styles
+.btn {
+ // Button Base
+ cursor: pointer;
+ display: inline-block;
+ #gradient > .vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%));
+ padding: 5px 14px 6px;
+ text-shadow: 0 1px 1px rgba(255,255,255,.75);
+ color: #333;
+ font-size: 13px;
+ line-height: normal;
+ border: 1px solid #ccc;
+ border-bottom-color: #bbb;
+ .border-radius(4px);
+ @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+ .box-shadow(@shadow);
+
+ &:hover {
+ background-position: 0 -15px;
+ color: #333;
+ text-decoration: none;
+ }
+
+ // Primary Button Type
+ &.primary {
+ color:#fff;
+ .gradientBar(@blue, @blueDark)
+ }
+
+ // Transitions
+ .transition(.1s linear all);
+
+ // Active and Disabled states
+ &.disabled {
+ cursor: default;
+ background-image: none;
+ .opacity(65);
+ }
+
+ &:disabled {
+ // disabled pseudo can't be included with .disabled
+ // def because IE8 and below will drop it ;_;
+ cursor: default;
+ background-image: none;
+ .opacity(65);
+ }
+
+ &:active {
+ @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05);
+ .box-shadow(@shadow);
+ }
+
+ // Button Sizes
+ &.large {
+ font-size: 16px;
+ line-height: normal;
+ padding: 9px 14px 9px;
+ .border-radius(6px);
+ }
+
+ &.small {
+ padding: 7px 9px 7px;
+ font-size: 11px;
+ }
+
+}
+
+// Help Firefox not be a jerk about adding extra padding to buttons
+button.btn,
+input[type=submit].btn {
+ &::-moz-focus-inner {
+ padding: 0;
+ border: 0;
+ }
+}
+
+
// ERROR STYLES
// ------------
-// One-liner alert bars
+// Base alert styles
.alert-message {
- // TODO: Ask cloudhead how to do this fancy filter elegantly. Less eval is returning strings with quotes ;_;
- #gradient > .vertical(transparent, rgba(0,0,0,0.15));
- filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#15000000')";
- background-color: @grayLighter;
+ .gradientBar(#fceec1, #eedc94); // warning by default
margin-bottom: @baseline;
- padding: 8px 15px;
- color: #fff;
- text-shadow: 0 -1px 0 rgba(0,0,0,.3);
- border-bottom: 1px solid rgba(0,0,0,.3);
+ padding: 7px 14px;
+ color: @grayDark;
+ text-shadow: 0 1px 0 rgba(255,255,255,.5);
+ border-width: 1px;
+ border-style: solid;
.border-radius(4px);
+ .box-shadow(inset 0 1px 0 rgba(255,255,255,.25));
+
+ // Remove extra margin from content
+ h5 {
+ line-height: @baseline;
+ }
p {
- color: #fff;
margin-bottom: 0;
- + p {
- margin-top: 5px;
- }
- }
- &.error {
- #gradient > .vertical(lighten(@red, 30%), lighten(@red, 15%));
- border-bottom-color: lighten(@red, 5%);
}
- &.warning {
- #gradient > .vertical(lighten(@yellow, 25%), lighten(@yellow, 10%));
- border-bottom-color: @yellow;
+ div {
+ margin-top: 5px;
+ margin-bottom: 2px;
+ line-height: 28px;
}
- &.success {
- #gradient > .vertical(lighten(@green, 25%), lighten(@green, 10%));
- border-bottom-color: @green;
- }
- &.info {
- #gradient > .vertical(lighten(@blue, 25%), lighten(@blue, 5%));
- border-bottom-color: @blue;
+ .btn {
+ // Provide actions with buttons
+ .box-shadow(0 1px 0 rgba(255,255,255,.25));
}
.close {
float: right;
margin-top: -2px;
- color: #000;
+ color: @black;
font-size: 20px;
font-weight: bold;
text-shadow: 0 1px 0 rgba(255,255,255,1);
.opacity(20);
&:hover {
+ color: @black;
text-decoration: none;
.opacity(40);
}
}
-}
-// Block-level Alerts
-.block-message {
- margin-bottom: @baseline;
- padding: 14px;
- color: @grayDark;
- color: rgba(0,0,0,.8);
- *color: @grayDark; /* IE 6-7 */
- text-shadow: 0 1px 0 rgba(255,255,255,.25);
- .border-radius(6px);
- p {
- color: @grayDark;
- color: rgba(0,0,0,.8);
- *color: @grayDark; /* IE 6-7 */
- margin-right: 30px;
- margin-bottom: 0;
- }
- ul {
- margin-bottom: 0;
- }
- strong {
- display: block;
- }
- &.error {
- background: lighten(@red, 55%);
- border: 1px solid lighten(@red, 50%);
- }
- &.warning {
- background: lighten(@yellow, 35%);
- border: 1px solid lighten(@yellow, 25%)
- }
- &.success {
- background: lighten(@green, 45%);
- border: 1px solid lighten(@green, 35%)
- }
- &.info {
- background: lighten(@blue, 45%);
- border: 1px solid lighten(@blue, 40%);
+ &.block-message {
+ background-image: none;
+ background-color: lighten(#fceec1, 5%);
+ padding: 14px;
+ border-color: #fceec1;
+ .box-shadow(none);
+
+ p {
+ margin-right: 30px;
+ }
+ .alert-actions {
+ margin-top: 5px;
+ }
+ &.error,
+ &.success,
+ &.info {
+ color: @grayDark;
+ text-shadow: 0 1px 0 rgba(255,255,255,.5);
+ }
+ &.error {
+ background-color: lighten(#f56a66, 25%);
+ border-color: lighten(#f56a66, 20%);
+ }
+ &.success {
+ background-color: lighten(#62c462, 30%);
+ border-color: lighten(#62c462, 25%);
+ }
+ &.info {
+ background-color: lighten(#6bd0ee, 25%);
+ border-color: lighten(#6bd0ee, 20%);
+ }
}
}
-
// NAVIGATION
// ----------
@@ -557,6 +624,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/preboot.less b/lib/preboot.less
index 370cbcdb8..75e75020b 100644
--- a/lib/preboot.less
+++ b/lib/preboot.less
@@ -36,6 +36,7 @@
@gridColumns: 16;
@gridColumnWidth: 40px;
@gridGutterWidth: 20px;
+@extraSpace: 40px;
@siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
// Color Scheme
@@ -125,21 +126,10 @@
.clearfix();
}
.columns(@columnSpan: 1) {
- float: left;
width: (@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1));
- margin-left: @gridGutterWidth;
- &:first-child {
- margin-left: 0;
- }
-}
-.offsetMath(@extraSpace: 40px) {
- margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @extraSpace !important;
}
.offset(@columnOffset: 1) {
- .offsetMath(40px);
- &:first-child {
- .offsetMath(20px);
- }
+ margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @extraSpace;
}
// Border Radius
@@ -180,28 +170,6 @@
column-gap: @columnGap;
}
-// Buttons
-// .button(@color: #fff, @padding: 4px 14px, @textColor: #333, @textShadow: 0 1px 1px rgba(255,255,255,.75), @fontSize: 13px, @borderColor: rgba(0,0,0,.1), @borderRadius: 4px) {
-// display: inline-block;
-// #gradient > .vertical-three-colors(@color, @color, 0.25, darken(@color, 10%));
-// padding: @padding;
-// text-shadow: @textShadow;
-// color: @textColor;
-// font-size: @fontSize;
-// line-height: @baseline;
-// border: 1px solid;
-// border-color: #ccc #ccc #bbb;
-// border-color: borderColor borderColor fadein(@borderColor, 15%);
-// .border-radius(@borderRadius);
-// @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-// .box-shadow(@shadow);
-// &:hover {
-// background-position: 0 -15px;
-// color: @textColor;
-// text-decoration: none;
-// }
-// }
-
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
#translucent {
.background(@color: @white, @alpha: 1) {
@@ -213,6 +181,42 @@
}
}
+// Gradient Bar Colors for buttons and allerts
+.gradientBar(@primaryColor, @secondaryColor) {
+ #gradient > .vertical(@primaryColor, @secondaryColor);
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+ border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
+ border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
+}
+// Shared colors for buttons and alerts
+.btn,
+.alert-message {
+ // Set text color
+ &.danger,
+ &.danger:hover,
+ &.error,
+ &.error:hover,
+ &.success,
+ &.success:hover,
+ &.info,
+ &.info:hover {
+ color: @white
+ }
+ // Danger and error appear as red
+ &.danger,
+ &.error {
+ .gradientBar(#ee5f5b, #c43c35);
+ }
+ // Success appears as green
+ &.success {
+ .gradientBar(#62c462, #57a957);
+ }
+ // Info appears as a neutral blue
+ &.info {
+ .gradientBar(#5bc0de, #339bb9);
+ }
+}
+
// Gradients
#gradient {
.horizontal (@startColor: #555, @endColor: #333) {
@@ -230,12 +234,12 @@
background-color: @endColor;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror
- background-image: -moz-linear-gradient(@startColor, @endColor); // FF 3.6+
- background-image: -ms-linear-gradient(@startColor, @endColor); // IE10
+ background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
+ background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
- background-image: -webkit-linear-gradient(@startColor, @endColor); // Safari 5.1+, Chrome 10+
- background-image: -o-linear-gradient(@startColor, @endColor); // Opera 11.10
- background-image: linear-gradient(@startColor, @endColor); // The standard
+ background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
+ background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
+ background-image: linear-gradient(top, @startColor, @endColor); // The standard
}
.directional (@startColor: #555, @endColor: #333, @deg: 45deg) {
background-color: @endColor;
diff --git a/lib/reset.less b/lib/reset.less
index db1682202..e79b77b40 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,134 @@ 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 bc6e0d1e3..d1b621c13 100644
--- a/lib/scaffolding.less
+++ b/lib/scaffolding.less
@@ -9,6 +9,29 @@
.row {
.clearfix();
+ margin-left: -20px;
+
+ // Default columns
+ .span1,
+ .span2,
+ .span3,
+ .span4,
+ .span5,
+ .span6,
+ .span7,
+ .span8,
+ .span9,
+ .span10,
+ .span11,
+ .span12,
+ .span13,
+ .span14,
+ .span15,
+ .span16 {
+ display: inline;
+ float: left;
+ margin-left: 20px;
+ }
// Default columns
.span1 { .columns(1); }
@@ -58,13 +81,13 @@ body {
}
// Container (centered, fixed-width layouts)
-div.container {
+.container {
width: 940px;
margin: 0 auto;
}
// Fluid layouts (left aligned, with sidebar, min- & max-width content)
-div.container-fluid {
+.container-fluid {
padding: 0 20px;
.clearfix();
.sidebar {
@@ -95,16 +118,7 @@ a {
}
// Buttons
-.btnColor(@primaryColor, @secondaryColor) {
- #gradient > .vertical(@primaryColor, @secondaryColor);
- text-shadow: 0 -1px 0 rgba(0,0,0,.25);
- border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
- border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
-}
-
.btn {
- // .button(#1174C6);
- cursor: pointer;
display: inline-block;
#gradient > .vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%));
padding: 4px 14px;
@@ -122,20 +136,31 @@ a {
color: #333;
text-decoration: none;
}
+}
+.primary {
+ #gradient > .vertical(#049CDB, #0064CD);
+ color: #fff;
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+ border: 1px solid darken(#0064CD, 10%);
+ border-bottom-color: darken(#0064CD, 15%);
+ &:hover {
+ color: #fff;
+ }
+}
+
+.btn {
+ //.button(#1174C6);
.transition(.1s linear all);
- &.primary,
- &.danger {
+ &.primary {
+ //#gradient > .vertical(@blue, @blueDark);
color: #fff;
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+ border-color: @blueDark @blueDark darken(@blueDark, 15%);
+ border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
&:hover {
color: #fff;
}
}
- &.primary {
- .btnColor(@blue, @blueDark)
- }
- &.danger {
- .btnColor(lighten(@red, 15%), @red)
- }
&.large {
font-size: 16px;
line-height: 28px;
@@ -150,6 +175,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 ;_;
@@ -157,9 +183,13 @@ a {
background-image: none;
.opacity(65);
cursor: default;
+ .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