Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Update Bootstrap to 3.1.0

  • Loading branch information...
commit c37c01d567127eaebbdba43046ed9de91004728f 1 parent a5d1b80
@gsferreira gsferreira authored
Showing with 1,126 additions and 6,744 deletions.
  1. +4 −0 bootstrap/badges.less
  2. +0 −5,956 bootstrap/bootstrap.css
  3. +4 −1 bootstrap/breadcrumbs.less
  4. +10 −11 bootstrap/button-groups.less
  5. +8 −8 bootstrap/buttons.less
  6. +10 −0 bootstrap/code.less
  7. +28 −2 bootstrap/dropdowns.less
  8. +82 −38 bootstrap/forms.less
  9. +1 −5 bootstrap/glyphicons.less
  10. +26 −5 bootstrap/grid.less
  11. +39 −18 bootstrap/input-groups.less
  12. +3 −5 bootstrap/jumbotron.less
  13. +25 −3 bootstrap/list-group.less
  14. +131 −53 bootstrap/mixins.less
  15. +18 −8 bootstrap/modals.less
  16. +24 −20 bootstrap/navbar.less
  17. +2 −2 bootstrap/navs.less
  18. +139 −122 bootstrap/normalize.less
  19. +5 −5 bootstrap/pager.less
  20. +6 −3 bootstrap/pagination.less
  21. +64 −16 bootstrap/panels.less
  22. +7 −7 bootstrap/popovers.less
  23. +0 −4 bootstrap/print.less
  24. +15 −132 bootstrap/responsive-utilities.less
  25. +17 −2 bootstrap/scaffolding.less
  26. +3 −1 bootstrap/tables.less
  27. +18 −78 bootstrap/theme.css
  28. +1 −1  bootstrap/theme.less
  29. +1 −1  bootstrap/tooltip.less
  30. +78 −63 bootstrap/type.less
  31. +346 −161 bootstrap/variables.less
  32. +1 −1  bootstrap/wells.less
  33. +1 −1  components.html
  34. +2 −2 css/metro-bootstrap.css
  35. BIN  docs/banners/Thumbs.db
  36. +4 −6 docs/bootstrap.min.js
  37. +1 −1  index.html
  38. +1 −1  less/metro-bootstrap.less
  39. +1 −1  sidebartemplate.html
