Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Updated Less files from Bootstrap 2.1 branch

  • Loading branch information...
commit 252b7d8e8fc84db442796cd7760e28778b14f9d1 1 parent 5eee72b
@rachelbaker authored
Showing with 2,371 additions and 1,236 deletions.
  1. +3 −2 less/accordion.less
  2. +14 −10 less/alerts.less
  3. +1,677 −961 less/bootstrapwp.css
  4. +4 −2 less/breadcrumbs.less
  5. +49 −4 less/button-groups.less
  6. +3 −2 less/buttons.less
  7. +4 −2 less/carousel.less
  8. +4 −2 less/close.less
  9. +4 −3 less/code.less
  10. +4 −2 less/component-animations.less
  11. +36 −6 less/dropdowns.less
  12. +15 −8 less/forms.less
  13. +5 −0 less/grid.less
  14. +4 −2 less/hero-unit.less
  15. +4 −2 less/labels-badges.less
  16. +1 −2  less/layouts.less
  17. +114 −31 less/mixins.less
  18. +4 −2 less/modals.less
  19. +99 −8 less/navbar.less
  20. +28 −14 less/navs.less
  21. +4 −2 less/pager.less
  22. +14 −7 less/pagination.less
  23. +39 −24 less/popovers.less
  24. +3 −2 less/progress-bars.less
  25. +5 −3 less/reset.less
  26. +9 −7 less/responsive-1200px-min.less
  27. +70 −68 less/responsive-767px-max.less
  28. +7 −5 less/responsive-768px-979px.less
  29. +50 −4 less/responsive-navbar.less
  30. +14 −12 less/responsive-utilities.less
  31. +4 −4 less/responsive.less
  32. +2 −2 less/scaffolding.less
  33. +4 −3 less/sprites.less
  34. +12 −5 less/tables.less
  35. +5 −2 less/thumbnails.less
  36. +4 −2 less/tooltip.less
  37. +3 −4 less/type.less
  38. +4 −2 less/utilities.less
  39. +35 −8 less/variables.less
  40. +7 −5 less/wells.less
