aboutsummaryrefslogtreecommitdiff
path: root/less
diff options
context:
space:
mode:
authorfat <[email protected]>2013-02-07 22:13:13 -0800
committerfat <[email protected]>2013-02-07 22:13:13 -0800
commit8c7f9c66a7d12f47f50618ef420868fe836d0c33 (patch)
tree552f251d1637a1749c34fcdbb3390653d2fdb8ae /less
parentee91afba63bc6e9687397b9052858fca242c2ff5 (diff)
parentc4d47fb1ea45ed2fc3cf382d087ed87b87c69288 (diff)
downloadbootstrap-2.3.0.tar.xz
bootstrap-2.3.0.zip
Merge branch '2.3.0-wip'v2.3.0
Diffstat (limited to 'less')
-rw-r--r--less/bootstrap.less8
-rw-r--r--less/button-groups.less6
-rw-r--r--less/buttons.less18
-rw-r--r--less/carousel.less41
-rw-r--r--less/close.less3
-rw-r--r--less/dropdowns.less28
-rw-r--r--less/forms.less7
-rw-r--r--less/labels-badges.less6
-rw-r--r--less/media.less4
-rw-r--r--less/mixins.less32
-rw-r--r--less/navbar.less33
-rw-r--r--less/navs.less60
-rw-r--r--less/pager.less4
-rw-r--r--less/pagination.less4
-rw-r--r--less/popovers.less6
-rw-r--r--less/responsive-767px-max.less4
-rw-r--r--less/responsive-navbar.less8
-rw-r--r--less/responsive-utilities.less16
-rw-r--r--less/responsive.less11
-rw-r--r--less/scaffolding.less3
-rw-r--r--less/sprites.less10
-rw-r--r--less/tables.less41
-rw-r--r--less/tests/css-tests.css13
-rw-r--r--less/tests/css-tests.html54
-rw-r--r--less/thumbnails.less5
-rw-r--r--less/tooltip.less12
-rw-r--r--less/type.less26
-rw-r--r--less/variables.less2
28 files changed, 326 insertions, 139 deletions
diff --git a/less/bootstrap.less b/less/bootstrap.less
index bc6ea1931..47af2c4e4 100644
--- a/less/bootstrap.less
+++ b/less/bootstrap.less
@@ -1,5 +1,5 @@
/*!
- * Bootstrap v2.2.2
+ * Bootstrap v2.3.0
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
@@ -8,13 +8,13 @@
* Designed and built with all the love in the world @twitter by @mdo and @fat.
*/
-// CSS Reset
-@import "reset.less";
-
// Core variables and mixins
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
@import "mixins.less";
+// CSS Reset
+@import "reset.less";
+
// Grid system and page structure
@import "scaffolding.less";
@import "grid.less";
diff --git a/less/button-groups.less b/less/button-groups.less
index d6054c808..55cdc6033 100644
--- a/less/button-groups.less
+++ b/less/button-groups.less
@@ -164,8 +164,6 @@
margin-left: 0;
}
// Carets in other button sizes
-.btn-mini .caret,
-.btn-small .caret,
.btn-large .caret {
margin-top: 6px;
}
@@ -174,6 +172,10 @@
border-right-width: 5px;
border-top-width: 5px;
}
+.btn-mini .caret,
+.btn-small .caret {
+ margin-top: 8px;
+}
// Upside down carets for .dropup
.dropup .btn-large .caret {
border-bottom-width: 5px;
diff --git a/less/buttons.less b/less/buttons.less
index 6f565b73c..4cd4d862b 100644
--- a/less/buttons.less
+++ b/less/buttons.less
@@ -25,13 +25,14 @@
.ie7-restore-left-whitespace(); // Give IE7 some love
.box-shadow(~"inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)");
- // Hover state
- &:hover {
+ // Hover/focus state
+ &:hover,
+ &:focus {
color: @grayDark;
text-decoration: none;
background-position: 0 -15px;
- // transition is only when going to hover, otherwise the background
+ // transition is only when going to hover/focus, otherwise the background
// behind the gradient (there for IE<=9 fallback) gets mismatched
.transition(background-position .1s linear);
}
@@ -141,11 +142,6 @@ input[type="button"] {
// Set the backgrounds
// -------------------------
-.btn {
- // reset here as of 2.0.3 due to Recess property order
- border-color: #c5c5c5;
- border-color: rgba(0,0,0,.15) rgba(0,0,0,.15) rgba(0,0,0,.25);
-}
.btn-primary {
.buttonBackground(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight);
}
@@ -219,12 +215,14 @@ input[type="submit"].btn {
color: @linkColor;
.border-radius(0);
}
-.btn-link:hover {
+.btn-link:hover,
+.btn-link:focus {
color: @linkColorHover;
text-decoration: underline;
background-color: transparent;
}
-.btn-link[disabled]:hover {
+.btn-link[disabled]:hover,
+.btn-link[disabled]:focus {
color: @grayDark;
text-decoration: none;
}
diff --git a/less/carousel.less b/less/carousel.less
index 2dc050603..55bc05014 100644
--- a/less/carousel.less
+++ b/less/carousel.less
@@ -21,12 +21,13 @@
display: none;
position: relative;
.transition(.6s ease-in-out left);
- }
- // Account for jankitude on images
- > .item > img {
- display: block;
- line-height: 1;
+ // Account for jankitude on images
+ > img,
+ > a > img {
+ display: block;
+ line-height: 1;
+ }
}
> .active,
@@ -97,14 +98,40 @@
right: 15px;
}
- // Hover state
- &:hover {
+ // Hover/focus state
+ &:hover,
+ &:focus {
color: @white;
text-decoration: none;
.opacity(90);
}
}
+// Carousel indicator pips
+// -----------------------------
+.carousel-indicators {
+ position: absolute;
+ top: 15px;
+ right: 15px;
+ z-index: 5;
+ margin: 0;
+ list-style: none;
+
+ li {
+ display: block;
+ float: left;
+ width: 10px;
+ height: 10px;
+ margin-left: 5px;
+ text-indent: -999px;
+ background-color: #ccc;
+ background-color: rgba(255,255,255,.25);
+ border-radius: 5px;
+ }
+ .active {
+ background-color: #fff;
+ }
+}
// Caption for text below images
// -----------------------------
diff --git a/less/close.less b/less/close.less
index c71a508f3..4c626bda6 100644
--- a/less/close.less
+++ b/less/close.less
@@ -11,7 +11,8 @@
color: @black;
text-shadow: 0 1px 0 rgba(255,255,255,1);
.opacity(20);
- &:hover {
+ &:hover,
+ &:focus {
color: @black;
text-decoration: none;
cursor: pointer;
diff --git a/less/dropdowns.less b/less/dropdowns.less
index 484bd3dda..bbfe3fd3e 100644
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -72,7 +72,7 @@
}
// Links within the dropdown menu
- li > a {
+ > li > a {
display: block;
padding: 3px 20px;
clear: both;
@@ -83,11 +83,12 @@
}
}
-// Hover state
+// Hover/Focus state
// -----------
-.dropdown-menu li > a:hover,
-.dropdown-menu li > a:focus,
-.dropdown-submenu:hover > a {
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus,
+.dropdown-submenu:hover > a,
+.dropdown-submenu:focus > a {
text-decoration: none;
color: @dropdownLinkColorHover;
#gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
@@ -95,8 +96,9 @@
// Active state
// ------------
-.dropdown-menu .active > a,
-.dropdown-menu .active > a:hover {
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
color: @dropdownLinkColorActive;
text-decoration: none;
outline: 0;
@@ -105,13 +107,15 @@
// Disabled state
// --------------
-// Gray out text and ensure the hover state remains gray
-.dropdown-menu .disabled > a,
-.dropdown-menu .disabled > a:hover {
+// Gray out text and ensure the hover/focus state remains gray
+.dropdown-menu > .disabled > a,
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
color: @grayLight;
}
-// Nuke hover effects
-.dropdown-menu .disabled > a:hover {
+// Nuke hover/focus effects
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
text-decoration: none;
background-color: transparent;
background-image: none; // Remove CSS gradient
diff --git a/less/forms.less b/less/forms.less
index 2dff22919..06767bdd3 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -422,7 +422,9 @@ select:focus:invalid {
// Allow us to put symbols and text within the input field for a cleaner look
.input-append,
.input-prepend {
- margin-bottom: 5px;
+ display: inline-block;
+ margin-bottom: @baseLineHeight / 2;
+ vertical-align: middle;
font-size: 0; // white space collapse hack
white-space: nowrap; // Prevent span and input from separating
@@ -430,7 +432,8 @@ select:focus:invalid {
input,
select,
.uneditable-input,
- .dropdown-menu {
+ .dropdown-menu,
+ .popover {
font-size: @baseFontSize;
}
diff --git a/less/labels-badges.less b/less/labels-badges.less
index 9c3a40bfb..bc321fe5c 100644
--- a/less/labels-badges.less
+++ b/less/labels-badges.less
@@ -35,10 +35,12 @@
}
}
-// Hover state, but only for links
+// Hover/focus state, but only for links
a {
&.label:hover,
- &.badge:hover {
+ &.label:focus,
+ &.badge:hover,
+ &.badge:focus {
color: @white;
text-decoration: none;
cursor: pointer;
diff --git a/less/media.less b/less/media.less
index 1decab71d..e461e446d 100644
--- a/less/media.less
+++ b/less/media.less
@@ -37,10 +37,10 @@
// Media image alignment
// -------------------------
-.media .pull-left {
+.media > .pull-left {
margin-right: 10px;
}
-.media .pull-right {
+.media > .pull-right {
margin-left: 10px;
}
diff --git a/less/mixins.less b/less/mixins.less
index b734bab2d..79d889219 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -268,6 +268,12 @@
-o-transition-delay: @transition-delay;
transition-delay: @transition-delay;
}
+.transition-duration(@transition-duration) {
+ -webkit-transition-duration: @transition-duration;
+ -moz-transition-duration: @transition-duration;
+ -o-transition-duration: @transition-duration;
+ transition-duration: @transition-duration;
+}
// Transformations
.rotate(@degrees) {
@@ -437,6 +443,17 @@
background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10
}
+ .horizontal-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
+ background-color: mix(@midColor, @endColor, 80%);
+ background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
+ background-image: -webkit-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
+ background-image: -moz-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
+ background-image: -o-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
+ background-image: linear-gradient(to right, @startColor, @midColor @colorStop, @endColor);
+ background-repeat: no-repeat;
+ 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
+ }
+
.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));
@@ -500,7 +517,7 @@
.reset-filter();
// in these cases the gradient won't cover the background, so we override
- &:hover, &:active, &.active, &.disabled, &[disabled] {
+ &:hover, &:focus, &:active, &.active, &.disabled, &[disabled] {
color: @textColor;
background-color: @endColor;
*background-color: darken(@endColor, 5%);
@@ -558,13 +575,13 @@
.core (@gridColumnWidth, @gridGutterWidth) {
.spanX (@index) when (@index > 0) {
- (~".span@{index}") { .span(@index); }
+ .span@{index} { .span(@index); }
.spanX(@index - 1);
}
.spanX (0) {}
.offsetX (@index) when (@index > 0) {
- (~".offset@{index}") { .offset(@index); }
+ .offset@{index} { .offset(@index); }
.offsetX(@index - 1);
}
.offsetX (0) {}
@@ -603,14 +620,14 @@
.fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
.spanX (@index) when (@index > 0) {
- (~".span@{index}") { .span(@index); }
+ .span@{index} { .span(@index); }
.spanX(@index - 1);
}
.spanX (0) {}
.offsetX (@index) when (@index > 0) {
- (~'.offset@{index}') { .offset(@index); }
- (~'.offset@{index}:first-child') { .offsetFirstChild(@index); }
+ .offset@{index} { .offset(@index); }
+ .offset@{index}:first-child { .offsetFirstChild(@index); }
.offsetX(@index - 1);
}
.offsetX (0) {}
@@ -658,7 +675,7 @@
.input(@gridColumnWidth, @gridGutterWidth) {
.spanX (@index) when (@index > 0) {
- (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
+ input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index} { .span(@index); }
.spanX(@index - 1);
}
.spanX (0) {}
@@ -682,5 +699,4 @@
.spanX (@gridColumns);
}
-
}
diff --git a/less/navbar.less b/less/navbar.less
index b292b72bb..93d09bcad 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -56,7 +56,8 @@
font-weight: 200;
color: @navbarBrandColor;
text-shadow: 0 1px 0 @navbarBackgroundHighlight;
- &:hover {
+ &:hover,
+ &:focus {
text-decoration: none;
}
}
@@ -73,7 +74,8 @@
// -------------------------
.navbar-link {
color: @navbarLinkColor;
- &:hover {
+ &:hover,
+ &:focus {
color: @navbarLinkColorHover;
}
}
@@ -95,7 +97,9 @@
}
.navbar .btn-group .btn,
.navbar .input-prepend .btn,
-.navbar .input-append .btn {
+.navbar .input-append .btn,
+.navbar .input-prepend .btn-group,
+.navbar .input-append .btn-group {
margin-top: 0; // then undo the margin here so we don't accidentally double it
}
@@ -245,13 +249,12 @@
}
.navbar .nav .dropdown-toggle .caret {
margin-top: 8px;
-
}
-// Hover
+// Hover/focus
.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover {
- background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
+ background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover/:focus from .active
color: @navbarLinkColorHover;
text-decoration: none;
}
@@ -335,10 +338,11 @@
}
}
-// Caret should match text color on hover
-.navbar .nav li.dropdown > a:hover .caret {
- border-top-color: @navbarLinkColorActive;
- border-bottom-color: @navbarLinkColorActive;
+// Caret should match text color on hover/focus
+.navbar .nav li.dropdown > a:hover .caret,
+.navbar .nav li.dropdown > a:focus .caret {
+ border-top-color: @navbarLinkColorHover;
+ border-bottom-color: @navbarLinkColorHover;
}
// Remove background color from open dropdown
@@ -396,7 +400,8 @@
.nav > li > a {
color: @navbarInverseLinkColor;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
- &:hover {
+ &:hover,
+ &:focus {
color: @navbarInverseLinkColorHover;
}
}
@@ -425,7 +430,8 @@
// Inline text links
.navbar-link {
color: @navbarInverseLinkColor;
- &:hover {
+ &:hover,
+ &:focus {
color: @navbarInverseLinkColorHover;
}
}
@@ -443,7 +449,8 @@
background-color: @navbarInverseLinkBackgroundActive;
color: @navbarInverseLinkColorActive;
}
- .nav li.dropdown > a:hover .caret {
+ .nav li.dropdown > a:hover .caret,
+ .nav li.dropdown > a:focus .caret {
border-top-color: @navbarInverseLinkColorActive;
border-bottom-color: @navbarInverseLinkColorActive;
}
diff --git a/less/navs.less b/less/navs.less
index 2d08e79da..01cd805bd 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -16,7 +16,8 @@
.nav > li > a {
display: block;
}
-.nav > li > a:hover {
+.nav > li > a:hover,
+.nav > li > a:focus {
text-decoration: none;
background-color: @grayLighter;
}
@@ -68,7 +69,8 @@
padding: 3px 15px;
}
.nav-list > .active > a,
-.nav-list > .active > a:hover {
+.nav-list > .active > a:hover,
+.nav-list > .active > a:focus {
color: @white;
text-shadow: 0 -1px 0 rgba(0,0,0,.2);
background-color: @linkColor;
@@ -122,13 +124,15 @@
line-height: @baseLineHeight;
border: 1px solid transparent;
.border-radius(4px 4px 0 0);
- &:hover {
+ &:hover,
+ &:focus {
border-color: @grayLighter @grayLighter #ddd;
}
}
-// Active state, and it's :hover to override normal :hover
+// Active state, and it's :hover/:focus to override normal :hover/:focus
.nav-tabs > .active > a,
-.nav-tabs > .active > a:hover {
+.nav-tabs > .active > a:hover,
+.nav-tabs > .active > a:focus {
color: @gray;
background-color: @bodyBackground;
border: 1px solid #ddd;
@@ -151,7 +155,8 @@
// Active state
.nav-pills > .active > a,
-.nav-pills > .active > a:hover {
+.nav-pills > .active > a:hover,
+.nav-pills > .active > a:focus {
color: @white;
background-color: @linkColor;
}
@@ -183,7 +188,8 @@
.nav-tabs.nav-stacked > li:last-child > a {
.border-bottom-radius(4px);
}
-.nav-tabs.nav-stacked > li > a:hover {
+.nav-tabs.nav-stacked > li > a:hover,
+.nav-tabs.nav-stacked > li > a:focus {
border-color: #ddd;
z-index: 2;
}
@@ -216,7 +222,8 @@
border-bottom-color: @linkColor;
margin-top: 6px;
}
-.nav .dropdown-toggle:hover .caret {
+.nav .dropdown-toggle:hover .caret,
+.nav .dropdown-toggle:focus .caret {
border-top-color: @linkColorHover;
border-bottom-color: @linkColorHover;
}
@@ -236,9 +243,10 @@
border-bottom-color: @gray;
}
-// Active:hover dropdown links
+// Active:hover/:focus dropdown links
// -------------------------
-.nav > .dropdown.active > a:hover {
+.nav > .dropdown.active > a:hover,
+.nav > .dropdown.active > a:focus {
cursor: pointer;
}
@@ -246,21 +254,24 @@
// -------------------------
.nav-tabs .open .dropdown-toggle,
.nav-pills .open .dropdown-toggle,
-.nav > li.dropdown.open.active > a:hover {
+.nav > li.dropdown.open.active > a:hover,
+.nav > li.dropdown.open.active > a:focus {
color: @white;
background-color: @grayLight;
border-color: @grayLight;
}
.nav li.dropdown.open .caret,
.nav li.dropdown.open.active .caret,
-.nav li.dropdown.open a:hover .caret {
+.nav li.dropdown.open a:hover .caret,
+.nav li.dropdown.open a:focus .caret {
border-top-color: @white;
border-bottom-color: @white;
.opacity(100);
}
// Dropdowns in stacked tabs
-.tabs-stacked .open > a:hover {
+.tabs-stacked .open > a:hover,
+.tabs-stacked .open > a:focus {
border-color: @grayLight;
}
@@ -311,13 +322,15 @@
}
.tabs-below > .nav-tabs > li > a {
.border-radius(0 0 4px 4px);
- &:hover {
+ &:hover,
+ &:focus {
border-bottom-color: transparent;
border-top-color: #ddd;
}
}
.tabs-below > .nav-tabs > .active > a,
-.tabs-below > .nav-tabs > .active > a:hover {
+.tabs-below > .nav-tabs > .active > a:hover,
+.tabs-below > .nav-tabs > .active > a:focus {
border-color: transparent #ddd #ddd #ddd;
}
@@ -346,11 +359,13 @@
margin-right: -1px;
.border-radius(4px 0 0 4px);
}
-.tabs-left > .nav-tabs > li > a:hover {
+.tabs-left > .nav-tabs > li > a:hover,
+.tabs-left > .nav-tabs > li > a:focus {
border-color: @grayLighter #ddd @grayLighter @grayLighter;
}
.tabs-left > .nav-tabs .active > a,
-.tabs-left > .nav-tabs .active > a:hover {
+.tabs-left > .nav-tabs .active > a:hover,
+.tabs-left > .nav-tabs .active > a:focus {
border-color: #ddd transparent #ddd #ddd;
*border-right-color: @white;
}
@@ -365,11 +380,13 @@
margin-left: -1px;
.border-radius(0 4px 4px 0);
}
-.tabs-right > .nav-tabs > li > a:hover {
+.tabs-right > .nav-tabs > li > a:hover,
+.tabs-right > .nav-tabs > li > a:focus {
border-color: @grayLighter @grayLighter @grayLighter #ddd;
}
.tabs-right > .nav-tabs .active > a,
-.tabs-right > .nav-tabs .active > a:hover {
+.tabs-right > .nav-tabs .active > a:hover,
+.tabs-right > .nav-tabs .active > a:focus {
border-color: #ddd #ddd #ddd transparent;
*border-left-color: @white;
}
@@ -383,8 +400,9 @@
.nav > .disabled > a {
color: @grayLight;
}
-// Nuke hover effects
-.nav > .disabled > a:hover {
+// Nuke hover/focus effects
+.nav > .disabled > a:hover,
+.nav > .disabled > a:focus {
text-decoration: none;
background-color: transparent;
cursor: default;
diff --git a/less/pager.less b/less/pager.less
index da2425367..147618829 100644
--- a/less/pager.less
+++ b/less/pager.less
@@ -20,7 +20,8 @@
border: 1px solid #ddd;
.border-radius(15px);
}
-.pager li > a:hover {
+.pager li > a:hover,
+.pager li > a:focus {
text-decoration: none;
background-color: #f5f5f5;
}
@@ -34,6 +35,7 @@
}
.pager .disabled > a,
.pager .disabled > a:hover,
+.pager .disabled > a:focus,
.pager .disabled > span {
color: @grayLight;
background-color: #fff;
diff --git a/less/pagination.less b/less/pagination.less
index e35d3f4a8..a789db2d2 100644
--- a/less/pagination.less
+++ b/less/pagination.less
@@ -32,6 +32,7 @@
border-left-width: 0;
}
.pagination ul > li > a:hover,
+.pagination ul > li > a:focus,
.pagination ul > .active > a,
.pagination ul > .active > span {
background-color: @paginationActiveBackground;
@@ -43,7 +44,8 @@
}
.pagination ul > .disabled > span,
.pagination ul > .disabled > a,
-.pagination ul > .disabled > a:hover {
+.pagination ul > .disabled > a:hover,
+.pagination ul > .disabled > a:focus {
color: @grayLight;
background-color: transparent;
cursor: default;
diff --git a/less/popovers.less b/less/popovers.less
index b5b2a7eb5..aae35c8cd 100644
--- a/less/popovers.less
+++ b/less/popovers.less
@@ -9,7 +9,7 @@
left: 0;
z-index: @zindexPopover;
display: none;
- width: 236px;
+ max-width: 276px;
padding: 1px;
text-align: left; // Reset given new insertion method
background-color: @popoverBackground;
@@ -40,6 +40,10 @@
background-color: @popoverTitleBackground;
border-bottom: 1px solid darken(@popoverTitleBackground, 5%);
.border-radius(5px 5px 0 0);
+
+ &:empty {
+ display: none;
+ }
}
.popover-content {
diff --git a/less/responsive-767px-max.less b/less/responsive-767px-max.less
index 1d5c1239c..128f4ce30 100644
--- a/less/responsive-767px-max.less
+++ b/less/responsive-767px-max.less
@@ -72,8 +72,8 @@
.box-sizing(border-box);
}
.row-fluid [class*="offset"]:first-child {
- margin-left: 0;
- }
+ margin-left: 0;
+ }
// FORM FIELDS
// -----------
diff --git a/less/responsive-navbar.less b/less/responsive-navbar.less
index 2a0b0c057..21cd3ba67 100644
--- a/less/responsive-navbar.less
+++ b/less/responsive-navbar.less
@@ -81,7 +81,9 @@
margin-bottom: 2px;
}
.nav-collapse .nav > li > a:hover,
- .nav-collapse .dropdown-menu a:hover {
+ .nav-collapse .nav > li > a:focus,
+ .nav-collapse .dropdown-menu a:hover,
+ .nav-collapse .dropdown-menu a:focus {
background-color: @navbarBackground;
}
.navbar-inverse .nav-collapse .nav > li > a,
@@ -89,7 +91,9 @@
color: @navbarInverseLinkColor;
}
.navbar-inverse .nav-collapse .nav > li > a:hover,
- .navbar-inverse .nav-collapse .dropdown-menu a:hover {
+ .navbar-inverse .nav-collapse .nav > li > a:focus,
+ .navbar-inverse .nav-collapse .dropdown-menu a:hover,
+ .navbar-inverse .nav-collapse .dropdown-menu a:focus {
background-color: @navbarInverseBackground;
}
// Buttons in the navbar
diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less
index 2c3f6c15f..bf43e8ef7 100644
--- a/less/responsive-utilities.less
+++ b/less/responsive-utilities.less
@@ -3,6 +3,13 @@
// --------------------------------------------------
+// IE10 Metro responsive
+// Required for Windows 8 Metro split-screen snapping with IE10
+// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
+@-ms-viewport{
+ width: device-width;
+}
+
// Hide from screenreaders and browsers
// Credit: HTML5 Boilerplate
.hidden {
@@ -41,3 +48,12 @@
// Hide
.hidden-phone { display: none !important; }
}
+
+// Print utilities
+.visible-print { display: none !important; }
+.hidden-print { }
+
+@media print {
+ .visible-print { display: inherit !important; }
+ .hidden-print { display: none !important; }
+}
diff --git a/less/responsive.less b/less/responsive.less
index 7cfaf80b9..df6334068 100644
--- a/less/responsive.less
+++ b/less/responsive.less
@@ -1,5 +1,5 @@
/*!
- * Bootstrap Responsive v2.2.2
+ * Bootstrap Responsive v2.3.0
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
@@ -14,15 +14,6 @@
// -------------------------------------------------------------
-// IE10 Metro responsive
-// Required for Windows 8 Metro split-screen snapping with IE10
-// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
-
-@-ms-viewport{
- width: device-width;
-}
-
-
// REPEAT VARIABLES & MIXINS
// -------------------------
// Required since we compile the responsive stuff separately
diff --git a/less/scaffolding.less b/less/scaffolding.less
index 7a7496a64..f17e8cadb 100644
--- a/less/scaffolding.less
+++ b/less/scaffolding.less
@@ -23,7 +23,8 @@ a {
color: @linkColor;
text-decoration: none;
}
-a:hover {
+a:hover,
+a:focus {
color: @linkColorHover;
text-decoration: underline;
}
diff --git a/less/sprites.less b/less/sprites.less
index 9cd2ae3bf..1812bf71a 100644
--- a/less/sprites.less
+++ b/less/sprites.less
@@ -28,7 +28,7 @@
margin-top: 1px;
}
-/* White icons with optional class, or on hover/active states of certain elements */
+/* White icons with optional class, or on hover/focus/active states of certain elements */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
@@ -37,11 +37,15 @@
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
+.dropdown-menu > li > a:focus > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
+.dropdown-menu > li > a:focus > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
-.dropdown-submenu:hover > a > [class*=" icon-"] {
+.dropdown-submenu:focus > a > [class^="icon-"],
+.dropdown-submenu:hover > a > [class*=" icon-"],
+.dropdown-submenu:focus > a > [class*=" icon-"] {
background-image: url("@{iconWhiteSpritePath}");
}
@@ -166,7 +170,7 @@
.icon-chevron-down { background-position: -313px -119px; } // 1px, 1px off
.icon-retweet { background-position: -336px -120px; }
.icon-shopping-cart { background-position: -360px -120px; }
-.icon-folder-close { background-position: -384px -120px; }
+.icon-folder-close { background-position: -384px -120px; width: 16px; }
.icon-folder-open { background-position: -408px -120px; width: 16px; }
.icon-resize-vertical { background-position: -432px -119px; } // 1px, 1px off
.icon-resize-horizontal { background-position: -456px -118px; } // 1px, 2px off
diff --git a/less/tables.less b/less/tables.less
index f3b9967f0..0e35271e1 100644
--- a/less/tables.less
+++ b/less/tables.less
@@ -93,24 +93,32 @@ table {
tbody:first-child tr:first-child td {
border-top: 0;
}
- // For first th or td in the first row in the first thead or tbody
+ // For first th/td in the first row in the first thead or tbody
thead:first-child tr:first-child > th:first-child,
- tbody:first-child tr:first-child > td:first-child {
+ tbody:first-child tr:first-child > td:first-child,
+ tbody:first-child tr:first-child > th:first-child {
.border-top-left-radius(@baseBorderRadius);
}
+ // For last th/td in the first row in the first thead or tbody
thead:first-child tr:first-child > th:last-child,
- tbody:first-child tr:first-child > td:last-child {
+ tbody:first-child tr:first-child > td:last-child,
+ tbody:first-child tr:first-child > th:last-child {
.border-top-right-radius(@baseBorderRadius);
}
- // For first th or td in the last row in the last thead or tbody
+ // For first th/td (can be either) in the last row in the last thead, tbody, and tfoot
thead:last-child tr:last-child > th:first-child,
tbody:last-child tr:last-child > td:first-child,
- tfoot:last-child tr:last-child > td:first-child {
+ tbody:last-child tr:last-child > th:first-child,
+ tfoot:last-child tr:last-child > td:first-child,
+ tfoot:last-child tr:last-child > th:first-child {
.border-bottom-left-radius(@baseBorderRadius);
}
+ // For last th/td (can be either) in the last row in the last thead, tbody, and tfoot
thead:last-child tr:last-child > th:last-child,
tbody:last-child tr:last-child > td:last-child,
- tfoot:last-child tr:last-child > td:last-child {
+ tbody:last-child tr:last-child > th:last-child,
+ tfoot:last-child tr:last-child > td:last-child,
+ tfoot:last-child tr:last-child > th:last-child {
.border-bottom-right-radius(@baseBorderRadius);
}
@@ -122,7 +130,6 @@ table {
.border-bottom-right-radius(0);
}
-
// Special fixes to round the left border on the first td/th
caption + thead tr:first-child th:first-child,
caption + tbody tr:first-child td:first-child,
@@ -161,8 +168,8 @@ table {
// Placed here since it has to come after the potential zebra striping
.table-hover {
tbody {
- tr:hover td,
- tr:hover th {
+ tr:hover > td,
+ tr:hover > th {
background-color: @tableBackgroundHover;
}
}
@@ -206,32 +213,32 @@ table th[class*="span"],
// Exact selectors below required to override .table-striped
.table tbody tr {
- &.success td {
+ &.success > td {
background-color: @successBackground;
}
- &.error td {
+ &.error > td {
background-color: @errorBackground;
}
- &.warning td {
+ &.warning > td {
background-color: @warningBackground;
}
- &.info td {
+ &.info > td {
background-color: @infoBackground;
}
}
// Hover states for .table-hover
.table-hover tbody tr {
- &.success:hover td {
+ &.success:hover > td {
background-color: darken(@successBackground, 5%);
}
- &.error:hover td {
+ &.error:hover > td {
background-color: darken(@errorBackground, 5%);
}
- &.warning:hover td {
+ &.warning:hover > td {
background-color: darken(@warningBackground, 5%);
}
- &.info:hover td {
+ &.info:hover > td {
background-color: darken(@infoBackground, 5%);
}
}
diff --git a/less/tests/css-tests.css b/less/tests/css-tests.css
index 9edaf69bf..0f5604ee6 100644
--- a/less/tests/css-tests.css
+++ b/less/tests/css-tests.css
@@ -136,4 +136,15 @@ body {
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-} \ No newline at end of file
+}
+
+.gradient-horizontal-three {
+ background-color: #00b3ee;
+ background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(#00b3ee), color-stop(50%, #7a43b6), to(#c3325f));
+ background-image: -webkit-linear-gradient(left, #00b3ee, #7a43b6 50%, #c3325f);
+ background-image: -moz-linear-gradient(left, #00b3ee, #7a43b6 50%, #c3325f);
+ background-image: -o-linear-gradient(left, #00b3ee, #7a43b6 50%, #c3325f);
+ background-image: linear-gradient(to right, #00b3ee, #7a43b6 50%, #c3325f);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00b3ee', endColorstr='#c3325f', GradientType=0);
+}
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index 035ba8bd4..c69688c76 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -1291,10 +1291,64 @@
<h4>Striped</h4>
<div class="gradient-striped"></div>
+<h4>Horizontal three colors</h4>
+<div class="gradient-horizontal-three"></div>
+<div class="page-header">
+ <h1>Alerts</h1>
+</div>
+
+<h4>Alert default</h4>
+<div class="alert">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <strong>Alert!</strong> Best check yourself, you're not looking too good.
+</div>
+<div class="alert alert-block">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <p><strong>Alert!</strong> Best check yourself, you're not looking too good.</p>
+</div>
+
+<h4>Success</h4>
+<div class="alert alert-success">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <strong>Success!</strong> Best check yourself, you're not looking too good.
+</div>
+<div class="alert alert-block alert-success">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <p><strong>Success!</strong> Best check yourself, you're not looking too good.</p>
+</div>
+<h4>Info</h4>
+<div class="alert alert-info">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <strong>Info!</strong> Best check yourself, you're not looking too good.
+</div>
+<div class="alert alert-block alert-info">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <p><strong>Info!</strong> Best check yourself, you're not looking too good.</p>
+</div>
+
+<h4>Warning</h4>
+<div class="alert ">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <strong>Warning!</strong> Best check yourself, you're not looking too good.
+</div>
+<div class="alert alert-block alert-warning">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <p><strong>Warning!</strong> Best check yourself, you're not looking too good.</p>
+</div>
+
+<h4>Error</h4>
+<div class="alert alert-error">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <strong>Error!</strong> Best check yourself, you're not looking too good.
+</div>
+<div class="alert alert-block alert-error">
+ <button type="button" class="close" data-dismiss="alert">&times;</button>
+ <p><strong>Error!</strong> Best check yourself, you're not looking too good.</p>
+</div>
</div><!-- /container -->
diff --git a/less/thumbnails.less b/less/thumbnails.less
index a84a7d37d..4fd07d253 100644
--- a/less/thumbnails.less
+++ b/less/thumbnails.less
@@ -33,8 +33,9 @@
.box-shadow(0 1px 3px rgba(0,0,0,.055));
.transition(all .2s ease-in-out);
}
-// Add a hover state for linked versions only
-a.thumbnail:hover {
+// Add a hover/focus state for linked versions only
+a.thumbnail:hover,
+a.thumbnail:focus {
border-color: @linkColor;
.box-shadow(0 1px 4px rgba(0,105,214,.25));
}
diff --git a/less/tooltip.less b/less/tooltip.less
index 93fac8d6b..83d5f2bd7 100644
--- a/less/tooltip.less
+++ b/less/tooltip.less
@@ -9,20 +9,20 @@
z-index: @zindexTooltip;
display: block;
visibility: visible;
- padding: 5px;
font-size: 11px;
+ line-height: 1.4;
.opacity(0);
&.in { .opacity(80); }
- &.top { margin-top: -3px; }
- &.right { margin-left: 3px; }
- &.bottom { margin-top: 3px; }
- &.left { margin-left: -3px; }
+ &.top { margin-top: -3px; padding: 5px 0; }
+ &.right { margin-left: 3px; padding: 0 5px; }
+ &.bottom { margin-top: 3px; padding: 5px 0; }
+ &.left { margin-left: -3px; padding: 0 5px; }
}
// Wrapper for the tooltip content
.tooltip-inner {
max-width: 200px;
- padding: 3px 8px;
+ padding: 8px;
color: @tooltipColor;
text-align: center;
text-decoration: none;
diff --git a/less/type.less b/less/type.less
index 683a30772..337138ac8 100644
--- a/less/type.less
+++ b/less/type.less
@@ -29,19 +29,28 @@ cite { font-style: normal; }
// Utility classes
.muted { color: @grayLight; }
-a.muted:hover { color: darken(@grayLight, 10%); }
+a.muted:hover,
+a.muted:focus { color: darken(@grayLight, 10%); }
.text-warning { color: @warningText; }
-a.text-warning:hover { color: darken(@warningText, 10%); }
+a.text-warning:hover,
+a.text-warning:focus { color: darken(@warningText, 10%); }
.text-error { color: @errorText; }
-a.text-error:hover { color: darken(@errorText, 10%); }
+a.text-error:hover,
+a.text-error:focus { color: darken(@errorText, 10%); }
.text-info { color: @infoText; }
-a.text-info:hover { color: darken(@infoText, 10%); }
+a.text-info:hover,
+a.text-info:focus { color: darken(@infoText, 10%); }
.text-success { color: @successText; }
-a.text-success:hover { color: darken(@successText, 10%); }
+a.text-success:hover,
+a.text-success:focus { color: darken(@successText, 10%); }
+
+.text-left { text-align: left; }
+.text-right { text-align: right; }
+.text-center { text-align: center; }
// Headings
@@ -119,8 +128,9 @@ ul.inline,
ol.inline {
margin-left: 0;
list-style: none;
- & > li {
+ > li {
display: inline-block;
+ .ie7-inline-block();
padding-left: 5px;
padding-right: 5px;
}
@@ -185,7 +195,9 @@ blockquote {
border-left: 5px solid @grayLighter;
p {
margin-bottom: 0;
- #font > .shorthand(16px,300,@baseLineHeight * 1.25);
+ font-size: @baseFontSize * 1.25;
+ font-weight: 300;
+ line-height: 1.25;
}
small {
display: block;
diff --git a/less/variables.less b/less/variables.less
index de36074fd..31c131b1e 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -86,7 +86,7 @@
// -------------------------
@btnBackground: @white;
@btnBackgroundHighlight: darken(@white, 10%);
-@btnBorder: #bbb;
+@btnBorder: #ccc;
@btnPrimaryBackground: @linkColor;
@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 20%);