View
4 bootstrap/badges.less
@@ -28,6 +28,10 @@
position: relative;
top: -1px;
}
+ .btn-xs & {
+ top: 0;
+ padding: 1px 5px;
+ }
}
// Hover state, but only for links
View
5,956 bootstrap/bootstrap.css
0 additions, 5,956 deletions not shown
View
5 bootstrap/breadcrumbs.less
@@ -4,19 +4,22 @@
.breadcrumb {
- padding: 8px 15px;
+ padding: @breadcrumb-padding-vertical @breadcrumb-padding-horizontal;
margin-bottom: @line-height-computed;
list-style: none;
background-color: @breadcrumb-bg;
border-radius: @border-radius-base;
+
> li {
display: inline-block;
+
+ li:before {
content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
padding: 0 5px;
color: @breadcrumb-color;
}
}
+
> .active {
color: @breadcrumb-active-color;
}
View
21 bootstrap/button-groups.less
@@ -37,18 +37,17 @@
// Optional: Group multiple button groups together for a toolbar
.btn-toolbar {
- .clearfix();
+ margin-left: -5px; // Offset the first child's margin
+ &:extend(.clearfix all);
- .btn-group {
+ .btn-group,
+ .input-group {
float: left;
}
- // Space out series of button groups
> .btn,
- > .btn-group {
- + .btn,
- + .btn-group {
- margin-left: 5px;
- }
+ > .btn-group,
+ > .input-group {
+ margin-left: 5px;
}
}
@@ -157,7 +156,7 @@
// Clear floats so dropdown menus can be properly placed
> .btn-group {
- .clearfix();
+ &:extend(.clearfix all);
> .btn {
float: none;
}
@@ -188,13 +187,13 @@
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
-.btn-group-vertical > .btn-group:first-child {
+.btn-group-vertical > .btn-group:first-child:not(:last-child) {
> .btn:last-child,
> .dropdown-toggle {
.border-bottom-radius(0);
}
}
-.btn-group-vertical > .btn-group:last-child > .btn:first-child {
+.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
.border-top-radius(0);
}
View
16 bootstrap/buttons.less
@@ -56,14 +56,6 @@
.btn-primary {
.button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
}
-// Warning appears as orange
-.btn-warning {
- .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
-}
-// Danger and error appear as red
-.btn-danger {
- .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
-}
// Success appears as green
.btn-success {
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
@@ -72,6 +64,14 @@
.btn-info {
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}
+// Warning appears as orange
+.btn-warning {
+ .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
+}
+// Danger and error appear as red
+.btn-danger {
+ .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
+}
// Link buttons
View
10 bootstrap/code.less
@@ -21,6 +21,16 @@ code {
border-radius: @border-radius-base;
}
+// User input typically entered via keyboard
+kbd {
+ padding: 2px 4px;
+ font-size: 90%;
+ color: @kbd-color;
+ background-color: @kbd-bg;
+ border-radius: @border-radius-small;
+ box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
+}
+
// Blocks of code
pre {
display: block;
View
30 bootstrap/dropdowns.less
@@ -46,6 +46,8 @@
background-clip: padding-box;
// Aligns the dropdown menu to right
+ //
+ // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
&.pull-right {
right: 0;
left: auto;
@@ -126,6 +128,25 @@
}
}
+// Menu positioning
+//
+// Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
+// menu with the parent.
+.dropdown-menu-right {
+ left: auto; // Reset the default from `.dropdown-menu`
+ right: 0;
+}
+// With v3, we enabled auto-flipping if you have a dropdown within a right
+// aligned nav component. To enable the undoing of that, we provide an override
+// to restore the default dropdown menu alignment.
+//
+// This is only for left-aligning a dropdown menu within a `.navbar-right` or
+// `.pull-right` nav component.
+.dropdown-menu-left {
+ left: 0;
+ right: auto;
+}
+
// Dropdown section headers
.dropdown-header {
display: block;
@@ -142,7 +163,7 @@
right: 0;
bottom: 0;
top: 0;
- z-index: @zindex-dropdown - 10;
+ z-index: (@zindex-dropdown - 10);
}
// Right aligned dropdowns
@@ -180,7 +201,12 @@
@media (min-width: @grid-float-breakpoint) {
.navbar-right {
.dropdown-menu {
- .pull-right > .dropdown-menu();
+ .dropdown-menu-right();
+ }
+ // Necessary for overrides of the default right aligned menu.
+ // Will remove come v4 in all likelihood.
+ .dropdown-menu-left {
+ .dropdown-menu-left();
}
}
}
View
120 bootstrap/forms.less
@@ -11,6 +11,10 @@ fieldset {
padding: 0;
margin: 0;
border: 0;
+ // Chrome and Firefox set a `min-width: -webkit-min-content;` on fieldsets,
+ // so we reset that to ensure it behaves more like a standard block element.
+ // See https://github.com/twbs/bootstrap/issues/12359.
+ min-width: 0;
}
legend {
@@ -33,6 +37,10 @@ label {
// Normalize form controls
+//
+// While most of our form styles require extra classes, some basic normalization
+// is required to ensure optimum display with or without those classes to better
+// address browser inconsistencies.
// Override content-box in Normalize (* isn't specific enough)
input[type="search"] {
@@ -47,41 +55,30 @@ input[type="checkbox"] {
line-height: normal;
}
-// Set the height of select and file controls to match text inputs
+// Set the height of file controls to match text inputs
input[type="file"] {
display: block;
}
+// Make range inputs behave like textual form controls
+input[type="range"] {
+ display: block;
+ width: 100%;
+}
+
// Make multiple select elements height not fixed
select[multiple],
select[size] {
height: auto;
}
-// Fix optgroup Firefox bug per https://github.com/twbs/bootstrap/issues/7611
-select optgroup {
- font-size: inherit;
- font-style: inherit;
- font-family: inherit;
-}
-
-// Focus for select, file, radio, and checkbox
+// Focus for file, radio, and checkbox
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
.tab-focus();
}
-// Fix for Chrome number input
-// Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button.
-// See https://github.com/twbs/bootstrap/issues/8350 for more.
-input[type="number"] {
- &::-webkit-outer-spin-button,
- &::-webkit-inner-spin-button {
- height: auto;
- }
-}
-
// Adjust output element
output {
display: block;
@@ -89,7 +86,6 @@ output {
font-size: @font-size-base;
line-height: @line-height-base;
color: @input-color;
- vertical-align: middle;
}
@@ -123,7 +119,6 @@ output {
font-size: @font-size-base;
line-height: @line-height-base;
color: @input-color;
- vertical-align: middle;
background-color: @input-bg;
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
border: 1px solid @input-border;
@@ -135,9 +130,6 @@ output {
.form-control-focus();
// Placeholder
- //
- // Placeholder text gets special styles because when browsers invalidate entire
- // lines if it doesn't understand a selector/
.placeholder();
// Disabled and read-only inputs
@@ -149,6 +141,7 @@ output {
fieldset[disabled] & {
cursor: not-allowed;
background-color: @input-bg-disabled;
+ opacity: 1; // iOS fix for unreadable disabled content
}
// Reset height for `textarea`s
@@ -157,6 +150,14 @@ output {
}
}
+// Special styles for iOS date input
+//
+// In Mobile Safari, date inputs require a pixel line-height that matches the
+// given height of the input.
+input[type="date"] {
+ line-height: @input-height-base;
+}
+
// Form groups
//
@@ -179,10 +180,8 @@ output {
margin-top: 10px;
margin-bottom: 10px;
padding-left: 20px;
- vertical-align: middle;
label {
display: inline;
- margin-bottom: 0;
font-weight: normal;
cursor: pointer;
}
@@ -230,7 +229,12 @@ input[type="checkbox"],
}
}
+
// Form control sizing
+//
+// Build on `.form-control` with modifier classes to decrease or increase the
+// height and font-size of form controls.
+
.input-sm {
.input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
}
@@ -244,18 +248,38 @@ input[type="checkbox"],
//
// Apply contextual and semantic states to individual form controls.
-// Warning
+.has-feedback {
+ // Enable absolute positioning
+ position: relative;
+
+ // Ensure icons don't overlap text
+ .form-control {
+ padding-right: (@input-height-base * 1.25);
+ }
+
+ // Feedback icon (requires .glyphicon classes)
+ .form-control-feedback {
+ position: absolute;
+ top: (@line-height-computed + 5); // Height of the `label` and its margin
+ right: 0;
+ display: block;
+ width: @input-height-base;
+ height: @input-height-base;
+ line-height: @input-height-base;
+ text-align: center;
+ }
+}
+
+// Feedback states
+.has-success {
+ .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
+}
.has-warning {
.form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);
}
-// Error
.has-error {
.form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);
}
-// Success
-.has-success {
- .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
-}
// Static form control text
@@ -296,9 +320,9 @@ input[type="checkbox"],
.form-inline {
// Kick in the inline
- @media (min-width: @screen-sm) {
+ @media (min-width: @screen-sm-min) {
// Inline-block all the things for "inline"
- .form-group {
+ .form-group {
display: inline-block;
margin-bottom: 0;
vertical-align: middle;
@@ -307,11 +331,13 @@ input[type="checkbox"],
// In navbar-form, allow folks to *not* use `.form-group`
.form-control {
display: inline-block;
+ width: auto; // Prevent labels from stacking above inputs in `.form-group`
+ vertical-align: middle;
}
- // Override `width: 100%;` when not within a `.form-group`
- select.form-control {
- width: auto;
+ .control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
}
// Remove default margin on radios/checkboxes that were used for stacking, and
@@ -323,12 +349,21 @@ input[type="checkbox"],
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
+ vertical-align: middle;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
float: none;
margin-left: 0;
}
+
+ // Validation states
+ //
+ // Reposition the icon because it's now within a grid column and columns have
+ // `position: relative;` on them. Also accounts for the grid gutter padding.
+ .has-feedback .form-control-feedback {
+ top: 0;
+ }
}
}
@@ -354,7 +389,7 @@ input[type="checkbox"],
// and other content below items
.radio,
.checkbox {
- min-height: @line-height-computed + (@padding-base-vertical + 1);
+ min-height: (@line-height-computed + (@padding-base-vertical + 1));
}
// Make form groups behave like rows
@@ -372,4 +407,13 @@ input[type="checkbox"],
text-align: right;
}
}
+
+ // Validation states
+ //
+ // Reposition the icon because it's now within a grid column and columns have
+ // `position: relative;` on them. Also accounts for the grid gutter padding.
+ .has-feedback .form-control-feedback {
+ top: 0;
+ right: (@grid-gutter-width / 2);
+ }
}
View
6 bootstrap/glyphicons.less
@@ -14,7 +14,7 @@
src: ~"url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype')",
~"url('@{icon-font-path}@{icon-font-name}.woff') format('woff')",
~"url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype')",
- ~"url('@{icon-font-path}@{icon-font-name}.svg#glyphicons-halflingsregular') format('svg')";
+ ~"url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg')";
}
// Catchall baseclass
@@ -28,10 +28,6 @@
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-
- &:empty {
- width: 1em;
- }
}
// Individual icons
View
31 bootstrap/grid.less
@@ -2,14 +2,18 @@
// Grid system
// --------------------------------------------------
-// Set the container width, and override it for fixed navbars in media queries
+
+// Container widths
+//
+// Set the container width, and override it for fixed navbars in media queries.
+
.container {
.container-fixed();
- @media (min-width: @screen-sm) {
+ @media (min-width: @screen-sm-min) {
width: @container-sm;
}
- @media (min-width: @screen-md) {
+ @media (min-width: @screen-md-min) {
width: @container-md;
}
@media (min-width: @screen-lg-min) {
@@ -17,12 +21,30 @@
}
}
-// mobile first defaults
+
+// Fluid container
+//
+// Utilizes the mixin meant for fixed width containers, but without any defined
+// width for fluid, full width layouts.
+
+.container-fluid {
+ .container-fixed();
+}
+
+
+// Row
+//
+// Rows contain and clear the floats of your columns.
+
.row {
.make-row();
}
+
+// Columns
+//
// Common styles for small and large grid columns
+
.make-grid-columns();
@@ -76,4 +98,3 @@
.make-grid(@grid-columns, lg, push);
.make-grid(@grid-columns, lg, offset);
}
-
View
57 bootstrap/input-groups.less
@@ -17,6 +17,11 @@
}
.form-control {
+ // IE9 fubars the placeholder attribute in text inputs and the arrows on
+ // select elements in input groups. To fix it, we float the input. Details:
+ // https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855
+ float: left;
+
width: 100%;
margin-bottom: 0;
}
@@ -90,8 +95,10 @@
.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
-.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
+.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
.border-right-radius(0);
}
.input-group-addon:first-child {
@@ -100,8 +107,10 @@
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
-.input-group-btn:first-child > .btn:not(:first-child) {
+.input-group-btn:first-child > .btn:not(:first-child),
+.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
.border-left-radius(0);
}
.input-group-addon:last-child {
@@ -112,25 +121,37 @@
// -------------------------
.input-group-btn {
position: relative;
+ // Jankily prevent input button groups from wrapping with `white-space` and
+ // `font-size` in combination with `inline-block` on buttons.
+ font-size: 0;
white-space: nowrap;
- // Negative margin to only have a 1px border between the two
- &:first-child > .btn {
- margin-right: -1px;
+ // Negative margin for spacing, position for bringing hovered/focused/actived
+ // element above the siblings.
+ > .btn {
+ position: relative;
+ + .btn {
+ margin-left: -1px;
+ }
+ // Bring the "active" button to the front
+ &:hover,
+ &:focus,
+ &:active {
+ z-index: 2;
+ }
}
- &:last-child > .btn {
- margin-left: -1px;
- }
-}
-.input-group-btn > .btn {
- position: relative;
- // Jankily prevent input button groups from wrapping
- + .btn {
- margin-left: -4px;
+
+ // Negative margin to only have a 1px border between the two
+ &:first-child {
+ > .btn,
+ > .btn-group {
+ margin-right: -1px;
+ }
}
- // Bring the "active" button to the front
- &:hover,
- &:active {
- z-index: 2;
+ &:last-child {
+ > .btn,
+ > .btn-group {
+ margin-left: -1px;
+ }
}
}
View
8 bootstrap/jumbotron.less
@@ -6,19 +6,17 @@
.jumbotron {
padding: @jumbotron-padding;
margin-bottom: @jumbotron-padding;
- font-size: @jumbotron-font-size;
- font-weight: 200;
- line-height: (@line-height-base * 1.5);
color: @jumbotron-color;
background-color: @jumbotron-bg;
h1,
.h1 {
- line-height: 1;
color: @jumbotron-heading-color;
}
p {
- line-height: 1.4;
+ margin-bottom: (@jumbotron-padding / 2);
+ font-size: @jumbotron-font-size;
+ font-weight: 200;
}
.container & {
View
28 bootstrap/list-group.less
@@ -2,17 +2,21 @@
// List groups
// --------------------------------------------------
+
// Base class
//
// Easily usable on <ul>, <ol>, or <div>.
+
.list-group {
// No need to set list-style: none; since .list-group-item is block level
margin-bottom: 20px;
padding-left: 0; // reset padding because ul and ol
}
+
// Individual list items
-// -------------------------
+//
+// Use on `li`s or `div`s within the `.list-group` parent.
.list-group-item {
position: relative;
@@ -41,7 +45,12 @@
}
}
+
// Linked list items
+//
+// Use anchor elements instead of `li`s or `div`s to create linked list items.
+// Includes an extra `.active` modifier class for showing selected items.
+
a.list-group-item {
color: @list-group-link-color;
@@ -70,13 +79,26 @@ a.list-group-item {
color: inherit;
}
.list-group-item-text {
- color: lighten(@list-group-active-bg, 40%);
+ color: @list-group-active-text-color;
}
}
}
+
+// Contextual variants
+//
+// Add modifier classes to change text and background color on individual items.
+// Organizationally, this must come after the `:hover` states.
+
+.list-group-item-variant(success; @state-success-bg; @state-success-text);
+.list-group-item-variant(info; @state-info-bg; @state-info-text);
+.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);
+.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);
+
+
// Custom content options
-// -------------------------
+//
+// Extra classes for creating well-formatted content within `.list-group-item`s.
.list-group-item-heading {
margin-top: 0;
View
184 bootstrap/mixins.less
@@ -115,6 +115,10 @@
}
// Drop shadows
+//
+// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
+// supported browsers that have box shadow capabilities now support the
+// standard `box-shadow` property.
.box-shadow(@shadow) {
-webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
box-shadow: @shadow;
@@ -147,17 +151,17 @@
// Transformations
.rotate(@degrees) {
-webkit-transform: rotate(@degrees);
- -ms-transform: rotate(@degrees); // IE9+
+ -ms-transform: rotate(@degrees); // IE9 only
transform: rotate(@degrees);
}
-.scale(@ratio) {
- -webkit-transform: scale(@ratio);
- -ms-transform: scale(@ratio); // IE9+
- transform: scale(@ratio);
+.scale(@ratio; @ratio-y...) {
+ -webkit-transform: scale(@ratio, @ratio-y);
+ -ms-transform: scale(@ratio, @ratio-y); // IE9 only
+ transform: scale(@ratio, @ratio-y);
}
.translate(@x; @y) {
-webkit-transform: translate(@x, @y);
- -ms-transform: translate(@x, @y); // IE9+
+ -ms-transform: translate(@x, @y); // IE9 only
transform: translate(@x, @y);
}
.skew(@x; @y) {
@@ -172,12 +176,12 @@
.rotateX(@degrees) {
-webkit-transform: rotateX(@degrees);
- -ms-transform: rotateX(@degrees); // IE9+
+ -ms-transform: rotateX(@degrees); // IE9 only
transform: rotateX(@degrees);
}
.rotateY(@degrees) {
-webkit-transform: rotateY(@degrees);
- -ms-transform: rotateY(@degrees); // IE9+
+ -ms-transform: rotateY(@degrees); // IE9 only
transform: rotateY(@degrees);
}
.perspective(@perspective) {
@@ -193,6 +197,7 @@
.transform-origin(@origin) {
-webkit-transform-origin: @origin;
-moz-transform-origin: @origin;
+ -ms-transform-origin: @origin; // IE9 only
transform-origin: @origin;
}
@@ -201,6 +206,30 @@
-webkit-animation: @animation;
animation: @animation;
}
+.animation-name(@name) {
+ -webkit-animation-name: @name;
+ animation-name: @name;
+}
+.animation-duration(@duration) {
+ -webkit-animation-duration: @duration;
+ animation-duration: @duration;
+}
+.animation-timing-function(@timing-function) {
+ -webkit-animation-timing-function: @timing-function;
+ animation-timing-function: @timing-function;
+}
+.animation-delay(@delay) {
+ -webkit-animation-delay: @delay;
+ animation-delay: @delay;
+}
+.animation-iteration-count(@iteration-count) {
+ -webkit-animation-iteration-count: @iteration-count;
+ animation-iteration-count: @iteration-count;
+}
+.animation-direction(@direction) {
+ -webkit-animation-direction: @direction;
+ animation-direction: @direction;
+}
// Backface visibility
// Prevent browsers from flickering when using CSS 3D transforms.
@@ -353,7 +382,7 @@
//
// Keep images from scaling beyond the width of their parents.
-.img-responsive(@display: block;) {
+.img-responsive(@display: block) {
display: @display;
max-width: 100%; // Part 1: Set a maximum relative to the parent
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
@@ -414,29 +443,57 @@
.table-row-variant(@state; @background) {
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.
- .table {
- > thead,
- > tbody,
- > tfoot {
- > tr > .@{state},
- > .@{state} > td,
- > .@{state} > th {
- background-color: @background;
- }
+ .table > thead > tr,
+ .table > tbody > tr,
+ .table > tfoot > tr {
+ > td.@{state},
+ > th.@{state},
+ &.@{state} > td,
+ &.@{state} > th {
+ background-color: @background;
}
}
// Hover states for `.table-hover`
// Note: this is not available for cells or rows within `thead` or `tfoot`.
- .table-hover > tbody {
- > tr > .@{state}:hover,
- > .@{state}:hover > td,
- > .@{state}:hover > th {
+ .table-hover > tbody > tr {
+ > td.@{state}:hover,
+ > th.@{state}:hover,
+ &.@{state}:hover > td,
+ &.@{state}:hover > th {
background-color: darken(@background, 5%);
}
}
}
+// List Groups
+// -------------------------
+.list-group-item-variant(@state; @background; @color) {
+ .list-group-item-@{state} {
+ color: @color;
+ background-color: @background;
+
+ a& {
+ color: @color;
+
+ .list-group-item-heading { color: inherit; }
+
+ &:hover,
+ &:focus {
+ color: @color;
+ background-color: darken(@background, 5%);
+ }
+ &.active,
+ &.active:hover,
+ &.active:focus {
+ color: #fff;
+ background-color: @color;
+ border-color: @color;
+ }
+ }
+ }
+}
+
// Button variants
// -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active,
@@ -475,7 +532,7 @@
.badge {
color: @background;
- background-color: #fff;
+ background-color: @color;
}
}
@@ -524,6 +581,24 @@
}
}
+// Contextual backgrounds
+// -------------------------
+.bg-variant(@color) {
+ background-color: @color;
+ a&:hover {
+ background-color: darken(@color, 10%);
+ }
+}
+
+// Typography
+// -------------------------
+.text-emphasis-variant(@color) {
+ color: @color;
+ a&:hover {
+ color: darken(@color, 10%);
+ }
+}
+
// Navbar vertical align
// -------------------------
// Vertically center elements in the navbar.
@@ -554,10 +629,7 @@
}
.responsive-invisibility() {
- &,
- tr&,
- th&,
- td& { display: none !important; }
+ display: none !important;
}
@@ -570,14 +642,14 @@
margin-left: auto;
padding-left: (@grid-gutter-width / 2);
padding-right: (@grid-gutter-width / 2);
- .clearfix();
+ &:extend(.clearfix all);
}
// Creates a wrapper for a series of columns
.make-row(@gutter: @grid-gutter-width) {
margin-left: (@gutter / -2);
margin-right: (@gutter / -2);
- .clearfix();
+ &:extend(.clearfix all);
}
// Generate the extra small columns
@@ -585,30 +657,39 @@
position: relative;
float: left;
width: percentage((@columns / @grid-columns));
- // Prevent columns from collapsing when empty
min-height: 1px;
- // Inner gutter via padding
padding-left: (@gutter / 2);
padding-right: (@gutter / 2);
}
+.make-xs-column-offset(@columns) {
+ @media (min-width: @screen-xs-min) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-xs-column-push(@columns) {
+ @media (min-width: @screen-xs-min) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-xs-column-pull(@columns) {
+ @media (min-width: @screen-xs-min) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
+
// Generate the small columns
.make-sm-column(@columns; @gutter: @grid-gutter-width) {
position: relative;
- // Prevent columns from collapsing when empty
min-height: 1px;
- // Inner gutter via padding
padding-left: (@gutter / 2);
padding-right: (@gutter / 2);
- // Calculate width based on number of columns available
@media (min-width: @screen-sm-min) {
float: left;
width: percentage((@columns / @grid-columns));
}
}
-
-// Generate the small column offsets
.make-sm-column-offset(@columns) {
@media (min-width: @screen-sm-min) {
margin-left: percentage((@columns / @grid-columns));
@@ -625,30 +706,26 @@
}
}
+
// Generate the medium columns
.make-md-column(@columns; @gutter: @grid-gutter-width) {
position: relative;
- // Prevent columns from collapsing when empty
min-height: 1px;
- // Inner gutter via padding
padding-left: (@gutter / 2);
padding-right: (@gutter / 2);
- // Calculate width based on number of columns available
@media (min-width: @screen-md-min) {
float: left;
width: percentage((@columns / @grid-columns));
}
}
-
-// Generate the medium column offsets
.make-md-column-offset(@columns) {
@media (min-width: @screen-md-min) {
margin-left: percentage((@columns / @grid-columns));
}
}
.make-md-column-push(@columns) {
- @media (min-width: @screen-md) {
+ @media (min-width: @screen-md-min) {
left: percentage((@columns / @grid-columns));
}
}
@@ -658,23 +735,19 @@
}
}
+
// Generate the large columns
.make-lg-column(@columns; @gutter: @grid-gutter-width) {
position: relative;
- // Prevent columns from collapsing when empty
min-height: 1px;
- // Inner gutter via padding
padding-left: (@gutter / 2);
padding-right: (@gutter / 2);
- // Calculate width based on number of columns available
@media (min-width: @screen-lg-min) {
float: left;
width: percentage((@columns / @grid-columns));
}
}
-
-// Generate the large column offsets
.make-lg-column-offset(@columns) {
@media (min-width: @screen-lg-min) {
margin-left: percentage((@columns / @grid-columns));
@@ -701,11 +774,11 @@
// Common styles for all sizes of grid columns, widths 1-12
.col(@index) when (@index = 1) { // initial
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
- .col(@index + 1, @item);
+ .col((@index + 1), @item);
}
.col(@index, @list) when (@index =< @grid-columns) { // general; "=<" isn't a typo
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
- .col(@index + 1, ~"@{list}, @{item}");
+ .col((@index + 1), ~"@{list}, @{item}");
}
.col(@index, @list) when (@index > @grid-columns) { // terminal
@{list} {
@@ -723,11 +796,11 @@
.make-grid-columns-float(@class) {
.col(@index) when (@index = 1) { // initial
@item: ~".col-@{class}-@{index}";
- .col(@index + 1, @item);
+ .col((@index + 1), @item);
}
.col(@index, @list) when (@index =< @grid-columns) { // general
@item: ~".col-@{class}-@{index}";
- .col(@index + 1, ~"@{list}, @{item}");
+ .col((@index + 1), ~"@{list}, @{item}");
}
.col(@index, @list) when (@index > @grid-columns) { // terminal
@{list} {
@@ -762,7 +835,7 @@
.make-grid(@index, @class, @type) when (@index >= 0) {
.calc-grid(@index, @class, @type);
// next iteration
- .make-grid(@index - 1, @class, @type);
+ .make-grid((@index - 1), @class, @type);
}
@@ -797,6 +870,10 @@
border-color: @border-color;
background-color: @background-color;
}
+ // Optional feedback icon
+ .form-control-feedback {
+ color: @text-color;
+ }
}
// Form control focus state
@@ -839,7 +916,8 @@
line-height: @input-height;
}
- textarea& {
+ textarea&,
+ select[multiple]& {
height: auto;
}
}
View
26 bootstrap/modals.less
@@ -22,7 +22,12 @@
right: 0;
bottom: 0;
left: 0;
- z-index: @zindex-modal-background;
+ z-index: @zindex-modal;
+ -webkit-overflow-scrolling: touch;
+
+ // Prevent Chrome on Windows from adding a focus outline. For details, see
+ // https://github.com/twbs/bootstrap/pull/10951.
+ outline: 0;
// When fading in the modal, animate it to slide down
&.fade .modal-dialog {
@@ -37,7 +42,6 @@
position: relative;
width: auto;
margin: 10px;
- z-index: (@zindex-modal-background + 10);
}
// Actual modal
@@ -60,11 +64,11 @@
right: 0;
bottom: 0;
left: 0;
- z-index: (@zindex-modal-background - 10);
+ z-index: @zindex-modal-background;
background-color: @modal-backdrop-bg;
// Fade for backdrop
&.fade { .opacity(0); }
- &.in { .opacity(.5); }
+ &.in { .opacity(@modal-backdrop-opacity); }
}
// Modal header
@@ -98,7 +102,7 @@
padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding;
text-align: right; // right align buttons
border-top: 1px solid @modal-footer-border-color;
- .clearfix(); // clear it in case folks use .pull-* classes on buttons
+ &:extend(.clearfix all); // clear it in case folks use .pull-* classes on buttons
// Properly space out buttons
.btn + .btn {
@@ -116,14 +120,20 @@
}
// Scale up the modal
-@media screen and (min-width: @screen-sm-min) {
-
+@media (min-width: @screen-sm-min) {
+ // Automatically set modal's width for larger viewports
.modal-dialog {
- width: 600px;
+ width: @modal-md;
margin: 30px auto;
}
.modal-content {
.box-shadow(0 5px 15px rgba(0,0,0,.5));
}
+ // Modal sizes
+ .modal-sm { width: @modal-sm; }
+}
+
+@media (min-width: @screen-md-min) {
+ .modal-lg { width: @modal-lg; }
}
View
44 bootstrap/navbar.less
@@ -15,7 +15,7 @@
border: 1px solid transparent;
// Prevent floats from breaking the navbar
- .clearfix();
+ &:extend(.clearfix all);
@media (min-width: @grid-float-breakpoint) {
border-radius: @navbar-border-radius;
@@ -29,7 +29,7 @@
// styling of responsive aspects.
.navbar-header {
- .clearfix();
+ &:extend(.clearfix all);
@media (min-width: @grid-float-breakpoint) {
float: left;
@@ -48,13 +48,13 @@
// content for the user's viewport.
.navbar-collapse {
- max-height: 340px;
+ max-height: @navbar-collapse-max-height;
overflow-x: visible;
padding-right: @navbar-padding-horizontal;
padding-left: @navbar-padding-horizontal;
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
- .clearfix();
+ &:extend(.clearfix all);
-webkit-overflow-scrolling: touch;
&.in {
@@ -93,14 +93,17 @@
//
// When a container is present, change the behavior of the header and collapse.
-.container > .navbar-header,
-.container > .navbar-collapse {
- margin-right: -@navbar-padding-horizontal;
- margin-left: -@navbar-padding-horizontal;
+.container,
+.container-fluid {
+ > .navbar-header,
+ > .navbar-collapse {
+ margin-right: -@navbar-padding-horizontal;
+ margin-left: -@navbar-padding-horizontal;
- @media (min-width: @grid-float-breakpoint) {
- margin-right: 0;
- margin-left: 0;
+ @media (min-width: @grid-float-breakpoint) {
+ margin-right: 0;
+ margin-left: 0;
+ }
}
}
@@ -152,6 +155,7 @@
padding: @navbar-padding-vertical @navbar-padding-horizontal;
font-size: @font-size-large;
line-height: @line-height-computed;
+ height: @navbar-height;
&:hover,
&:focus {
@@ -159,7 +163,8 @@
}
@media (min-width: @grid-float-breakpoint) {
- .navbar > .container & {
+ .navbar > .container &,
+ .navbar > .container-fluid & {
margin-left: -@navbar-padding-horizontal;
}
}
@@ -182,6 +187,12 @@
border: 1px solid transparent;
border-radius: @border-radius-base;
+ // We remove the `outline` here, but later compensate by attaching `:hover`
+ // styles to `:focus`.
+ &:focus {
+ outline: none;
+ }
+
// Bars
.icon-bar {
display: block;
@@ -201,7 +212,7 @@
// Navbar nav links
//
-// Builds on top of the `.nav` components with it's own modifier class to make
+// Builds on top of the `.nav` components with its own modifier class to make
// the nav the full height of the horizontal nav (above 768px).
.navbar-nav {
@@ -325,13 +336,6 @@
.border-bottom-radius(0);
}
-// Right aligned menus need alt position
-.navbar-nav.pull-right > li > .dropdown-menu,
-.navbar-nav > li > .dropdown-menu.pull-right {
- left: auto;
- right: 0;
-}
-
// Buttons in navbars
//
View
4 bootstrap/navs.less
@@ -10,7 +10,7 @@
margin-bottom: 0;
padding-left: 0; // Override default ul/ol
list-style: none;
- .clearfix();
+ &:extend(.clearfix all);
> li {
position: relative;
@@ -91,7 +91,7 @@
}
}
- // Active state, and it's :hover to override normal :hover
+ // Active state, and its :hover to override normal :hover
&.active > a {
&,
&:hover,
View
261 bootstrap/normalize.less
@@ -1,6 +1,25 @@
-/*! normalize.css v2.1.3 | MIT License | git.io/normalize */
+/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
+
+//
+// 1. Set default font family to sans-serif.
+// 2. Prevent iOS text size adjust after orientation change, without disabling
+// user zoom.
+//
+
+html {
+ font-family: sans-serif; // 1
+ -ms-text-size-adjust: 100%; // 2
+ -webkit-text-size-adjust: 100%; // 2
+}
+
+//
+// Remove default margin.
+//
+
+body {
+ margin: 0;
+}
-// ==========================================================================
// HTML5 display definitions
// ==========================================================================
@@ -24,13 +43,16 @@ summary {
}
//
-// Correct `inline-block` display not defined in IE 8/9.
+// 1. Correct `inline-block` display not defined in IE 8/9.
+// 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
//
audio,
canvas,
+progress,
video {
- display: inline-block;
+ display: inline-block; // 1
+ vertical-align: baseline; // 2
}
//
@@ -53,31 +75,6 @@ template {
display: none;
}
-// ==========================================================================
-// Base
-// ==========================================================================
-
-//
-// 1. Set default font family to sans-serif.
-// 2. Prevent iOS text size adjust after orientation change, without disabling
-// user zoom.
-//
-
-html {
- font-family: sans-serif; // 1
- -ms-text-size-adjust: 100%; // 2
- -webkit-text-size-adjust: 100%; // 2
-}
-
-//
-// Remove default margin.
-//
-
-body {
- margin: 0;
-}
-
-// ==========================================================================
// Links
// ==========================================================================
@@ -90,14 +87,6 @@ a {
}
//
-// Address `outline` inconsistency between Chrome and other browsers.
-//
-
-a:focus {
- outline: thin dotted;
-}
-
-//
// Improve readability when focused and also mouse hovered in all browsers.
//
@@ -106,19 +95,8 @@ a:hover {
outline: 0;
}
+// Text-level semantics
// ==========================================================================
-// Typography
-// ==========================================================================
-
-//
-// Address variable `h1` font-size and margin within `section` and `article`
-// contexts in Firefox 4+, Safari 5, and Chrome.
-//
-
-h1 {
- font-size: 2em;
- margin: 0.67em 0;
-}
//
// Address styling not present in IE 8/9, Safari 5, and Chrome.
@@ -146,13 +124,13 @@ dfn {
}
//
-// Address differences between Firefox and other browsers.
+// Address variable `h1` font-size and margin within `section` and `article`
+// contexts in Firefox 4+, Safari 5, and Chrome.
//
-hr {
- -moz-box-sizing: content-box;
- box-sizing: content-box;
- height: 0;
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
}
//
@@ -165,34 +143,6 @@ mark {
}
//
-// Correct font family set oddly in Safari 5 and Chrome.
-//
-
-code,
-kbd,
-pre,
-samp {
- font-family: monospace, serif;
- font-size: 1em;
-}
-
-//
-// Improve readability of pre-formatted text in all browsers.
-//
-
-pre {
- white-space: pre-wrap;
-}
-
-//
-// Set consistent quote types.
-//
-
-q {
- quotes: "\201C" "\201D" "\2018" "\2019";
-}
-
-//
// Address inconsistent and variable font size in all browsers.
//
@@ -220,7 +170,6 @@ sub {
bottom: -0.25em;
}
-// ==========================================================================
// Embedded content
// ==========================================================================
@@ -240,8 +189,7 @@ svg:not(:root) {
overflow: hidden;
}
-// ==========================================================================
-// Figures
+// Grouping content
// ==========================================================================
//
@@ -249,63 +197,77 @@ svg:not(:root) {
//
figure {
- margin: 0;
+ margin: 1em 40px;
}
-// ==========================================================================
-// Forms
-// ==========================================================================
+//
+// Address differences between Firefox and other browsers.
+//
+
+hr {
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ height: 0;
+}
//
-// Define consistent border, margin, and padding.
+// Contain overflow in all browsers.
//
-fieldset {
- border: 1px solid #c0c0c0;
- margin: 0 2px;
- padding: 0.35em 0.625em 0.75em;
+pre {
+ overflow: auto;
}
//
-// 1. Correct `color` not being inherited in IE 8/9.
-// 2. Remove padding so people aren't caught out if they zero out fieldsets.
+// Address odd `em`-unit font size rendering in all browsers.
//
-legend {
- border: 0; // 1
- padding: 0; // 2
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
}
+// Forms
+// ==========================================================================
+
+//
+// Known limitation: by default, Chrome and Safari on OS X allow very limited
+// styling of `select`, unless a `border` property is set.
+//
+
//
-// 1. Correct font family not being inherited in all browsers.
-// 2. Correct font size not being inherited in all browsers.
+// 1. Correct color not being inherited.
+// Known issue: affects color of disabled elements.
+// 2. Correct font properties not being inherited.
// 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
//
button,
input,
+optgroup,
select,
textarea {
- font-family: inherit; // 1
- font-size: 100%; // 2
+ color: inherit; // 1
+ font: inherit; // 2
margin: 0; // 3
}
//
-// Address Firefox 4+ setting `line-height` on `input` using `!important` in
-// the UA stylesheet.
+// Address `overflow` set to `hidden` in IE 8/9/10.
//
-button,
-input {
- line-height: normal;
+button {
+ overflow: visible;
}
//
// Address inconsistent `text-transform` inheritance for `button` and `select`.
// All other form control elements do not inherit `text-transform` values.
-// Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
-// Correct `select` style inheritance in Firefox 4+ and Opera.
+// Correct `button` style inheritance in Firefox, IE 8+, and Opera
+// Correct `select` style inheritance in Firefox.
//
button,
@@ -339,6 +301,28 @@ html input[disabled] {
}
//
+// Remove inner padding and border in Firefox 4+.
+//
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+//
+// Address Firefox 4+ setting `line-height` on `input` using `!important` in
+// the UA stylesheet.
+//
+
+input {
+ line-height: normal;
+}
+
+//
+// It's recommended that you don't attempt to style these elements.
+// Firefox's implementation doesn't respect box-sizing, padding, or width.
+//
// 1. Address box sizing set to `content-box` in IE 8/9/10.
// 2. Remove excess padding in IE 8/9/10.
//
@@ -350,6 +334,17 @@ input[type="radio"] {
}
//
+// Fix the cursor style for Chrome's increment/decrement buttons. For certain
+// `font-size` values of the `input`, it causes the cursor style of the
+// decrement button to change from `default` to `text`.
+//
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+//
// 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
// 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
// (include `-moz` to future-proof).
@@ -363,8 +358,9 @@ input[type="search"] {
}
//
-// Remove inner padding and search cancel button in Safari 5 and Chrome
-// on OS X.
+// Remove inner padding and search cancel button in Safari and Chrome on OS X.
+// Safari (but not Chrome) clips the cancel button when the search input has
+// padding (and `textfield` appearance).
//
input[type="search"]::-webkit-search-cancel-button,
@@ -373,26 +369,42 @@ input[type="search"]::-webkit-search-decoration {
}
//
-// Remove inner padding and border in Firefox 4+.
+// Define consistent border, margin, and padding.
//
-button::-moz-focus-inner,
-input::-moz-focus-inner {
- border: 0;
- padding: 0;
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
}
//
-// 1. Remove default vertical scrollbar in IE 8/9.
-// 2. Improve readability and alignment in all browsers.
+// 1. Correct `color` not being inherited in IE 8/9.
+// 2. Remove padding so people aren't caught out if they zero out fieldsets.
+//
+
+legend {
+ border: 0; // 1
+ padding: 0; // 2
+}
+
+//
+// Remove default vertical scrollbar in IE 8/9.
//
textarea {
- overflow: auto; // 1
- vertical-align: top; // 2
+ overflow: auto;
+}
+
+//
+// Don't inherit the `font-weight` (applied by a rule above).
+// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+//
+
+optgroup {
+ font-weight: bold;
}
-// ==========================================================================
// Tables
// ==========================================================================
@@ -404,3 +416,8 @@ table {
border-collapse: collapse;
border-spacing: 0;
}
+
+td,
+th {
+ padding: 0;
+}
View
10 bootstrap/pager.less
@@ -8,22 +8,22 @@
margin: @line-height-computed 0;
list-style: none;
text-align: center;
- .clearfix();
+ &:extend(.clearfix all);
li {
display: inline;
> a,
> span {
display: inline-block;
padding: 5px 14px;
- background-color: @pagination-bg;
- border: 1px solid @pagination-border;
+ background-color: @pager-bg;
+ border: 1px solid @pager-border;
border-radius: @pager-border-radius;
}
> a:hover,
> a:focus {
text-decoration: none;
- background-color: @pagination-hover-bg;
+ background-color: @pager-hover-bg;
}
}
@@ -47,7 +47,7 @@
> a:focus,
> span {
color: @pager-disabled-color;
- background-color: @pagination-bg;
+ background-color: @pager-bg;
cursor: not-allowed;
}
}
View
9 bootstrap/pagination.less
@@ -16,6 +16,7 @@
padding: @padding-base-vertical @padding-base-horizontal;
line-height: @line-height-base;
text-decoration: none;
+ color: @pagination-color;
background-color: @pagination-bg;
border: 1px solid @pagination-border;
margin-left: -1px;
@@ -39,7 +40,9 @@
> li > span {
&:hover,
&:focus {
+ color: @pagination-hover-color;
background-color: @pagination-hover-bg;
+ border-color: @pagination-hover-border;
}
}
@@ -51,7 +54,7 @@
z-index: 2;
color: @pagination-active-color;
background-color: @pagination-active-bg;
- border-color: @pagination-active-bg;
+ border-color: @pagination-active-border;
cursor: default;
}
}
@@ -64,8 +67,8 @@
> a:hover,
> a:focus {
color: @pagination-disabled-color;
- background-color: @pagination-bg;
- border-color: @pagination-border;
+ background-color: @pagination-disabled-bg;
+ border-color: @pagination-disabled-border;
cursor: not-allowed;
}
}
View
80 bootstrap/panels.less
@@ -14,8 +14,8 @@
// Panel contents
.panel-body {
- padding: 15px;
- .clearfix();
+ padding: @panel-body-padding;
+ &:extend(.clearfix all);
}
@@ -27,19 +27,28 @@
.panel {
> .list-group {
margin-bottom: 0;
-
.list-group-item {
border-width: 1px 0;
-
- // Remove border radius for top one
+ border-radius: 0;
&:first-child {
- .border-top-radius(0);
+ border-top: 0;
}
- // But keep it for the last one
&:last-child {
border-bottom: 0;
}
}
+ // Add border top radius for first one
+ &:first-child {
+ .list-group-item:first-child {
+ .border-top-radius((@panel-border-radius - 1));
+ }
+ }
+ // Add border bottom radius for last one
+ &:last-child {
+ .list-group-item:last-child {
+ .border-bottom-radius((@panel-border-radius - 1));
+ }
+ }
}
}
// Collapse space between when there's no additional content.
@@ -60,12 +69,46 @@
> .table-responsive > .table {
margin-bottom: 0;
}
+ // Add border top radius for first one
+ > .table:first-child,
+ > .table-responsive:first-child > .table:first-child {
+ > thead:first-child,
+ > tbody:first-child {
+ > tr:first-child {
+ td:first-child,
+ th:first-child {
+ border-top-left-radius: (@panel-border-radius - 1);
+ }
+ td:last-child,
+ th:last-child {
+ border-top-right-radius: (@panel-border-radius - 1);
+ }
+ }
+ }
+ }
+ // Add border bottom radius for last one
+ > .table:last-child,
+ > .table-responsive:last-child > .table:last-child {
+ > tbody:last-child,
+ > tfoot:last-child {
+ > tr:last-child {
+ td:first-child,
+ th:first-child {
+ border-bottom-left-radius: (@panel-border-radius - 1);
+ }
+ td:last-child,
+ th:last-child {
+ border-bottom-right-radius: (@panel-border-radius - 1);
+ }
+ }
+ }
+ }
> .panel-body + .table,
> .panel-body + .table-responsive {
border-top: 1px solid @table-border-color;
}
- > .table > tbody:first-child th,
- > .table > tbody:first-child td {
+ > .table > tbody:first-child > tr:first-child th,
+ > .table > tbody:first-child > tr:first-child td {
border-top: 0;
}
> .table-bordered,
@@ -83,7 +126,10 @@
> td:last-child {
border-right: 0;
}
-
+ &:first-child > th,
+ &:first-child > td {
+ border-top: 0;
+ }
&:last-child > th,
&:last-child > td {
border-bottom: 0;
@@ -102,14 +148,14 @@
.panel-heading {
padding: 10px 15px;
border-bottom: 1px solid transparent;
- .border-top-radius(@panel-border-radius - 1);
+ .border-top-radius((@panel-border-radius - 1));
> .dropdown .dropdown-toggle {
color: inherit;
}
}
-// Within heading, strip any `h*` tag of it's default margins for spacing.
+// Within heading, strip any `h*` tag of its default margins for spacing.
.panel-title {
margin-top: 0;
margin-bottom: 0;
@@ -126,7 +172,7 @@
padding: 10px 15px;
background-color: @panel-footer-bg;
border-top: 1px solid @panel-inner-border;
- .border-bottom-radius(@panel-border-radius - 1);
+ .border-bottom-radius((@panel-border-radius - 1));
}
@@ -136,6 +182,8 @@
// the help of our collapse JavaScript plugin.
.panel-group {
+ margin-bottom: @line-height-computed;
+
// Tighten up margin so it's only between panels
.panel {
margin-bottom: 0;
@@ -171,12 +219,12 @@
.panel-success {
.panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border);
}
+.panel-info {
+ .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);
+}
.panel-warning {
.panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border);
}
.panel-danger {
.panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border);
}
-.panel-info {
- .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);
-}
View
14 bootstrap/popovers.less
@@ -48,7 +48,7 @@
//
// .arrow is outer, .arrow:after is inner
-.popover .arrow {
+.popover > .arrow {
&,
&:after {
position: absolute;
@@ -59,16 +59,16 @@
border-style: solid;
}
}
-.popover .arrow {
+.popover > .arrow {
border-width: @popover-arrow-outer-width;
}
-.popover .arrow:after {
+.popover > .arrow:after {
border-width: @popover-arrow-width;
content: "";
}
.popover {
- &.top .arrow {
+ &.top > .arrow {
left: 50%;
margin-left: -@popover-arrow-outer-width;
border-bottom-width: 0;
@@ -83,7 +83,7 @@
border-top-color: @popover-arrow-color;
}
}
- &.right .arrow {
+ &.right > .arrow {
top: 50%;
left: -@popover-arrow-outer-width;
margin-top: -@popover-arrow-outer-width;
@@ -98,7 +98,7 @@
border-right-color: @popover-arrow-color;
}
}
- &.bottom .arrow {
+ &.bottom > .arrow {
left: 50%;
margin-left: -@popover-arrow-outer-width;
border-top-width: 0;
@@ -114,7 +114,7 @@
}
}
- &.left .arrow {
+ &.left > .arrow {
top: 50%;
right: -@popover-arrow-outer-width;
margin-top: -@popover-arrow-outer-width;
View
4 bootstrap/print.less
@@ -50,10 +50,6 @@
max-width: 100% !important;
}
- @page {
- margin: 2cm .5cm;
- }
-
p,
h2,
h3 {
View
147 bootstrap/responsive-utilities.less
@@ -23,187 +23,70 @@
// Visibility utilities
+.visible-xs,
+.visible-sm,
+.visible-md,
+.visible-lg {
+ .responsive-invisibility();
+}
.visible-xs {
- .responsive-invisibility();
@media (max-width: @screen-xs-max) {
.responsive-visibility();
}
- &.visible-sm {
- @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
- .responsive-visibility();
- }
- }
- &.visible-md {
- @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
- .responsive-visibility();
- }
- }
- &.visible-lg {
- @media (min-width: @screen-lg-min) {
- .responsive-visibility();
- }
- }
}
.visible-sm {
- .responsive-invisibility();
- &.visible-xs {
- @media (max-width: @screen-xs-max) {
- .responsive-visibility();
- }
- }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
.responsive-visibility();
}
- &.visible-md {
- @media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
- .responsive-visibility();
- }
- }
- &.visible-lg {
- @media (min-width: @screen-lg-min) {
- .responsive-visibility();
- }
- }
}
.visible-md {
- .responsive-invisibility();
- &.visible-xs {
- @media (max-width: @screen-xs-max) {
- .responsive-visibility();
- }
- }
- &.visible-sm {
- @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
- .responsive-visibility();
- }
- }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
.responsive-visibility(