View
5 less/accordion.less
@@ -1,5 +1,6 @@
-// ACCORDION
-// ---------
+//
+// Accordion
+// --------------------------------------------------
// Parent container
View
24 less/alerts.less
@@ -1,7 +1,11 @@
-// ALERT STYLES
-// ------------
+//
+// Alerts
+// --------------------------------------------------
+
+
+// Base styles
+// -------------------------
-// Base alert styles
.alert {
padding: 8px 35px 8px 14px;
margin-bottom: @baseLineHeight;
@@ -11,24 +15,22 @@
.border-radius(4px);
color: @warningText;
}
-.alert-heading {
- color: inherit;
-}
// Adjust close link position
.alert .close {
position: relative;
top: -2px;
right: -21px;
- line-height: 18px;
+ line-height: @baseLineHeight;
}
+
// Alternate styles
-// ----------------
+// -------------------------
.alert-success {
background-color: @successBackground;
- border-color: @successBorder;
+ border-color: @successBorder;
color: @successText;
}
.alert-danger,
@@ -43,8 +45,10 @@
color: @infoText;
}
+
// Block alerts
-// ------------------------
+// -------------------------
+
.alert-block {
padding-top: 14px;
padding-bottom: 14px;
View
2,638 less/bootstrapwp.css
1,677 additions, 961 deletions not shown
View
6 less/breadcrumbs.less
@@ -1,5 +1,7 @@
-// BREADCRUMBS
-// -----------
+//
+// Breadcrumbs
+// --------------------------------------------------
+
.breadcrumb {
padding: 7px 14px;
View
53 less/button-groups.less
@@ -1,11 +1,13 @@
-// BUTTON GROUPS
-// -------------
+//
+// Button groups
+// --------------------------------------------------
// Make the div behave like a button
.btn-group {
position: relative;
- .clearfix(); // clears the floated buttons
+ font-size: 0; // remove as part 1 of font-size inline-block hack
+ white-space: nowrap; // prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page)
.ie7-restore-left-whitespace();
}
@@ -27,10 +29,23 @@
// Float them, remove border radius, then re-add to first and last elements
.btn-group > .btn {
position: relative;
- float: left;
margin-left: -1px;
.border-radius(0);
}
+.btn-group > .btn,
+.btn-group > .dropdown-menu {
+ font-size: @baseFontSize; // redeclare as part 2 of font-size inline-block hack
+}
+
+// Reset fonts for other sizes
+.btn-group > .btn-mini,
+.btn-group > .btn-small {
+ font-size: @baseFontSize - 2px;
+}
+.btn-group > .btn-large {
+ font-size: @baseFontSize + 2px;
+}
+
// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
.btn-group > .btn:first-child {
margin-left: 0;
@@ -189,3 +204,33 @@
}
}
+
+
+// Vertical button groups
+// ----------------------
+
+.btn-group-vertical {
+ display: inline-block; // makes buttons only take up the width they need
+}
+.btn-group-vertical .btn {
+ display: block;
+ float: none;
+ margin-left: 0;
+ width: 100%;
+ .border-radius(0);
+}
+.btn-group-vertical .btn + .btn {
+ margin-top: -1px;
+}
+.btn-group-vertical .btn:first-child {
+ .border-radius(4px 4px 0 0);
+}
+.btn-group-vertical .btn:last-child {
+ .border-radius(0 0 4px 4px);
+}
+.btn-group-vertical .btn-large:first-child {
+ .border-radius(6px 6px 0 0);
+}
+.btn-group-vertical .btn-large:last-child {
+ .border-radius(0 0 6px 6px);
+}
View
5 less/buttons.less
@@ -1,5 +1,6 @@
-// BUTTON STYLES
-// -------------
+//
+// Buttons
+// --------------------------------------------------
// Base styles
View
6 less/carousel.less
@@ -1,5 +1,7 @@
-// CAROUSEL
-// --------
+//
+// Carousel
+// --------------------------------------------------
+
.carousel {
position: relative;
View
6 less/close.less
@@ -1,5 +1,7 @@
-// CLOSE ICONS
-// -----------
+//
+// Close icons
+// --------------------------------------------------
+
.close {
float: right;
View
7 less/code.less
@@ -1,6 +1,7 @@
-// Code.less
-// Code typography styles for the <code> and <pre> elements
-// --------------------------------------------------------
+//
+// Code (inline and blocK)
+// --------------------------------------------------
+
// Inline and block code styles
code,
View
6 less/component-animations.less
@@ -1,5 +1,7 @@
-// COMPONENT ANIMATIONS
-// --------------------
+//
+// Component animations
+// --------------------------------------------------
+
.fade {
opacity: 0;
View
42 less/dropdowns.less
@@ -1,5 +1,7 @@
-// DROPDOWN MENUS
-// --------------
+//
+// Dropdown menus
+// --------------------------------------------------
+
// Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
.dropup,
@@ -34,11 +36,16 @@
margin-top: 8px;
margin-left: 2px;
}
-.dropdown:hover .caret,
+.dropdown a:focus .caret,
+.dropdown a:hover .caret,
.open .caret {
.opacity(100);
}
+.navbar .nav .open > a {
+ color: @navbarLinkColorActive;
+}
+
// The dropdown menu (ul)
// ----------------------
.dropdown-menu {
@@ -49,7 +56,7 @@
display: none; // none by default, but block on "open" of the menu
float: left;
min-width: 160px;
- padding: 4px 0;
+ padding: 5px 0;
margin: 1px 0 0; // override default ul
list-style: none;
background-color: @dropdownBackground;
@@ -57,7 +64,7 @@
border: 1px solid rgba(0,0,0,.2);
*border-right-width: 2px;
*border-bottom-width: 2px;
- .border-radius(5px);
+ .border-radius(6px);
.box-shadow(0 5px 10px rgba(0,0,0,.2));
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
@@ -89,11 +96,34 @@
// Hover state
// -----------
.dropdown-menu li > a:hover,
+.dropdown-menu li > a:focus {
+ text-decoration: none;
+ color: @dropdownLinkColorActive;
+ background-color: @dropdownLinkBackgroundHover;
+}
+
+// Active state
+// ------------
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover {
color: @dropdownLinkColorHover;
text-decoration: none;
- background-color: @dropdownLinkBackgroundHover;
+ background-color: @dropdownLinkBackgroundActive;
+ outline: 0;
+}
+
+// Disabled state
+// --------------
+// Gray out text and ensure the hover state remains gray
+.dropdown-menu .disabled > a,
+.dropdown-menu .disabled > a:hover {
+ color: @grayLight;
+}
+// Nuke hover effects
+.dropdown-menu .disabled > a:hover {
+ text-decoration: none;
+ background-color: transparent;
+ cursor: default;
}
// Open state for the dropdown
View
23 less/forms.less
@@ -1,6 +1,6 @@
-// Forms.less
-// Base styles for various input types, form layouts, and states
-// -------------------------------------------------------------
+//
+// Forms
+// --------------------------------------------------
// GENERAL STYLES
@@ -85,6 +85,7 @@ input[type="color"],
font-size: @baseFontSize;
line-height: @baseLineHeight;
color: @gray;
+ .border-radius(@inputBorderRadius);
}
// Reset appearance properties for textual inputs and textarea
@@ -116,7 +117,6 @@ input[type="color"],
.uneditable-input {
background-color: @inputBackground;
border: 1px solid @inputBorder;
- .border-radius(@inputBorderRadius);
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
@transition: border linear .2s, box-shadow linear .2s;
.transition(@transition);
@@ -139,7 +139,8 @@ input[type="checkbox"] {
cursor: pointer;
}
-// Reset width of input buttons, radios, checkboxes
+// Reset width of input images, buttons, radios, checkboxes
+input[type="image"],
input[type="submit"],
input[type="reset"],
input[type="button"],
@@ -343,7 +344,10 @@ select:focus:required:invalid {
}
// Placeholder text gets special styles; can't be bundled together though for some reason
-.placeholder();
+input,
+textarea {
+ .placeholder();
+}
@@ -352,7 +356,7 @@ select:focus:required:invalid {
.help-block,
.help-inline {
- color: @gray; // lighten the text some for contrast
+ color: lighten(@textColor, 15%); // lighten the text some for contrast
}
.help-block {
@@ -376,12 +380,14 @@ select:focus:required:invalid {
.input-prepend,
.input-append {
margin-bottom: 5px;
+ font-size: 0;
input,
select,
.uneditable-input {
position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
*margin-left: 0;
+ font-size: @baseFontSize;
vertical-align: middle;
.border-radius(0 @inputBorderRadius @inputBorderRadius 0);
// Make input on top when focused so blue border and shadow always show
@@ -398,6 +404,7 @@ select:focus:required:invalid {
height: @baseLineHeight;
min-width: 16px;
padding: 4px 5px;
+ font-size: @baseFontSize;
font-weight: normal;
line-height: @baseLineHeight;
text-align: center;
@@ -465,7 +472,7 @@ select:focus:required:invalid {
// SEARCH FORM
// -----------
-.search-query {
+input.search-query {
padding-right: 14px;
padding-right: 4px \9;
padding-left: 14px;
View
5 less/grid.less
@@ -1,3 +1,8 @@
+//
+// Grid system
+// --------------------------------------------------
+
+
// Fixed (940px)
#grid > .core(@gridColumnWidth, @gridGutterWidth);
View
6 less/hero-unit.less
@@ -1,5 +1,7 @@
-// HERO UNIT
-// ---------
+//
+// Hero unit
+// --------------------------------------------------
+
.hero-unit {
padding: 60px;
View
6 less/labels-badges.less
@@ -1,5 +1,7 @@
-// LABELS & BADGES
-// ---------------
+//
+// Labels and badges
+// --------------------------------------------------
+
// Base classes
.label,
View
3  less/layouts.less
@@ -1,7 +1,6 @@
//
// Layouts
-// Fixed-width and fluid (with sidebar) layouts
-// --------------------------------------------
+// --------------------------------------------------
// Container (centered, fixed-width layouts)
View
145 less/mixins.less
@@ -1,6 +1,6 @@
-// Mixins.less
-// Snippets of reusable CSS to develop faster and keep code readable
-// -----------------------------------------------------------------
+//
+// Mixins
+// --------------------------------------------------
// UTILITY MIXINS
@@ -15,6 +15,9 @@
&:after {
display: table;
content: "";
+ // Fixes Opera/contenteditable bug:
+ // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952
+ line-height: 0;
}
&:after {
clear: both;
@@ -202,6 +205,46 @@
border-radius: @radius;
}
+// Single Corner Border Radius
+.border-top-left-radius(@radius) {
+ -webkit-border-top-left-radius: @radius;
+ -moz-border-radius-topleft: @radius;
+ border-top-left-radius: @radius;
+}
+.border-top-right-radius(@radius) {
+ -webkit-border-top-right-radius: @radius;
+ -moz-border-radius-topright: @radius;
+ border-top-right-radius: @radius;
+}
+.border-bottom-right-radius(@radius) {
+ -webkit-border-bottom-right-radius: @radius;
+ -moz-border-radius-bottomright: @radius;
+ border-bottom-right-radius: @radius;
+}
+.border-bottom-left-radius(@radius) {
+ -webkit-border-bottom-left-radius: @radius;
+ -moz-border-radius-bottomleft: @radius;
+ border-bottom-left-radius: @radius;
+}
+
+// Single Side Border Radius
+.border-top-radius(@radius) {
+ .border-top-right-radius(@radius);
+ .border-top-left-radius(@radius);
+}
+.border-right-radius(@radius) {
+ .border-top-right-radius(@radius);
+ .border-bottom-right-radius(@radius);
+}
+.border-bottom-radius(@radius) {
+ .border-bottom-right-radius(@radius);
+ .border-bottom-left-radius(@radius);
+}
+.border-left-radius(@radius) {
+ .border-top-left-radius(@radius);
+ .border-bottom-left-radius(@radius);
+}
+
// Drop shadows
.box-shadow(@shadow) {
-webkit-box-shadow: @shadow;
@@ -213,7 +256,6 @@
.transition(@transition) {
-webkit-transition: @transition;
-moz-transition: @transition;
- -ms-transition: @transition;
-o-transition: @transition;
transition: @transition;
}
@@ -250,7 +292,6 @@
.translate3d(@x, @y, @z) {
-webkit-transform: translate(@x, @y, @z);
-moz-transform: translate(@x, @y, @z);
- -ms-transform: translate(@x, @y, @z);
-o-transform: translate(@x, @y, @z);
transform: translate(@x, @y, @z);
}
@@ -262,7 +303,6 @@
.backface-visibility(@visibility){
-webkit-backface-visibility: @visibility;
-moz-backface-visibility: @visibility;
- -ms-backface-visibility: @visibility;
backface-visibility: @visibility;
}
@@ -287,7 +327,6 @@
.box-sizing(@boxmodel) {
-webkit-box-sizing: @boxmodel;
-moz-box-sizing: @boxmodel;
- -ms-box-sizing: @boxmodel;
box-sizing: @boxmodel;
}
@@ -361,60 +400,54 @@
.horizontal(@startColor: #555, @endColor: #333) {
background-color: @endColor;
background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
- background-image: -ms-linear-gradient(left, @startColor, @endColor); // IE10
background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
- background-image: linear-gradient(left, @startColor, @endColor); // Le standard
+ background-image: linear-gradient(left, @startColor, @endColor); // Le standard, IE10
background-repeat: repeat-x;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down
}
.vertical(@startColor: #555, @endColor: #333) {
background-color: mix(@startColor, @endColor, 60%);
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, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
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
+ background-image: linear-gradient(top, @startColor, @endColor); // The standard, IE10
background-repeat: repeat-x;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down
}
.directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
background-color: @endColor;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
- background-image: -ms-linear-gradient(@deg, @startColor, @endColor); // IE10
background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
- background-image: linear-gradient(@deg, @startColor, @endColor); // The standard
+ background-image: linear-gradient(@deg, @startColor, @endColor); // The standard, IE10
}
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
background-color: mix(@midColor, @endColor, 80%);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
- background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-repeat: no-repeat;
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
}
.radial(@innerColor: #555, @outerColor: #333) {
background-color: @outerColor;
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
- background-image: -ms-radial-gradient(circle, @innerColor, @outerColor);
background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
background-repeat: no-repeat;
}
- .striped(@color, @angle: -45deg) {
+ .striped(@color, @angle: 45deg) {
background-color: @color;
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
- background-image: -ms-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
@@ -479,37 +512,69 @@
// -------------------------
// For tipsies and popovers
#popoverArrow {
- .top(@arrowWidth: 5px, @color: @black) {
- bottom: 0;
+ .top(@arrowWidth: 10px, @color: rgba(0,0,0,.2)) {
+ bottom: -@arrowWidth;
left: 50%;
margin-left: -@arrowWidth;
border-left: @arrowWidth solid transparent;
border-right: @arrowWidth solid transparent;
+ border-top: @arrowWidth solid #ccc;
border-top: @arrowWidth solid @color;
+ &:after {
+ border-left: @arrowWidth - 1 solid transparent;
+ border-right: @arrowWidth - 1 solid transparent;
+ border-top: @arrowWidth - 1 solid #fff;
+ bottom: 1px;
+ left: -@arrowWidth + 1;
+ }
}
- .left(@arrowWidth: 5px, @color: @black) {
+ .right(@arrowWidth: 10px, @color: rgba(0,0,0,.2)) {
top: 50%;
- right: 0;
+ left: -@arrowWidth;
margin-top: -@arrowWidth;
border-top: @arrowWidth solid transparent;
border-bottom: @arrowWidth solid transparent;
- border-left: @arrowWidth solid @color;
+ border-right: @arrowWidth solid #ccc;
+ border-right: @arrowWidth solid @color;
+ &:after {
+ border-top: @arrowWidth - 1 solid transparent;
+ border-bottom: @arrowWidth - 1 solid transparent;
+ border-right: @arrowWidth - 1 solid #fff;
+ bottom: -@arrowWidth + 1;
+ left: 1px;
+ }
}
- .bottom(@arrowWidth: 5px, @color: @black) {
- top: 0;
+ .bottom(@arrowWidth: 10px, @color: rgba(0,0,0,.2)) {
+ top: -@arrowWidth;
left: 50%;
margin-left: -@arrowWidth;
border-left: @arrowWidth solid transparent;
border-right: @arrowWidth solid transparent;
+ border-bottom: @arrowWidth solid #ccc;
border-bottom: @arrowWidth solid @color;
+ &:after {
+ border-left: @arrowWidth - 1 solid transparent;
+ border-right: @arrowWidth - 1 solid transparent;
+ border-bottom: @arrowWidth - 1 solid #f5f5f5;
+ top: 1px;
+ left: -@arrowWidth + 1;
+ }
}
- .right(@arrowWidth: 5px, @color: @black) {
+ .left(@arrowWidth: 10px, @color: rgba(0,0,0,.2)) {
top: 50%;
- left: 0;
+ right: -@arrowWidth;
margin-top: -@arrowWidth;
border-top: @arrowWidth solid transparent;
border-bottom: @arrowWidth solid transparent;
- border-right: @arrowWidth solid @color;
+ border-left: @arrowWidth solid #ccc;
+ border-left: @arrowWidth solid @color;
+ &:after {
+ border-top: @arrowWidth - 1 solid transparent;
+ border-bottom: @arrowWidth - 1 solid transparent;
+ border-left: @arrowWidth - 1 solid #fff;
+ bottom: -@arrowWidth + 1;
+ right: 1px;
+ }
}
}
@@ -596,6 +661,23 @@
}
.spanX (0) {}
+ .offsetX (@index) when (@index > 0) {
+ (~'.offset@{index}') { .offset(@index); }
+ (~'.offset@{index}:first-child') { .offsetFirstChild(@index); }
+ .offsetX(@index - 1);
+ }
+ .offsetX (0) {}
+
+ .offset (@columns) {
+ margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2);
+ *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%);
+ }
+
+ .offsetFirstChild (@columns) {
+ margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth);
+ *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
+ }
+
.span (@columns) {
width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
*width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
@@ -614,8 +696,9 @@
margin-left: 0;
}
- // generate .spanX
+ // generate .spanX and .offsetX
.spanX (@gridColumns);
+ .offsetX (@gridColumns);
}
}
View
6 less/modals.less
@@ -1,5 +1,7 @@
-// MODALS
-// ------
+//
+// Modals
+// --------------------------------------------------
+
// Recalculate z-index where appropriate
.modal-open {
View
107 less/navbar.less
@@ -1,5 +1,6 @@
-// NAVBAR (FIXED AND STATIC)
-// -------------------------
+//
+// Navbars
+// --------------------------------------------------
// COMMON STYLES
@@ -14,7 +15,7 @@
margin-bottom: @baseLineHeight;
}
-// Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
+// Gradient is applied to its own element because overflow visible is not honored by IE when filter is present
.navbar-inner {
min-height: @navbarHeight;
padding-left: 20px;
@@ -168,11 +169,17 @@
// Fixed to top
.navbar-fixed-top {
top: 0;
+ -webkit-box-shadow: 0 1px 10px rgba(0,0,0,.1);
+ -moz-box-shadow: 0 1px 10px rgba(0,0,0,.1);
+ box-shadow: 0 1px 10px rgba(0,0,0,.1);
}
// Fixed to bottom
.navbar-fixed-bottom {
bottom: 0;
+ -webkit-box-shadow: 0 -1px 10px rgba(0,0,0,.1);
+ -moz-box-shadow: 0 -1px 10px rgba(0,0,0,.1);
+ box-shadow: 0 -1px 10px rgba(0,0,0,.1);
}
@@ -191,7 +198,6 @@
float: right; // redeclare due to specificity
}
.navbar .nav > li {
- display: block;
float: left;
}
@@ -200,12 +206,16 @@
float: none;
// Vertically center the text given @navbarHeight
@elementHeight: 20px;
- padding: ((@navbarHeight - @elementHeight) / 2 - 1) 10px ((@navbarHeight - @elementHeight) / 2 + 1);
+ padding: ((@navbarHeight - @elementHeight) / 2) 12px ((@navbarHeight - @elementHeight) / 2 + 1);
line-height: 19px;
color: @navbarLinkColor;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
+.navbar .nav .dropdown-toggle .caret {
+ margin-top: 8px;
+}
+
// Buttons
.navbar .btn {
display: inline-block;
@@ -222,6 +232,7 @@
padding: ((@navbarHeight - @elementHeight) / 2 - 1) 5px ((@navbarHeight - @elementHeight) / 2);
}
// Hover
+.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover {
background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
color: @navbarLinkColorHover;
@@ -230,7 +241,8 @@
// Active nav items
.navbar .nav .active > a,
-.navbar .nav .active > a:hover {
+.navbar .nav .active > a:hover,
+.navbar .nav .active > a:focus {
color: @navbarLinkColorActive;
text-decoration: none;
background-color: @navbarLinkBackgroundActive;
@@ -260,7 +272,7 @@
padding: 7px 10px;
margin-left: 5px;
margin-right: 5px;
- .buttonBackground(@navbarBackgroundHighlight, @navbarBackground);
+ .buttonBackground(darken(@navbarBackgroundHighlight, 5%), darken(@navbarBackground, 5%));
.box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)");
}
.navbar .btn-navbar .icon-bar {
@@ -337,6 +349,7 @@
}
// Dropdown link on hover
+.navbar .nav li.dropdown.active > .dropdown-toggle:focus,
.navbar .nav li.dropdown.active > .dropdown-toggle:hover {
color: @white;
}
@@ -355,4 +368,82 @@
left: auto;
right: 13px;
}
-}
+}
+
+
+/* Subnav navbar
+-------------------------------------------------- */
+// In the future, we may make two options available for the navbar:
+// a default state, the lighter one, and the darker one as an option
+// to enable. This would prevent some overriding back to defaults.
+
+
+// Override the default .navbar
+.navbar-subnav {
+}
+.navbar-subnav .navbar-inner {
+ padding: 0;
+ #gradient > .vertical(#f9f9f9, #f1f1f1);
+ .box-shadow(none);
+ border: 1px solid #e5e5e5;
+}
+
+// Change link colors back
+.navbar-subnav .nav > li > a {
+ color: @linkColor;
+ text-shadow: 0 1px 0 rgba(255,255,255,.5);
+}
+.navbar-subnav .nav > li > a:hover {
+ color: @linkColorHover;
+}
+
+// Active nav links
+.navbar-subnav .nav > .active > a,
+.navbar-subnav .nav > .active > a:hover {
+ color: #777;
+ background-color: #e5e5e5;
+}
+
+// Dropdown carets
+.navbar-subnav .nav li.dropdown .dropdown-toggle .caret,
+.navbar-subnav .nav li.dropdown.open .caret {
+ border-top-color: @linkColor;
+ border-bottom-color: @linkColor;
+}
+
+// Open dropdown dropdown-toggle
+.navbar-subnav .nav .open > a {
+ color: @linkColorHover;
+}
+
+// Fixed subnav on scroll, but only for 980px and up (sorry IE!)
+.navbar-subnav-fixed {
+ position: fixed;
+ top: 40px;
+ left: 0;
+ right: 0;
+ z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
+ -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
+ -moz-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
+ box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
+}
+.navbar-subnav-fixed .navbar-inner {
+ border-color: #d5d5d5;
+ border-width: 0 0 1px; /* drop the border on the fixed edges */
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
+ .border-radius(0);
+}
+.navbar-subnav-fixed .nav {
+ float: none;
+ max-width: 970px;
+ margin: 0 auto;
+ padding: 0 1px;
+}
+.navbar-subnav .nav > li:first-child > a,
+.navbar-subnav .nav > li:first-child > a:hover {
+ -webkit-border-radius: 0;
+ -moz-border-radius: 0;
+ border-radius: 0;
+}
+
+
View
42 less/navs.less
@@ -1,6 +1,6 @@
-// NAVIGATIONS
-// -----------
-
+//
+// Navs
+// --------------------------------------------------
// BASE CLASS
@@ -43,6 +43,7 @@
}
+
// NAV LIST
// --------
@@ -194,39 +195,36 @@
// ---------
.nav-tabs .dropdown-menu {
- .border-radius(0 0 5px 5px); // remove the top rounded corners here since there is a hard edge above the menu
+ .border-radius(0 0 6px 6px); // remove the top rounded corners here since there is a hard edge above the menu
}
.nav-pills .dropdown-menu {
- .border-radius(4px); // make rounded corners match the pills
+ .border-radius(6px); // make rounded corners match the pills
}
// Default dropdown links
// -------------------------
// Make carets use linkColor to start
-.nav-tabs .dropdown-toggle .caret,
-.nav-pills .dropdown-toggle .caret {
+.nav .dropdown-toggle .caret {
border-top-color: @linkColor;
border-bottom-color: @linkColor;
margin-top: 6px;
}
-.nav-tabs .dropdown-toggle:hover .caret,
-.nav-pills .dropdown-toggle:hover .caret {
+.nav .dropdown-toggle:hover .caret {
border-top-color: @linkColorHover;
border-bottom-color: @linkColorHover;
}
// Active dropdown links
// -------------------------
-.nav-tabs .active .dropdown-toggle .caret,
-.nav-pills .active .dropdown-toggle .caret {
- border-top-color: @grayDark;
- border-bottom-color: @grayDark;
+.nav .active .dropdown-toggle .caret {
+ border-top-color: #fff;
+ border-bottom-color: #fff;
}
// Active:hover dropdown links
// -------------------------
.nav > .dropdown.active > a:hover {
- color: @black;
+ color: #fff;
cursor: pointer;
}
@@ -361,3 +359,19 @@
border-color: #ddd #ddd #ddd transparent;
*border-left-color: @white;
}
+
+
+
+// DISABLED STATES
+// ---------------
+
+// Gray out text
+.nav > .disabled > a {
+ color: @grayLight;
+}
+// Nuke hover effects
+.nav > .disabled > a:hover {
+ text-decoration: none;
+ background-color: transparent;
+ cursor: default;
+}
View
6 less/pager.less
@@ -1,5 +1,7 @@
-// PAGER
-// -----
+//
+// Pager pagination
+// --------------------------------------------------
+
.pager {
margin-left: 0;
View
21 less/pagination.less
@@ -1,5 +1,7 @@
-// PAGINATION
-// ----------
+//
+// Pagination (multiple pages)
+// --------------------------------------------------
+
.pagination {
height: @baseLineHeight * 2;
@@ -16,7 +18,8 @@
.pagination li {
display: inline;
}
-.pagination a {
+.pagination a,
+.pagination span {
float: left;
padding: 0 14px;
line-height: (@baseLineHeight * 2) - 2;
@@ -25,10 +28,12 @@
border-left-width: 0;
}
.pagination a:hover,
-.pagination .active a {
+.pagination .active a,
+.pagination .active span {
background-color: #f5f5f5;
}
-.pagination .active a {
+.pagination .active a,
+.pagination .active span {
color: @grayLight;
cursor: default;
}
@@ -39,11 +44,13 @@
background-color: transparent;
cursor: default;
}
-.pagination li:first-child a {
+.pagination li:first-child a,
+.pagination li:first-child span {
border-left-width: 1px;
.border-radius(3px 0 0 3px);
}
-.pagination li:last-child a {
+.pagination li:last-child a,
+.pagination li:last-child span {
.border-radius(0 3px 3px 0);
}
View
63 less/popovers.less
@@ -1,5 +1,7 @@
-// POPOVERS
-// --------
+//
+// Popovers
+// --------------------------------------------------
+
.popover {
position: absolute;
@@ -7,42 +9,55 @@
left: 0;
z-index: @zindexPopover;
display: none;
- padding: 5px;
- &.top { margin-top: -5px; }
- &.right { margin-left: 5px; }
- &.bottom { margin-top: 5px; }
- &.left { margin-left: -5px; }
+ width: 218px;
+ background-color: #fff;
+ -webkit-background-clip: padding-box;
+ -moz-background-clip: padding;
+ background-clip: padding-box;
+ border: 1px solid #ccc;
+ border: 1px solid rgba(0,0,0,.2);
+ .border-radius(6px);
+ .box-shadow(0 5px 10px rgba(0,0,0,.2));
+
+ // Offset the popover to account for the popover arrow
+ &.top { margin-bottom: 10px; }
+ &.right { margin-left: 10px; }
+ &.bottom { margin-top: 10px; }
+ &.left { margin-right: 10px; }
+
+ // Call the mixin for the arrows
&.top .arrow { #popoverArrow > .top(); }
&.right .arrow { #popoverArrow > .right(); }
&.bottom .arrow { #popoverArrow > .bottom(); }
&.left .arrow { #popoverArrow > .left(); }
+
+ // Common arrow styles
.arrow {
position: absolute;
width: 0;
height: 0;
+ &:after {
+ position: absolute;
+ display: inline-block;
+ width: 0;
+ height: 0;
+ content: "";
+ }
}
}
-.popover-inner {
- padding: 3px;
- width: 280px;
- overflow: hidden;
- background: @black; // has to be full background declaration for IE fallback
- background: rgba(0,0,0,.8);
- .border-radius(6px);
- .box-shadow(0 3px 7px rgba(0,0,0,0.3));
-}
+
.popover-title {
- padding: 9px 15px;
- line-height: 1;
+ padding: 8px 14px;
+ font-size: 14px;
+ font-weight: normal;
+ line-height: 18px;
background-color: #f5f5f5;
- border-bottom:1px solid #eee;
- .border-radius(3px 3px 0 0);
+ border-bottom: 1px solid #e5e5e5;
+ .border-radius(5px 5px 0 0);
}
+
.popover-content {
- padding: 14px;
- background-color: @white;
- .border-radius(0 0 3px 3px);
- .background-clip(padding-box);
+ padding: 9px 14px;
p, ul, ol {
margin-bottom: 0;
}
View
5 less/progress-bars.less
@@ -1,5 +1,6 @@
-// PROGRESS BARS
-// -------------
+//
+// Progress bars
+// --------------------------------------------------
// ANIMATIONS
View
8 less/reset.less
@@ -1,6 +1,8 @@
-// Reset.less
-// Adapted from Normalize.css http://github.com/necolas/normalize.css
-// ------------------------------------------------------------------------
+//
+// Modals
+// Adapted from http://github.com/necolas/normalize.css
+// --------------------------------------------------
+
// Display in IE6-9 and FF3
// -------------------------
View
16 less/responsive-1200px-min.less
@@ -1,23 +1,25 @@
-// LARGE DESKTOP & UP
-// ------------------
+//
+// Responsive: Large desktop and up
+// --------------------------------------------------
+
@media (min-width: 1200px) {
// Fixed grid
- #grid > .core(70px, 30px);
+ #grid > .core(@gridColumnWidth1200, @gridGutterWidth1200);
// Fluid grid
- #grid > .fluid(5.982905983%, 2.564102564%);
+ #grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200);
// Input grid
- #grid > .input(70px, 30px);
+ #grid > .input(@gridColumnWidth1200, @gridGutterWidth1200);
// Thumbnails
.thumbnails {
- margin-left: -30px;
+ margin-left: -@gridGutterWidth1200;
}
.thumbnails > li {
- margin-left: 30px;
+ margin-left: @gridGutterWidth1200;
}
.row-fluid .thumbnails {
margin-left: 0;
View
138 less/responsive-767px-max.less
@@ -1,73 +1,8 @@
-// UP TO LANDSCAPE PHONE
-// ---------------------
-
-@media (max-width: 480px) {
-
- // Smooth out the collapsing/expanding nav
- .nav-collapse {
- -webkit-transform: translate3d(0, 0, 0); // activate the GPU
- }
-
- // Block level the page header small tag for readability
- .page-header h1 small {
- display: block;
- line-height: @baseLineHeight;
- }
-
- // Update checkboxes for iOS
- input[type="checkbox"],
- input[type="radio"] {
- border: 1px solid #ccc;
- }
-
- // Remove the horizontal form styles
- .form-horizontal .control-group > label {
- float: none;
- width: auto;
- padding-top: 0;
- text-align: left;
- }
- // Move over all input controls and content
- .form-horizontal .controls {
- margin-left: 0;
- }
- // Move the options list down to align with labels
- .form-horizontal .control-list {
- padding-top: 0; // has to be padding because margin collaspes
- }
- // Move over buttons in .form-actions to align with .controls
- .form-horizontal .form-actions {
- padding-left: 10px;
- padding-right: 10px;
- }
-
- // Modals
- .modal {
- position: absolute;
- top: 10px;
- left: 10px;
- right: 10px;
- width: auto;
- margin: 0;
- &.fade.in { top: auto; }
- }
- .modal-header .close {
- padding: 10px;
- margin: -10px;
- }
-
- // Carousel
- .carousel-caption {
- position: static;
- }
-
-}
-
-
-
-// LANDSCAPE PHONE TO SMALL DESKTOP & PORTRAIT TABLET
+//
+// Responsive: Landscape phone to desktop/tablet
// --------------------------------------------------
+
@media (max-width: 767px) {
// Padding to set content in a bit
@@ -147,3 +82,70 @@
}
}
+
+
+
+// UP TO LANDSCAPE PHONE
+// ---------------------
+
+@media (max-width: 480px) {
+
+ // Smooth out the collapsing/expanding nav
+ .nav-collapse {
+ -webkit-transform: translate3d(0, 0, 0); // activate the GPU
+ }
+
+ // Block level the page header small tag for readability
+ .page-header h1 small {
+ display: block;
+ line-height: @baseLineHeight;
+ }
+
+ // Update checkboxes for iOS
+ input[type="checkbox"],
+ input[type="radio"] {
+ border: 1px solid #ccc;
+ }
+
+ // Remove the horizontal form styles
+ .form-horizontal .control-group > label {
+ float: none;
+ width: auto;
+ padding-top: 0;
+ text-align: left;
+ }
+ // Move over all input controls and content
+ .form-horizontal .controls {
+ margin-left: 0;
+ }
+ // Move the options list down to align with labels
+ .form-horizontal .control-list {
+ padding-top: 0; // has to be padding because margin collaspes
+ }
+ // Move over buttons in .form-actions to align with .controls
+ .form-horizontal .form-actions {
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ // Modals
+ .modal {
+ position: fixed;
+ top: 10px;
+ left: 10px;
+ right: 10px;
+ width: auto;
+ margin: 0;
+ &.fade.in { top: auto; }
+ }
+ .modal-header .close {
+ padding: 10px;
+ margin: -10px;
+ }
+
+ // Carousel
+ .carousel-caption {
+ position: static;
+ }
+
+}
View
12 less/responsive-768px-979px.less
@@ -1,16 +1,18 @@
-// PORTRAIT TABLET TO DEFAULT DESKTOP
-// ----------------------------------
+//
+// Responsive: Tablet to desktop
+// --------------------------------------------------
+
@media (min-width: 768px) and (max-width: 979px) {
// Fixed grid
- #grid > .core(42px, 20px);
+ #grid > .core(@gridColumnWidth768, @gridGutterWidth768);
// Fluid grid
- #grid > .fluid(5.801104972%, 2.762430939%);
+ #grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);
// Input grid
- #grid > .input(42px, 20px);
+ #grid > .input(@gridColumnWidth768, @gridGutterWidth768);
// No need to reset .thumbnails here since it's the same @gridGutterWidth
View
54 less/responsive-navbar.less
@@ -1,3 +1,8 @@
+//
+// Responsive: Navbar
+// --------------------------------------------------
+
+
// TABLETS AND BELOW
// -----------------
@media (max-width: 979px) {
@@ -8,9 +13,10 @@
body {
padding-top: 0;
}
- // Unfix the navbar
+ // Unfix the navbars
.navbar-fixed-top,
- .navbar-fixed-bottom {
+ .navbar-fixed-bottom,
+ .navbar-subnav-fixed {
position: static;
}
.navbar-fixed-top {
@@ -138,16 +144,56 @@
padding-left: 10px;
padding-right: 10px;
}
+
+ // STATIC SUBNAV
+ // -------------
+ .navbar-subnav {
+ width: auto;
+ height: auto;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+ }
+ .navbar-subnav .navbar-inner {
+ background-color: #fff;
+ background-image: none; // Remove gradient
+ }
+ .navbar-subnav .nav {
+ float: none;
+ margin-right: 0;
+ }
+ .navbar-subnav .nav > li {
+ float: none;
+ }
+ .navbar-subnav .nav > li > a {
+ border: 0;
+ }
+ .navbar-subnav .nav > li > a:hover {
+ background-color: #f5f5f5;
+ }
+ .navbar-subnav .nav > li + li > a {
+ border-top: 1px solid #e5e5e5;
+ }
+ .navbar-subnav .nav > li:first-child > a,
+ .navbar-subnav .nav > li:first-child > a:hover {
+ -webkit-border-radius: 4px 4px 0 0;
+ -moz-border-radius: 4px 4px 0 0;
+ border-radius: 4px 4px 0 0;
+ }
+
+
}
// DEFAULT DESKTOP
// ---------------
-// Required to make the collapsing navbar work on regular desktops
@media (min-width: 980px) {
+
+ // Required to make the collapsing navbar work on regular desktops
.nav-collapse.collapse {
height: auto !important;
overflow: visible !important;
}
-}
+
+}
View
26 less/responsive-utilities.less
@@ -1,5 +1,7 @@
-// RESPONSIVE CLASSES
-// ------------------
+//
+// Responsive: Utility classes
+// --------------------------------------------------
+
// Hide from screenreaders and browsers
// Credit: HTML5 Boilerplate
@@ -18,24 +20,24 @@
.hidden-tablet { }
.hidden-desktop { display: none !important; }
-// Phones only
-@media (max-width: 767px) {
+// Tablets & small desktops only
+@media (min-width: 768px) and (max-width: 979px) {
// Show
- .visible-phone { display: inherit !important; } // Use inherit to restore previous behavior
+ .visible-tablet { display: inherit !important; }
// Hide
- .hidden-phone { display: none !important; }
+ .hidden-tablet { display: none !important; }
// Hide everything else
.hidden-desktop { display: inherit !important; }
- .visible-desktop { display: none !important; }
+ .visible-desktop { display: none !important ; }
}
-// Tablets & small desktops only
-@media (min-width: 768px) and (max-width: 979px) {
+// Phones only
+@media (max-width: 767px) {
// Show
- .visible-tablet { display: inherit !important; }
+ .visible-phone { display: inherit !important; } // Use inherit to restore previous behavior
// Hide
- .hidden-tablet { display: none !important; }
+ .hidden-phone { display: none !important; }
// Hide everything else
.hidden-desktop { display: inherit !important; }
- .visible-desktop { display: none !important ; }
+ .visible-desktop { display: none !important; }
}
View
8 less/responsive.less
@@ -31,14 +31,14 @@
// MEDIA QUERIES
// ------------------
-// Phones to portrait tablets and narrow desktops
-@import "responsive-767px-max.less";
+// Large desktops
+@import "responsive-1200px-min.less";
// Tablets to regular desktops
@import "responsive-768px-979px.less";
-// Large desktops
-@import "responsive-1200px-min.less";
+// Phones to portrait tablets and narrow desktops
+@import "responsive-767px-max.less";
// RESPONSIVE NAVBAR
View
4 less/scaffolding.less
@@ -1,6 +1,6 @@
+//
// Scaffolding
-// Basic and global styles for generating a grid system, structural layout, and page templates
-// -------------------------------------------------------------------------------------------
+// --------------------------------------------------
// Body reset
View
7 less/sprites.less
@@ -1,6 +1,6 @@
-// SPRITES
-// Glyphs and icons for buttons, nav, and more
-// -------------------------------------------
+//
+// Sprites
+// --------------------------------------------------
// ICONS
@@ -188,3 +188,4 @@
+
View
17 less/tables.less
@@ -1,7 +1,6 @@
//
-// Tables.less
-// Tables for, you guessed it, tabular data
-// ----------------------------------------
+// Tables
+// --------------------------------------------------
// BASE TABLES
@@ -136,7 +135,7 @@ table {
// HOVER EFFECT
// ------------
// Placed here since it has to come after the potential zebra striping
-.table {
+.table-hover {
tbody tr:hover td,
tbody tr:hover th {
background-color: @tableBackgroundHover;
@@ -147,7 +146,15 @@ table {
// TABLE CELL SIZING
// -----------------
-// Change the columns
+// Reset default grid behavior
+table [class*=span],
+.row-fluid table [class*=span] {
+ display: table-cell;
+ float: none; // undo default grid column styles
+ margin-left: 0; // undo default grid column styles
+}
+
+// Change the column widths to account for td/th padding
table {
.span1 { .tableColumns(1); }
.span2 { .tableColumns(2); }
View
7 less/thumbnails.less
@@ -1,5 +1,8 @@
-// THUMBNAILS
-// ----------
+//
+// Thumbnails
+// --------------------------------------------------
+
+
// Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files
// Make wrapper ul behave like the grid
View
6 less/tooltip.less
@@ -1,5 +1,7 @@
-// TOOLTIP
-// ------=
+//
+// Tooltips
+// --------------------------------------------------
+
.tooltip {
position: absolute;
View
7 less/type.less
@@ -1,6 +1,6 @@
-// Typography.less
-// Headings, body text, lists, code, and more for a versatile and durable typography system
-// ----------------------------------------------------------------------------------------
+//
+// Typography
+// --------------------------------------------------
// BODY TEXT
@@ -124,7 +124,6 @@ dd {
}
dt {
font-weight: bold;
- line-height: @baseLineHeight - 1; // fix jank Helvetica Neue font bug
}
dd {
margin-left: @baseLineHeight / 2;
View
6 less/utilities.less
@@ -1,5 +1,7 @@
-// UTILITY CLASSES
-// ---------------
+//
+// Utility classes
+// --------------------------------------------------
+
// Quick floats
.pull-right {
View
43 less/variables.less
@@ -1,10 +1,9 @@
-// Variables.less
-// Variables to customize the look and feel of Bootstrap
-// -----------------------------------------------------
-
+//
+// Variables
+// --------------------------------------------------
-// GLOBAL VALUES
+// Global values
// --------------------------------------------------
@@ -104,12 +103,17 @@
// -------------------------
@dropdownBackground: @white;
@dropdownBorder: rgba(0,0,0,.2);
-@dropdownLinkColor: @grayDark;
-@dropdownLinkColorHover: @white;
-@dropdownLinkBackgroundHover: @linkColor;
@dropdownDividerTop: #e5e5e5;
@dropdownDividerBottom: @white;
+@dropdownLinkColor: @grayDark;
+
+@dropdownLinkColorHover: @white;
+@dropdownLinkBackgroundHover: @grayLighter;
+
+@dropdownLinkColorActive: @dropdownLinkColor;
+@dropdownLinkBackgroundActive: @linkColor;
+
// COMPONENT VARIABLES
@@ -143,6 +147,11 @@
@hrBorder: @grayLighter;
+// Wells
+// -------------------------
+@wellBackground: #f5f5f5;
+
+
// Navbar
// -------------------------
@navbarHeight: 40px;
@@ -193,6 +202,7 @@
// GRID
// --------------------------------------------------
+
// Default 940px grid
// -------------------------
@gridColumns: 12;
@@ -200,7 +210,24 @@
@gridGutterWidth: 20px;
@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
+// 1200px min
+@gridColumnWidth1200: 70px;
+@gridGutterWidth1200: 30px;
+
+// 768px-979px
+@gridColumnWidth768: 42px;
+@gridGutterWidth768: 20px;
+
+
// Fluid grid
// -------------------------
@fluidGridColumnWidth: 6.382978723%;
@fluidGridGutterWidth: 2.127659574%;
+
+// 1200px min
+@fluidGridColumnWidth1200: 5.982905983%;
+@fluidGridGutterWidth1200: 2.564102564%;
+
+// 768px-979px
+@fluidGridColumnWidth768: 5.801104972%;
+@fluidGridGutterWidth768: 2.762430939%;
View
12 less/wells.less
@@ -1,13 +1,15 @@
-// WELLS
-// -----
+//
+// Wells
+// --------------------------------------------------
+
+// Base class
.well {
min-height: 20px;
padding: 19px;
margin-bottom: 20px;
- background-color: #f5f5f5;
- border: 1px solid #eee;
- border: 1px solid rgba(0,0,0,.05);
+ background-color: @wellBackground;
+ border: 1px solid darken(@wellBackground, 7%);
.border-radius(4px);
.box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
blockquote {

0 comments on commit 252b7d8

Please sign in to comment.
Something went wrong with that request. Please try again.