diff options
author | Thomas Park <thomas@thomaspark.me> | 2013-08-16 16:26:07 -0700 |
---|---|---|
committer | Thomas Park <thomas@thomaspark.me> | 2013-08-16 16:26:07 -0700 |
commit | 4fe37339653c909368ba772ea9214c0b2a511fee (patch) | |
tree | 7573a3ef5486c1397e3f267f856de0fb3a031177 /bower_components/bootstrap/less | |
parent | f9b56d31da29a641fcfdc33825ac84422eea2b84 (diff) |
update bootstrap to 3.0.0-rc2
Diffstat (limited to 'bower_components/bootstrap/less')
39 files changed, 1669 insertions, 1007 deletions
diff --git a/bower_components/bootstrap/less/accordion.less b/bower_components/bootstrap/less/accordion.less deleted file mode 100644 index c3023ac4..00000000 --- a/bower_components/bootstrap/less/accordion.less +++ /dev/null @@ -1,31 +0,0 @@ -// -// Accordion -// -------------------------------------------------- - - -// Parent container -.accordion { - margin-bottom: @line-height-computed; -} - -// Group == heading + body -.accordion-group { - margin-bottom: 2px; - border: 1px solid @accordion-border-color; - border-radius: @border-radius-base; -} -.accordion-heading { - border-bottom: 0; - - .accordion-toggle { - display: block; - padding: 8px 15px; - cursor: pointer; - } -} - -// Inner needs the styles because you can't animate properly with any styles on the element -.accordion-inner { - padding: 9px 15px; - border-top: 1px solid @accordion-border-color; -} diff --git a/bower_components/bootstrap/less/alerts.less b/bower_components/bootstrap/less/alerts.less index 66aa6cf2..3ba463db 100644..100755 --- a/bower_components/bootstrap/less/alerts.less +++ b/bower_components/bootstrap/less/alerts.less @@ -7,7 +7,7 @@ // ------------------------- .alert { - padding: 10px 35px 10px 15px; + padding: @alert-padding; margin-bottom: @line-height-computed; color: @alert-text; background-color: @alert-bg; @@ -26,10 +26,27 @@ } // Provide class for links that match alerts .alert-link { - font-weight: 500; + font-weight: @alert-link-font-weight; color: darken(@alert-text, 10%); } + // Improve alignment and spacing of inner content + > p, + > ul { + margin-bottom: 0; + } + > p + p { + margin-top: 5px; + } +} + +// Dismissable alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissable { + padding-right: (@alert-padding + 20); + // Adjust close link position .close { position: relative; @@ -40,30 +57,15 @@ } // Alternate styles -// ------------------------- +// +// Generate contextual modifier classes for colorizing the alert. .alert-success { - .alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text); + .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text); } .alert-danger { - .alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text); + .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text); } .alert-info { - .alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text); -} - -// Block alerts -// ------------------------- - -.alert-block { - padding-top: 15px; - padding-bottom: 15px; - - > p, - > ul { - margin-bottom: 0; - } - p + p { - margin-top: 5px; - } + .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text); } diff --git a/bower_components/bootstrap/less/badges.less b/bower_components/bootstrap/less/badges.less index 216d6014..0b69753e 100644..100755 --- a/bower_components/bootstrap/less/badges.less +++ b/bower_components/bootstrap/less/badges.less @@ -9,16 +9,16 @@ min-width: 10px; padding: 3px 7px; font-size: @font-size-small; - font-weight: bold; + font-weight: @badge-font-weight; color: @badge-color; - line-height: 1; - vertical-align: middle; + line-height: @badge-line-height; + vertical-align: baseline; white-space: nowrap; text-align: center; background-color: @badge-bg; - border-radius: 10px; + border-radius: @badge-border-radius; - // Empty labels/badges collapse + // Empty badges collapse automatically (not available in IE8) &:empty { display: none; } diff --git a/bower_components/bootstrap/less/bootstrap.less b/bower_components/bootstrap/less/bootstrap.less index 307f72f4..accfb92e 100644..100755 --- a/bower_components/bootstrap/less/bootstrap.less +++ b/bower_components/bootstrap/less/bootstrap.less @@ -28,6 +28,7 @@ // Components: common @import "component-animations.less"; +@import "input-groups.less"; @import "dropdowns.less"; @import "list-group.less"; @import "panels.less"; @@ -54,7 +55,6 @@ @import "labels.less"; @import "badges.less"; @import "progress-bars.less"; -@import "accordion.less"; @import "carousel.less"; @import "jumbotron.less"; diff --git a/bower_components/bootstrap/less/breadcrumbs.less b/bower_components/bootstrap/less/breadcrumbs.less index 92643d16..92643d16 100644..100755 --- a/bower_components/bootstrap/less/breadcrumbs.less +++ b/bower_components/bootstrap/less/breadcrumbs.less diff --git a/bower_components/bootstrap/less/button-groups.less b/bower_components/bootstrap/less/button-groups.less index f345f4e1..e4a78cd4 100644..100755 --- a/bower_components/bootstrap/less/button-groups.less +++ b/bower_components/bootstrap/less/button-groups.less @@ -3,11 +3,34 @@ // -------------------------------------------------- // Button carets -.btn .caret { - border-top-color: @btn-default-color; +// +// Match the button text color to the arrow/caret for indicating dropdown-ness. + +.caret { + .btn-default & { + border-top-color: @btn-default-color; + } + .btn-primary &, + .btn-success &, + .btn-warning &, + .btn-danger &, + .btn-info & { + border-top-color: #fff; + } } -.dropup .btn .caret { - border-bottom-color: @btn-default-color; +.dropup { + & .btn-default .caret { + border-bottom-color: @btn-default-color; + } + & .btn-primary, + & .btn-success, + & .btn-warning, + & .btn-danger, + & .btn-info { + .caret { + border-bottom-color: #fff; + } + } } // Make the div behave like a button @@ -21,15 +44,26 @@ float: left; // Bring the "active" button to the front &:hover, - &:active { + &:focus, + &:active, + &.active { z-index: 2; } + &:focus { + // Remove focus outline when dropdown JS adds it after closing the menu + outline: none; + } } } // Prevent double borders when buttons are next to each other -.btn-group .btn + .btn { - margin-left: -1px; +.btn-group { + .btn + .btn, + .btn + .btn-group, + .btn-group + .btn, + .btn-group + .btn-group { + margin-left: -1px; + } } // Optional: Group multiple button groups together for a toolbar @@ -90,6 +124,14 @@ } +// Sizing +// +// Remix the default button sizing classes into new ones for easier manipulation. + +.btn-group-xs > .btn { .btn-xs(); } +.btn-group-sm > .btn { .btn-sm(); } +.btn-group-lg > .btn { .btn-lg(); } + // Split button dropdowns // ---------------------- @@ -99,7 +141,7 @@ padding-left: 8px; padding-right: 8px; } -.btn-group > .btn-large + .dropdown-toggle { +.btn-group > .btn-lg + .dropdown-toggle { padding-left: 12px; padding-right: 12px; } @@ -116,38 +158,70 @@ margin-left: 0; } // Carets in other button sizes -.btn-large .caret { - border-width: 5px; +.btn-lg .caret { + border-width: @caret-width-large; } // Upside down carets for .dropup -.dropup .btn-large .caret { - border-bottom-width: 5px; +.dropup .btn-lg .caret { + border-bottom-width: @caret-width-large; } // Vertical button groups // ---------------------- -.btn-group-vertical > .btn { - display: block; - float: none; - width: 100%; - max-width: 100%; - + .btn { +.btn-group-vertical { + > .btn, + > .btn-group { + display: block; + float: none; + width: 100%; + max-width: 100%; + } + + // Clear floats so dropdown menus can be properly placed + > .btn-group { + .clearfix(); + > .btn { + float: none; + } + } + + > .btn + .btn, + > .btn + .btn-group, + > .btn-group + .btn, + > .btn-group + .btn-group { margin-top: -1px; + margin-left: 0; } } -.btn-group-vertical .btn { + +.btn-group-vertical > .btn { &:not(:first-child):not(:last-child) { border-radius: 0; } - &:first-child { + &:first-child:not(:last-child) { + border-top-right-radius: @border-radius-base; .border-bottom-radius(0); } - &:last-child { + &:last-child:not(:first-child) { + border-bottom-left-radius: @border-radius-base; .border-top-radius(0); } } +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group-vertical > .btn-group:first-child { + > .btn:last-child, + > .dropdown-toggle { + .border-bottom-radius(0); + } +} +.btn-group-vertical > .btn-group:last-child > .btn:first-child { + .border-top-radius(0); +} + // Justified button groups @@ -156,6 +230,8 @@ .btn-group-justified { display: table; width: 100%; + table-layout: fixed; + border-collapse: separate; .btn { float: none; display: table-cell; @@ -165,7 +241,7 @@ // Checkbox and radio options -.btn-group[data-toggle="buttons"] > .btn > input[type="radio"], -.btn-group[data-toggle="buttons"] > .btn > input[type="checkbox"] { +[data-toggle="buttons"] > .btn > input[type="radio"], +[data-toggle="buttons"] > .btn > input[type="checkbox"] { display: none; } diff --git a/bower_components/bootstrap/less/buttons.less b/bower_components/bootstrap/less/buttons.less index b8bbfc6c..5d60d39a 100644..100755 --- a/bower_components/bootstrap/less/buttons.less +++ b/bower_components/bootstrap/less/buttons.less @@ -12,7 +12,7 @@ padding: @padding-base-vertical @padding-base-horizontal; margin-bottom: 0; // For input.btn font-size: @font-size-base; - font-weight: 500; + font-weight: @btn-font-weight; line-height: @line-height-base; text-align: center; vertical-align: middle; @@ -20,6 +20,7 @@ border: 1px solid transparent; border-radius: @border-radius-base; white-space: nowrap; + .user-select(none); &:focus { .tab-focus(); @@ -27,20 +28,21 @@ &:hover, &:focus { - color: @btn-hover-color; + color: @btn-default-color; text-decoration: none; } &:active, &.active { outline: 0; + background-image: none; .box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); } &.disabled, &[disabled], fieldset[disabled] & { - cursor: default; + cursor: not-allowed; pointer-events: none; // Future-proof disabling of clicks .opacity(.65); .box-shadow(none); @@ -53,26 +55,26 @@ // -------------------------------------------------- .btn-default { - .btn-pseudo-states(@btn-default-color, @btn-default-bg, @btn-default-border); + .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border); } .btn-primary { - .btn-pseudo-states(@btn-primary-color, @btn-primary-bg, @btn-primary-border); + .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border); } // Warning appears as orange .btn-warning { - .btn-pseudo-states(@btn-warning-color, @btn-warning-bg, @btn-warning-border); + .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border); } // Danger and error appear as red .btn-danger { - .btn-pseudo-states(@btn-danger-color, @btn-danger-bg, @btn-danger-border); + .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border); } // Success appears as green .btn-success { - .btn-pseudo-states(@btn-success-color, @btn-success-bg, @btn-success-border); + .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border); } // Info appears as blue-green .btn-info { - .btn-pseudo-states(@btn-info-color, @btn-info-bg, @btn-info-border); + .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border); } @@ -109,7 +111,7 @@ fieldset[disabled] & { &:hover, &:focus { - color: @gray-dark; + color: @btn-link-disabled-color; text-decoration: none; } } @@ -119,16 +121,17 @@ // Button Sizes // -------------------------------------------------- -.btn-large { - padding: @padding-large-vertical @padding-large-horizontal; - font-size: @font-size-large; - border-radius: @border-radius-large; +.btn-lg { + // line-height: ensure even-numbered height of button next to large input + .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); } -.btn-small { - padding: @padding-small-vertical @padding-small-horizontal; - font-size: @font-size-small; - line-height: 1.5; // ensure proper height of button next to small input - border-radius: @border-radius-small; +.btn-sm, +.btn-xs { + // line-height: ensure proper height of button next to small input + .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); +} +.btn-xs { + padding: 1px 5px; } diff --git a/bower_components/bootstrap/less/carousel.less b/bower_components/bootstrap/less/carousel.less index 3526089c..d94108de 100644..100755 --- a/bower_components/bootstrap/less/carousel.less +++ b/bower_components/bootstrap/less/carousel.less @@ -69,9 +69,9 @@ top: 0; left: 0; bottom: 0; - width: 15%; - .opacity(.5); - font-size: 20px; + width: @carousel-control-width; + .opacity(@carousel-control-opacity); + font-size: @carousel-control-font-size; color: @carousel-control-color; text-align: center; text-shadow: @carousel-text-shadow; @@ -81,13 +81,11 @@ // Set gradients for backgrounds &.left { #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001)); - background-color: transparent; } &.right { left: auto; right: 0; #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5)); - background-color: transparent; } // Hover/focus state @@ -99,7 +97,6 @@ } // Toggles - .glyphicon, .icon-prev, .icon-next { position: absolute; @@ -113,7 +110,7 @@ margin-left: -10px; font-family: serif; } - // Non-glyphicon toggles + .icon-prev { &:before { content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) @@ -127,14 +124,17 @@ } // Optional indicator pips -// ----------------------------- +// +// Add an unordered list with the following class and add a list item for each +// slide your carousel holds. + .carousel-indicators { position: absolute; bottom: 10px; left: 50%; z-index: 15; - width: 120px; - margin-left: -60px; + width: 60%; + margin-left: -30%; padding-left: 0; list-style: none; text-align: center; @@ -181,7 +181,6 @@ @media screen and (min-width: @screen-tablet) { // Scale up the controls a smidge - .carousel-control .glyphicon, .carousel-control .icon-prev, .carousel-control .icon-next { width: 30px; diff --git a/bower_components/bootstrap/less/close.less b/bower_components/bootstrap/less/close.less index f915667e..9b4e74f2 100644..100755 --- a/bower_components/bootstrap/less/close.less +++ b/bower_components/bootstrap/less/close.less @@ -6,7 +6,7 @@ .close { float: right; font-size: (@font-size-base * 1.5); - font-weight: bold; + font-weight: @close-font-weight; line-height: 1; color: @close-color; text-shadow: @close-text-shadow; diff --git a/bower_components/bootstrap/less/code.less b/bower_components/bootstrap/less/code.less index cd613256..d6661d2b 100644..100755 --- a/bower_components/bootstrap/less/code.less +++ b/bower_components/bootstrap/less/code.less @@ -16,7 +16,7 @@ code { color: @code-color; background-color: @code-bg; white-space: nowrap; - border-radius: 4px; + border-radius: @border-radius-base; } // Blocks of code @@ -28,7 +28,7 @@ pre { line-height: @line-height-base; word-break: break-all; word-wrap: break-word; - color: @gray-dark; + color: @pre-color; background-color: @pre-bg; border: 1px solid @pre-border-color; border-radius: @border-radius-base; @@ -41,6 +41,7 @@ pre { // Account for some code outputs that place code tags in pre tags code { padding: 0; + font-size: inherit; color: inherit; white-space: pre-wrap; background-color: transparent; @@ -50,6 +51,6 @@ pre { // Enable scrollable blocks of code .pre-scrollable { - max-height: 340px; + max-height: @pre-scrollable-max-height; overflow-y: scroll; } diff --git a/bower_components/bootstrap/less/component-animations.less b/bower_components/bootstrap/less/component-animations.less index 1efe45e2..1efe45e2 100644..100755 --- a/bower_components/bootstrap/less/component-animations.less +++ b/bower_components/bootstrap/less/component-animations.less diff --git a/bower_components/bootstrap/less/dropdowns.less b/bower_components/bootstrap/less/dropdowns.less index 938e682f..d9417358 100644..100755 --- a/bower_components/bootstrap/less/dropdowns.less +++ b/bower_components/bootstrap/less/dropdowns.less @@ -4,21 +4,29 @@ // Dropdown arrow/caret -// -------------------- .caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; - border-top: 4px solid @dropdown-caret-color; - border-right: 4px solid transparent; - border-left: 4px solid transparent; + border-top: @caret-width-base solid @dropdown-caret-color; + border-right: @caret-width-base solid transparent; + border-left: @caret-width-base solid transparent; content: ""; } +// The dropdown wrapper (div) +.dropdown { + position: relative; +} + +// Prevent the focus on the dropdown toggle when closing dropdowns +.dropdown-toggle:focus { + outline: 0; +} + // The dropdown menu (ul) -// ---------------------- .dropdown-menu { position: absolute; top: 100%; @@ -30,12 +38,13 @@ padding: 5px 0; margin: 2px 0 0; // override default ul list-style: none; + font-size: @font-size-base; background-color: @dropdown-bg; border: 1px solid @dropdown-fallback-border; // IE8 fallback border: 1px solid @dropdown-border; border-radius: @border-radius-base; .box-shadow(0 6px 12px rgba(0,0,0,.175)); - .background-clip(padding-box); + background-clip: padding-box; // Aligns the dropdown menu to right &.pull-right { @@ -61,18 +70,16 @@ } // Hover/Focus state -// ----------- .dropdown-menu > li > a { &:hover, &:focus { text-decoration: none; color: @dropdown-link-hover-color; - #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%)); + background-color: @dropdown-link-hover-bg; } } // Active state -// ------------ .dropdown-menu > .active > a { &, &:hover, @@ -80,18 +87,19 @@ color: @dropdown-link-active-color; text-decoration: none; outline: 0; - #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%)); + background-color: @dropdown-link-active-bg; } } // Disabled state -// -------------- +// // Gray out text and ensure the hover/focus state remains gray + .dropdown-menu > .disabled > a { &, &:hover, &:focus { - color: @gray-light; + color: @dropdown-link-disabled-color; } } // Nuke hover/focus effects @@ -107,7 +115,6 @@ } // Open state for the dropdown -// --------------------------- .open { // Show the menu > .dropdown-menu { @@ -121,19 +128,15 @@ } // Dropdown section headers -// --------------------------- .dropdown-header { display: block; padding: 3px 20px; font-size: @font-size-small; line-height: @line-height-base; - color: @gray-light; + color: @dropdown-header-color; } - - // Backdrop to catch body clicks on mobile, etc. -// --------------------------- .dropdown-backdrop { position: fixed; left: 0; @@ -144,16 +147,16 @@ } // Right aligned dropdowns -// --------------------------- .pull-right > .dropdown-menu { right: 0; left: auto; } // Allow for dropdowns to go bottom up (aka, dropup-menu) -// ------------------------------------------------------ +// // Just add .dropup after the standard .dropdown class and you're set, bro. // TODO: abstract this so that the navbar fixed styles are not placed here? + .dropup, .navbar-fixed-bottom .dropdown { // Reverse the caret diff --git a/bower_components/bootstrap/less/forms.less b/bower_components/bootstrap/less/forms.less index 60e45767..c59cdd4d 100644..100755 --- a/bower_components/bootstrap/less/forms.less +++ b/bower_components/bootstrap/less/forms.less @@ -20,7 +20,7 @@ legend { margin-bottom: @line-height-computed; font-size: (@font-size-base * 1.5); line-height: inherit; - color: @gray-dark; + color: @legend-color; border: 0; border-bottom: 1px solid @legend-border-color; } @@ -77,7 +77,7 @@ input[type="checkbox"]:focus { // See https://github.com/twbs/bootstrap/issues/8350 for more. input[type="number"] { &::-webkit-outer-spin-button, - &::-webkit-inner-spin-button { + &::-webkit-inner-spin-button { height: auto; } } @@ -121,7 +121,7 @@ input[type="number"] { padding: @padding-base-vertical @padding-base-horizontal; font-size: @font-size-base; line-height: @line-height-base; - color: @gray; + color: @input-color; vertical-align: middle; background-color: @input-bg; border: 1px solid @input-border; @@ -129,16 +129,13 @@ input[type="number"] { .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); .transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s"); - &:focus { - border-color: rgba(82,168,236,.8); - outline: 0; - .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)"); - } + // Customize the `:focus` state to imitate native WebKit styles. + .form-control-focus(); // Disabled and read-only inputs - // Note: HTML5 says that inputs under a fieldset > legend:first-child won't be - // disabled if the fieldset is disabled. Due to implementation difficulty, - // we don't honor that edge case; we style them as disabled anyway. + // Note: HTML5 says that controls under a fieldset > legend:first-child won't + // be disabled if the fieldset is disabled. Due to implementation difficulty, + // we don't honor that edge case; we style them as disabled anyway. &[disabled], &[readonly], fieldset[disabled] & { @@ -210,37 +207,28 @@ input[type="number"] { margin-left: 10px; // space out consecutive inline controls } - - -// Form control sizing +// Apply same disabled cursor tweak as for inputs // -// Relative text size, padding, and border-radii changes for form controls. For -// horizontal sizing, wrap controls in the predefined grid classes. `<select>` -// element gets special love because it's special, and that's a fact! - -.form-control { - &.input-large { - height: @input-height-large; - padding: @padding-large-vertical @padding-large-horizontal; - font-size: @font-size-large; - border-radius: @border-radius-large; - } - &.input-small { - height: @input-height-small; - padding: @padding-small-vertical @padding-small-horizontal; - font-size: @font-size-small; - border-radius: @border-radius-small; +// Note: Neither radios nor checkboxes can be readonly. +input[type="radio"], +input[type="checkbox"], +.radio, +.radio-inline, +.checkbox, +.checkbox-inline { + &[disabled], + fieldset[disabled] & { + cursor: not-allowed; } } -select { - &.input-large { - height: @input-height-large; - line-height: @input-height-large; - } - &.input-small { - height: @input-height-small; - line-height: @input-height-small; - } + +// Form control sizing +.input-sm { + .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); +} + +.input-lg { + .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); } @@ -250,15 +238,26 @@ select { // Warning .has-warning { - .form-control-validation(@state-warning-text, @state-warning-text, @state-warning-bg); + .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); + .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); + .form-control-validation(@state-success-text; @state-success-text; @state-success-bg); +} + + +// Static form control text +// +// Apply class to a `p` element to make any string of text align with labels in +// a horizontal form layout. + +.form-control-static { + margin-bottom: 0; // Remove default margin from `p` + padding-top: @padding-base-vertical; } @@ -276,137 +275,61 @@ select { -// Input groups -// -------------------------------------------------- - -// Base styles -// ------------------------- -.input-group { - display: table; - border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table - - // Undo padding and float of grid classes - &.col { - float: none; - padding-left: 0; - padding-right: 0; - } - - .form-control { - width: 100%; - margin-bottom: 0; - } -} - -// Display as table-cell -// ------------------------- -.input-group-addon, -.input-group-btn, -.input-group .form-control { - display: table-cell; - - &:not(:first-child):not(:last-child) { - border-radius: 0; - } -} -// Addon and addon wrapper for buttons -.input-group-addon, -.input-group-btn { - width: 1%; - white-space: nowrap; - vertical-align: middle; // Match the inputs -} - -// Text input groups -// ------------------------- -.input-group-addon { - .box-sizing(border-box); - padding: @padding-base-vertical @padding-base-horizontal; - font-size: @font-size-base; - font-weight: normal; - line-height: @line-height-base; - text-align: center; - background-color: @gray-lighter; - border: 1px solid @input-group-addon-border-color; - border-radius: @border-radius-base; - - &.input-small { - padding: @padding-small-vertical @padding-small-horizontal; - font-size: @font-size-small; - border-radius: @border-radius-small; - } - &.input-large { - padding: @padding-large-vertical @padding-large-horizontal; - font-size: @font-size-large; - border-radius: @border-radius-large; - } -} - -// Reset rounded corners -.input-group .form-control:first-child, -.input-group-addon:first-child, -.input-group-btn:first-child > .btn, -.input-group-btn:first-child > .dropdown-toggle, -.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) { - .border-right-radius(0); -} -.input-group-addon:first-child { - border-right: 0; -} -.input-group .form-control:last-child, -.input-group-addon:last-child, -.input-group-btn:last-child > .btn, -.input-group-btn:last-child > .dropdown-toggle, -.input-group-btn:first-child > .btn:not(:first-child) { - .border-left-radius(0); -} -.input-group-addon:last-child { - border-left: 0; -} - -// Button input groups -// ------------------------- -.input-group-btn { - position: relative; - white-space: nowrap; -} -.input-group-btn > .btn { - position: relative; - // Jankily prevent input button groups from wrapping - + .btn { - margin-left: -4px; - } - // Bring the "active" button to the front - &:hover, - &:active { - z-index: 2; - } -} - - // Inline forms -// -------------------------------------------------- +// +// Make forms appear inline(-block) by adding the `.form-inline` class. Inline +// forms begin stacked on extra small (mobile) devices and then go inline when +// viewports reach <768px. +// +// Requires wrapping inputs and labels with `.form-group` for proper display of +// default HTML form controls and our custom form controls (e.g., input groups). +// +// Heads up! This is mixin-ed into `.navbar-form` in navbars.less. .form-inline { - .form-control, - .radio, - .checkbox { - display: inline-block; - } - .radio, - .checkbox { - margin-top: 0; - margin-bottom: 0; + + // Kick in the inline + @media (min-width: @screen-tablet) { + // Inline-block all the things for "inline" + .form-group { + display: inline-block; + margin-bottom: 0; + vertical-align: middle; + } + + // In navbar-form, allow folks to *not* use `.form-group` + .form-control { + display: inline-block; + } + + // Remove default margin on radios/checkboxes that were used for stacking, and + // then undo the floating of radios and checkboxes to match (which also avoids + // a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969). + .radio, + .checkbox { + display: inline-block; + margin-top: 0; + margin-bottom: 0; + padding-left: 0; + } + .radio input[type="radio"], + .checkbox input[type="checkbox"] { + float: none; + margin-left: 0; + } } } // Horizontal forms -// -------------------------------------------------- -// Horizontal forms are built on grid classes. +// +// Horizontal forms are built on grid classes and allow you to create forms with +// labels on the left and inputs on the right. -.form-horizontal .control-label { - padding-top: 6px; +.form-horizontal .control-label, +.form-horizontal .radio-inline, +.form-horizontal .checkbox-inline { + padding-top: @padding-base-vertical; } .form-horizontal { diff --git a/bower_components/bootstrap/less/grid.less b/bower_components/bootstrap/less/grid.less index 12803f39..e3684e5a 100644..100755 --- a/bower_components/bootstrap/less/grid.less +++ b/bower_components/bootstrap/less/grid.less @@ -2,6 +2,7 @@ // Grid system // -------------------------------------------------- + // Set the container width, and override it for fixed navbars in media queries .container { .container-fixed(); @@ -13,18 +14,18 @@ } // Common styles for small and large grid columns -.col-1, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-10, -.col-11, -.col-12, +.col-xs-1, +.col-xs-2, +.col-xs-3, +.col-xs-4, +.col-xs-5, +.col-xs-6, +.col-xs-7, +.col-xs-8, +.col-xs-9, +.col-xs-10, +.col-xs-11, +.col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, @@ -37,6 +38,18 @@ .col-sm-10, .col-sm-11, .col-sm-12, +.col-md-1, +.col-md-2, +.col-md-3, +.col-md-4, +.col-md-5, +.col-md-6, +.col-md-7, +.col-md-8, +.col-md-9, +.col-md-10, +.col-md-11, +.col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, @@ -58,40 +71,49 @@ } - +// Extra small grid // -// Container and grid column sizing +// Grid classes for extra small devices like smartphones. No offset, push, or +// pull classes are present here due to the size of the target. // +// Note that `.col-xs-12` doesn't get floated on purpose—there's no need since +// it's full-width. -// Tiny device columns (smartphones) -.col-1, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-10, -.col-11, -.col-12 { +.col-xs-1, +.col-xs-2, +.col-xs-3, +.col-xs-4, +.col-xs-5, +.col-xs-6, +.col-xs-7, +.col-xs-8, +.col-xs-9, +.col-xs-10, +.col-xs-11 { float: left; } -.col-1 { width: percentage((1 / @grid-columns)); } -.col-2 { width: percentage((2 / @grid-columns)); } -.col-3 { width: percentage((3 / @grid-columns)); } -.col-4 { width: percentage((4 / @grid-columns)); } -.col-5 { width: percentage((5 / @grid-columns)); } -.col-6 { width: percentage((6 / @grid-columns)); } -.col-7 { width: percentage((7 / @grid-columns)); } -.col-8 { width: percentage((8 / @grid-columns)); } -.col-9 { width: percentage((9 / @grid-columns)); } -.col-10 { width: percentage((10/ @grid-columns)); } -.col-11 { width: percentage((11/ @grid-columns)); } -.col-12 { width: 100%; } - -// Small device columns (phones to tablets) +.col-xs-1 { width: percentage((1 / @grid-columns)); } +.col-xs-2 { width: percentage((2 / @grid-columns)); } +.col-xs-3 { width: percentage((3 / @grid-columns)); } +.col-xs-4 { width: percentage((4 / @grid-columns)); } +.col-xs-5 { width: percentage((5 / @grid-columns)); } +.col-xs-6 { width: percentage((6 / @grid-columns)); } +.col-xs-7 { width: percentage((7 / @grid-columns)); } +.col-xs-8 { width: percentage((8 / @grid-columns)); } +.col-xs-9 { width: percentage((9 / @grid-columns)); } +.col-xs-10 { width: percentage((10/ @grid-columns)); } +.col-xs-11 { width: percentage((11/ @grid-columns)); } +.col-xs-12 { width: 100%; } + + +// Small grid +// +// Columns, offsets, pushes, and pulls for the small device range, from phones +// to tablets. +// +// Note that `.col-sm-12` doesn't get floated on purpose—there's no need since +// it's full-width. + @media (min-width: @screen-tablet) { .container { max-width: @container-tablet; @@ -107,8 +129,7 @@ .col-sm-8, .col-sm-9, .col-sm-10, - .col-sm-11, - .col-sm-12 { + .col-sm-11 { float: left; } .col-sm-1 { width: percentage((1 / @grid-columns)); } @@ -125,36 +146,137 @@ .col-sm-12 { width: 100%; } // Push and pull columns for source order changes - .col-push-1 { left: percentage((1 / @grid-columns)); } - .col-push-2 { left: percentage((2 / @grid-columns)); } - .col-push-3 { left: percentage((3 / @grid-columns)); } - .col-push-4 { left: percentage((4 / @grid-columns)); } - .col-push-5 { left: percentage((5 / @grid-columns)); } - .col-push-6 { left: percentage((6 / @grid-columns)); } - .col-push-7 { left: percentage((7 / @grid-columns)); } - .col-push-8 { left: percentage((8 / @grid-columns)); } - .col-push-9 { left: percentage((9 / @grid-columns)); } - .col-push-10 { left: percentage((10/ @grid-columns)); } - .col-push-11 { left: percentage((11/ @grid-columns)); } - - .col-pull-1 { right: percentage((1 / @grid-columns)); } - .col-pull-2 { right: percentage((2 / @grid-columns)); } - .col-pull-3 { right: percentage((3 / @grid-columns)); } - .col-pull-4 { right: percentage((4 / @grid-columns)); } - .col-pull-5 { right: percentage((5 / @grid-columns)); } - .col-pull-6 { right: percentage((6 / @grid-columns)); } - .col-pull-7 { right: percentage((7 / @grid-columns)); } - .col-pull-8 { right: percentage((8 / @grid-columns)); } - .col-pull-9 { right: percentage((9 / @grid-columns)); } - .col-pull-10 { right: percentage((10/ @grid-columns)); } - .col-pull-11 { right: percentage((11/ @grid-columns)); } + .col-sm-push-1 { left: percentage((1 / @grid-columns)); } + .col-sm-push-2 { left: percentage((2 / @grid-columns)); } + .col-sm-push-3 { left: percentage((3 / @grid-columns)); } + .col-sm-push-4 { left: percentage((4 / @grid-columns)); } + .col-sm-push-5 { left: percentage((5 / @grid-columns)); } + .col-sm-push-6 { left: percentage((6 / @grid-columns)); } + .col-sm-push-7 { left: percentage((7 / @grid-columns)); } + .col-sm-push-8 { left: percentage((8 / @grid-columns)); } + .col-sm-push-9 { left: percentage((9 / @grid-columns)); } + .col-sm-push-10 { left: percentage((10/ @grid-columns)); } + .col-sm-push-11 { left: percentage((11/ @grid-columns)); } + + .col-sm-pull-1 { right: percentage((1 / @grid-columns)); } + .col-sm-pull-2 { right: percentage((2 / @grid-columns)); } + .col-sm-pull-3 { right: percentage((3 / @grid-columns)); } + .col-sm-pull-4 { right: percentage((4 / @grid-columns)); } + .col-sm-pull-5 { right: percentage((5 / @grid-columns)); } + .col-sm-pull-6 { right: percentage((6 / @grid-columns)); } + .col-sm-pull-7 { right: percentage((7 / @grid-columns)); } + .col-sm-pull-8 { right: percentage((8 / @grid-columns)); } + .col-sm-pull-9 { right: percentage((9 / @grid-columns)); } + .col-sm-pull-10 { right: percentage((10/ @grid-columns)); } + .col-sm-pull-11 { right: percentage((11/ @grid-columns)); } + + // Offsets + .col-sm-offset-1 { margin-left: percentage((1 / @grid-columns)); } + .col-sm-offset-2 { margin-left: percentage((2 / @grid-columns)); } + .col-sm-offset-3 { margin-left: percentage((3 / @grid-columns)); } + .col-sm-offset-4 { margin-left: percentage((4 / @grid-columns)); } + .col-sm-offset-5 { margin-left: percentage((5 / @grid-columns)); } + .col-sm-offset-6 { margin-left: percentage((6 / @grid-columns)); } + .col-sm-offset-7 { margin-left: percentage((7 / @grid-columns)); } + .col-sm-offset-8 { margin-left: percentage((8 / @grid-columns)); } + .col-sm-offset-9 { margin-left: percentage((9 / @grid-columns)); } + .col-sm-offset-10 { margin-left: percentage((10/ @grid-columns)); } + .col-sm-offset-11 { margin-left: percentage((11/ @grid-columns)); } } -// Medium and large device columns (desktop and up) + +// Medium grid +// +// Columns, offsets, pushes, and pulls for the desktop device range. +// +// Note that `.col-md-12` doesn't get floated on purpose—there's no need since +// it's full-width. + @media (min-width: @screen-desktop) { .container { max-width: @container-desktop; } + .col-md-1, + .col-md-2, + .col-md-3, + .col-md-4, + .col-md-5, + .col-md-6, + .col-md-7, + .col-md-8, + .col-md-9, + .col-md-10, + .col-md-11 { + float: left; + } + .col-md-1 { width: percentage((1 / @grid-columns)); } + .col-md-2 { width: percentage((2 / @grid-columns)); } + .col-md-3 { width: percentage((3 / @grid-columns)); } + .col-md-4 { width: percentage((4 / @grid-columns)); } + .col-md-5 { width: percentage((5 / @grid-columns)); } + .col-md-6 { width: percentage((6 / @grid-columns)); } + .col-md-7 { width: percentage((7 / @grid-columns)); } + .col-md-8 { width: percentage((8 / @grid-columns)); } + .col-md-9 { width: percentage((9 / @grid-columns)); } + .col-md-10 { width: percentage((10/ @grid-columns)); } + .col-md-11 { width: percentage((11/ @grid-columns)); } + .col-md-12 { width: 100%; } + + // Push and pull columns for source order changes + .col-md-push-0 { left: auto; } + .col-md-push-1 { left: percentage((1 / @grid-columns)); } + .col-md-push-2 { left: percentage((2 / @grid-columns)); } + .col-md-push-3 { left: percentage((3 / @grid-columns)); } + .col-md-push-4 { left: percentage((4 / @grid-columns)); } + .col-md-push-5 { left: percentage((5 / @grid-columns)); } + .col-md-push-6 { left: percentage((6 / @grid-columns)); } + .col-md-push-7 { left: percentage((7 / @grid-columns)); } + .col-md-push-8 { left: percentage((8 / @grid-columns)); } + .col-md-push-9 { left: percentage((9 / @grid-columns)); } + .col-md-push-10 { left: percentage((10/ @grid-columns)); } + .col-md-push-11 { left: percentage((11/ @grid-columns)); } + + .col-md-pull-0 { right: auto; } + .col-md-pull-1 { right: percentage((1 / @grid-columns)); } + .col-md-pull-2 { right: percentage((2 / @grid-columns)); } + .col-md-pull-3 { right: percentage((3 / @grid-columns)); } + .col-md-pull-4 { right: percentage((4 / @grid-columns)); } + .col-md-pull-5 { right: percentage((5 / @grid-columns)); } + .col-md-pull-6 { right: percentage((6 / @grid-columns)); } + .col-md-pull-7 { right: percentage((7 / @grid-columns)); } + .col-md-pull-8 { right: percentage((8 / @grid-columns)); } + .col-md-pull-9 { right: percentage((9 / @grid-columns)); } + .col-md-pull-10 { right: percentage((10/ @grid-columns)); } + .col-md-pull-11 { right: percentage((11/ @grid-columns)); } + + // Offsets + .col-md-offset-0 { margin-left: 0; } + .col-md-offset-1 { margin-left: percentage((1 / @grid-columns)); } + .col-md-offset-2 { margin-left: percentage((2 / @grid-columns)); } + .col-md-offset-3 { margin-left: percentage((3 / @grid-columns)); } + .col-md-offset-4 { margin-left: percentage((4 / @grid-columns)); } + .col-md-offset-5 { margin-left: percentage((5 / @grid-columns)); } + .col-md-offset-6 { margin-left: percentage((6 / @grid-columns)); } + .col-md-offset-7 { margin-left: percentage((7 / @grid-columns)); } + .col-md-offset-8 { margin-left: percentage((8 / @grid-columns)); } + .col-md-offset-9 { margin-left: percentage((9 / @grid-columns)); } + .col-md-offset-10 { margin-left: percentage((10/ @grid-columns)); } + .col-md-offset-11 { margin-left: percentage((11/ @grid-columns)); } +} + + +// Large grid +// +// Columns, offsets, pushes, and pulls for the large desktop device range. +// +// Note that `.col-lg-12` doesn't get floated on purpose—there's no need since +// it's full-width. + +@media (min-width: @screen-large-desktop) { + .container { + max-width: @container-large-desktop; + } + .col-lg-1, .col-lg-2, .col-lg-3, @@ -165,8 +287,7 @@ .col-lg-8, .col-lg-9, .col-lg-10, - .col-lg-11, - .col-lg-12 { + .col-lg-11 { float: left; } .col-lg-1 { width: percentage((1 / @grid-columns)); } @@ -182,23 +303,44 @@ .col-lg-11 { width: percentage((11/ @grid-columns)); } .col-lg-12 { width: 100%; } - // Offsets - .col-offset-1 { margin-left: percentage((1 / @grid-columns)); } - .col-offset-2 { margin-left: percentage((2 / @grid-columns)); } - .col-offset-3 { margin-left: percentage((3 / @grid-columns)); } - .col-offset-4 { margin-left: percentage((4 / @grid-columns)); } - .col-offset-5 { margin-left: percentage((5 / @grid-columns)); } - .col-offset-6 { margin-left: percentage((6 / @grid-columns)); } - .col-offset-7 { margin-left: percentage((7 / @grid-columns)); } - .col-offset-8 { margin-left: percentage((8 / @grid-columns)); } - .col-offset-9 { margin-left: percentage((9 / @grid-columns)); } - .col-offset-10 { margin-left: percentage((10/ @grid-columns)); } - .col-offset-11 { margin-left: percentage((11/ @grid-columns)); } -} + // Push and pull columns for source order changes + .col-lg-push-0 { left: auto; } + .col-lg-push-1 { left: percentage((1 / @grid-columns)); } + .col-lg-push-2 { left: percentage((2 / @grid-columns)); } + .col-lg-push-3 { left: percentage((3 / @grid-columns)); } + .col-lg-push-4 { left: percentage((4 / @grid-columns)); } + .col-lg-push-5 { left: percentage((5 / @grid-columns)); } + .col-lg-push-6 { left: percentage((6 / @grid-columns)); } + .col-lg-push-7 { left: percentage((7 / @grid-columns)); } + .col-lg-push-8 { left: percentage((8 / @grid-columns)); } + .col-lg-push-9 { left: percentage((9 / @grid-columns)); } + .col-lg-push-10 { left: percentage((10/ @grid-columns)); } + .col-lg-push-11 { left: percentage((11/ @grid-columns)); } -// Large desktops and up -@media (min-width: @screen-large-desktop) { - .container { - max-width: @container-large-desktop; - } + .col-lg-pull-0 { right: auto; } + .col-lg-pull-1 { right: percentage((1 / @grid-columns)); } + .col-lg-pull-2 { right: percentage((2 / @grid-columns)); } + .col-lg-pull-3 { right: percentage((3 / @grid-columns)); } + .col-lg-pull-4 { right: percentage((4 / @grid-columns)); } + .col-lg-pull-5 { right: percentage((5 / @grid-columns)); } + .col-lg-pull-6 { right: percentage((6 / @grid-columns)); } + .col-lg-pull-7 { right: percentage((7 / @grid-columns)); } + .col-lg-pull-8 { right: percentage((8 / @grid-columns)); } + .col-lg-pull-9 { right: percentage((9 / @grid-columns)); } + .col-lg-pull-10 { right: percentage((10/ @grid-columns)); } + .col-lg-pull-11 { right: percentage((11/ @grid-columns)); } + + // Offsets + .col-lg-offset-0 { margin-left: 0; } + .col-lg-offset-1 { margin-left: percentage((1 / @grid-columns)); } + .col-lg-offset-2 { margin-left: percentage((2 / @grid-columns)); } + .col-lg-offset-3 { margin-left: percentage((3 / @grid-columns)); } + .col-lg-offset-4 { margin-left: percentage((4 / @grid-columns)); } + .col-lg-offset-5 { margin-left: percentage((5 / @grid-columns)); } + .col-lg-offset-6 { margin-left: percentage((6 / @grid-columns)); } + .col-lg-offset-7 { margin-left: percentage((7 / @grid-columns)); } + .col-lg-offset-8 { margin-left: percentage((8 / @grid-columns)); } + .col-lg-offset-9 { margin-left: percentage((9 / @grid-columns)); } + .col-lg-offset-10 { margin-left: percentage((10/ @grid-columns)); } + .col-lg-offset-11 { margin-left: percentage((11/ @grid-columns)); } } diff --git a/bower_components/bootstrap/less/input-groups.less b/bower_components/bootstrap/less/input-groups.less new file mode 100755 index 00000000..570f03f9 --- /dev/null +++ b/bower_components/bootstrap/less/input-groups.less @@ -0,0 +1,127 @@ +// +// Input groups +// -------------------------------------------------- + +// Base styles +// ------------------------- +.input-group { + position: relative; // For dropdowns + display: table; + border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table + + // Undo padding and float of grid classes + &.col { + float: none; + padding-left: 0; + padding-right: 0; + } + + .form-control { + width: 100%; + margin-bottom: 0; + } +} + +// Sizing options +// +// Remix the default form control sizing classes into new ones for easier +// manipulation. + +.input-group-lg > .form-control, +.input-group-lg > .input-group-addon, +.input-group-lg > .input-group-btn > .btn { .input-lg(); } +.input-group-sm > .form-control, +.input-group-sm > .input-group-addon, +.input-group-sm > .input-group-btn > .btn { .input-sm(); } + + +// Display as table-cell +// ------------------------- +.input-group-addon, +.input-group-btn, +.input-group .form-control { + display: table-cell; + + &:not(:first-child):not(:last-child) { + border-radius: 0; + } +} +// Addon and addon wrapper for buttons +.input-group-addon, +.input-group-btn { + width: 1%; + white-space: nowrap; + vertical-align: middle; // Match the inputs +} + +// Text input groups +// ------------------------- +.input-group-addon { + padding: @padding-base-vertical @padding-base-horizontal; + font-size: @font-size-base; + font-weight: normal; + line-height: 1; + text-align: center; + background-color: @input-group-addon-bg; + border: 1px solid @input-group-addon-border-color; + border-radius: @border-radius-base; + + // Sizing + &.input-sm { + padding: @padding-small-vertical @padding-small-horizontal; + font-size: @font-size-small; + border-radius: @border-radius-small; + } + &.input-lg { + padding: @padding-large-vertical @padding-large-horizontal; + font-size: @font-size-large; + border-radius: @border-radius-large; + } + + // Nuke default margins from checkboxes and radios to vertically center within. + input[type="radio"], + input[type="checkbox"] { + margin-top: 0; + } +} + +// Reset rounded corners +.input-group .form-control:first-child, +.input-group-addon:first-child, +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .dropdown-toggle, +.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) { + .border-right-radius(0); +} +.input-group-addon:first-child { + border-right: 0; +} +.input-group .form-control:last-child, +.input-group-addon:last-child, +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .dropdown-toggle, +.input-group-btn:first-child > .btn:not(:first-child) { + .border-left-radius(0); +} +.input-group-addon:last-child { + border-left: 0; +} + +// Button input groups +// ------------------------- +.input-group-btn { + position: relative; + white-space: nowrap; +} +.input-group-btn > .btn { + position: relative; + // Jankily prevent input button groups from wrapping + + .btn { + margin-left: -4px; + } + // Bring the "active" button to the front + &:hover, + &:active { + z-index: 2; + } +} diff --git a/bower_components/bootstrap/less/jumbotron.less b/bower_components/bootstrap/less/jumbotron.less index ca51b481..ca51b481 100644..100755 --- a/bower_components/bootstrap/less/jumbotron.less +++ b/bower_components/bootstrap/less/jumbotron.less diff --git a/bower_components/bootstrap/less/labels.less b/bower_components/bootstrap/less/labels.less index 7ee7ee68..6a022981 100644..100755 --- a/bower_components/bootstrap/less/labels.less +++ b/bower_components/bootstrap/less/labels.less @@ -6,13 +6,12 @@ display: inline; padding: .25em .6em; font-size: 75%; - font-weight: 500; + font-weight: bold; line-height: 1; color: @label-color; text-align: center; white-space: nowrap; - vertical-align: middle; - background-color: @gray-light; + vertical-align: baseline; border-radius: .25em; // Add hover effects, but only for links @@ -22,25 +21,38 @@ color: @label-link-hover-color; text-decoration: none; cursor: pointer; - background-color: darken(@gray-light, 10%); } } + + // Empty labels collapse automatically (not available in IE8) + &:empty { + display: none; + } } // Colors // Contextual variations (linked labels get darker on :hover) -.label-danger { - .label-variant(@label-danger-bg); + +.label-default { + .label-variant(@label-default-bg); +} + +.label-primary { + .label-variant(@label-primary-bg); } .label-success { .label-variant(@label-success-bg); } +.label-info { + .label-variant(@label-info-bg); +} + .label-warning { .label-variant(@label-warning-bg); } -.label-info { - .label-variant(@label-info-bg); +.label-danger { + .label-variant(@label-danger-bg); } diff --git a/bower_components/bootstrap/less/list-group.less b/bower_components/bootstrap/less/list-group.less index ad6ac96a..46cda408 100644..100755 --- a/bower_components/bootstrap/less/list-group.less +++ b/bower_components/bootstrap/less/list-group.less @@ -9,7 +9,6 @@ // 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 - background-color: @list-group-bg; } // Individual list items @@ -18,61 +17,49 @@ .list-group-item { position: relative; display: block; - padding: 10px 30px 10px 15px; + padding: 10px 15px; // Place the border on the list items and negative margin up for better styling margin-bottom: -1px; + background-color: @list-group-bg; border: 1px solid @list-group-border; // Round the first and last items &:first-child { - .border-top-radius(@border-radius-base); + .border-top-radius(@list-group-border-radius); } &:last-child { margin-bottom: 0; - .border-bottom-radius(@border-radius-base); + .border-bottom-radius(@list-group-border-radius); } // Align badges within list items > .badge { float: right; - margin-right: -15px; } -} - -// Custom content options -// ------------------------- - -.list-group-item-heading { - margin-top: 0; - margin-bottom: 5px; -} -.list-group-item-text { - margin-bottom: 0; - line-height: 1.3; -} - -// Linked list items -// ------------------------- - -// Custom content within linked items -a.list-group-item { - // Colorize content accordingly - .list-group-item-heading { - color: @list-group-link-heading-color; + > .badge + .badge { + margin-right: 5px; } - .list-group-item-text { + + // Linked list items + a& { color: @list-group-link-color; - } - // Hover state - &:hover, - &:focus { - text-decoration: none; - background-color: @list-group-hover-bg; + .list-group-item-heading { + color: @list-group-link-heading-color; + } + + // Hover state + &:hover, + &:focus { + text-decoration: none; + background-color: @list-group-hover-bg; + } } // Active class on item itself, not parent - &.active { + &.active, + &.active:hover, + &.active:focus { z-index: 2; // Place active items above their siblings for proper border styling color: @list-group-active-color; background-color: @list-group-active-bg; @@ -87,3 +74,15 @@ a.list-group-item { } } } + +// Custom content options +// ------------------------- + +.list-group-item-heading { + margin-top: 0; + margin-bottom: 5px; +} +.list-group-item-text { + margin-bottom: 0; + line-height: 1.3; +} diff --git a/bower_components/bootstrap/less/media.less b/bower_components/bootstrap/less/media.less index 5ad22cd6..5ad22cd6 100644..100755 --- a/bower_components/bootstrap/less/media.less +++ b/bower_components/bootstrap/less/media.less diff --git a/bower_components/bootstrap/less/mixins.less b/bower_components/bootstrap/less/mixins.less index 2fb9a8ff..f726b940 100644..100755 --- a/bower_components/bootstrap/less/mixins.less +++ b/bower_components/bootstrap/less/mixins.less @@ -44,12 +44,12 @@ } // Sizing shortcuts -.size(@width, @height) { +.size(@width; @height) { width: @width; height: @height; } .square(@size) { - .size(@size, @size); + .size(@size; @size); } // Placeholder text @@ -130,25 +130,25 @@ // Transformations .rotate(@degrees) { -webkit-transform: rotate(@degrees); - -ms-transform: rotate(@degrees); + -ms-transform: rotate(@degrees); // IE9+ transform: rotate(@degrees); } .scale(@ratio) { -webkit-transform: scale(@ratio); - -ms-transform: scale(@ratio); + -ms-transform: scale(@ratio); // IE9+ transform: scale(@ratio); } -.translate(@x, @y) { +.translate(@x; @y) { -webkit-transform: translate(@x, @y); - -ms-transform: translate(@x, @y); + -ms-transform: translate(@x, @y); // IE9+ transform: translate(@x, @y); } -.skew(@x, @y) { +.skew(@x; @y) { -webkit-transform: skew(@x, @y); - -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885 + -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+ transform: skew(@x, @y); } -.translate3d(@x, @y, @z) { +.translate3d(@x; @y; @z) { -webkit-transform: translate3d(@x, @y, @z); transform: translate3d(@x, @y, @z); } @@ -158,19 +158,9 @@ // Default value is `visible`, but can be changed to `hidden` // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples .backface-visibility(@visibility){ - -webkit-backface-visibility: @visibility; - -moz-backface-visibility: @visibility; - backface-visibility: @visibility; -} - -// Background clipping -.background-clip(@clip) { - background-clip: @clip; -} - -// Background sizing -.background-size(@size) { - background-size: @size; + -webkit-backface-visibility: @visibility; + -moz-backface-visibility: @visibility; + backface-visibility: @visibility; } // Box sizing @@ -185,7 +175,7 @@ .user-select(@select) { -webkit-user-select: @select; -moz-user-select: @select; - -ms-user-select: @select; + -ms-user-select: @select; // IE10+ -o-user-select: @select; user-select: @select; } @@ -197,7 +187,7 @@ } // CSS3 Content Columns -.content-columns(@column-count, @column-gap: @grid-gutter-width) { +.content-columns(@column-count; @column-gap: @grid-gutter-width) { -webkit-column-count: @column-count; -moz-column-count: @column-count; column-count: @column-count; @@ -211,7 +201,7 @@ word-wrap: break-word; -webkit-hyphens: @mode; -moz-hyphens: @mode; - -ms-hyphens: @mode; + -ms-hyphens: @mode; // IE10+ -o-hyphens: @mode; hyphens: @mode; } @@ -235,8 +225,7 @@ // // Creates two color stops, start and end, by specifying a color and position for each color stop. // Color stops are not available in IE9 and below. - .horizontal(@start-color: #555; @start-percent: 0%; @end-color: #333; @end-percent: 100%) { - background-color: @end-color; + .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { background-image: -webkit-gradient(linear, @start-percent top, @end-percent top, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+ background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1+, Chrome 10+ background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // FF 3.6+ @@ -249,8 +238,7 @@ // // Creates two color stops, start and end, by specifying a color and position for each color stop. // Color stops are not available in IE9 and below. - .vertical(@start-color: #555; @start-percent: 0%; @end-color: #333; @end-percent: 100%) { - background-color: @end-color; + .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { background-image: -webkit-gradient(linear, left @start-percent, left @end-percent, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+ background-image: -webkit-linear-gradient(top, @start-color, @start-percent, @end-color, @end-percent); // Safari 5.1+, Chrome 10+ background-image: -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // FF 3.6+ @@ -259,15 +247,13 @@ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down } - .directional(@start-color: #555, @end-color: #333, @deg: 45deg) { - background-color: @end-color; + .directional(@start-color: #555; @end-color: #333; @deg: 45deg) { background-repeat: repeat-x; background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1+, Chrome 10+ background-image: -moz-linear-gradient(@deg, @start-color, @end-color); // FF 3.6+ background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10 } - .horizontal-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) { - background-color: mix(@mid-color, @end-color, 80%); + .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color)); background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); @@ -275,9 +261,7 @@ background-repeat: no-repeat; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback } - - .vertical-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) { - background-color: mix(@mid-color, @end-color, 80%); + .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color)); background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color); @@ -285,16 +269,14 @@ background-repeat: no-repeat; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback } - .radial(@inner-color: #555, @outer-color: #333) { - background-color: @outer-color; + .radial(@inner-color: #555; @outer-color: #333) { background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color)); background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color); background-image: -moz-radial-gradient(circle, @inner-color, @outer-color); background-image: radial-gradient(circle, @inner-color, @outer-color); background-repeat: no-repeat; } - .striped(@color: #555, @angle: 45deg) { - background-color: @color; + .striped(@color: #555; @angle: 45deg) { 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); @@ -312,11 +294,11 @@ -// RETINA IMAGE SUPPORT -// -------------------------------------------------- - +// Retina images +// // Short retina mixin for setting background-image and -size -.img-retina(@file-1x, @file-2x, @width-1x, @height-1x) { + +.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { background-image: url("@{file-1x}"); @media @@ -332,6 +314,17 @@ } +// Responsive image +// +// Keep images from scaling beyond the width of their parents. + +.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 +} + + // COMPONENT MIXINS // -------------------------------------------------- @@ -345,9 +338,28 @@ background-color: @color; } +// Panels +// ------------------------- +.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) { + border-color: @border; + & > .panel-heading { + color: @heading-text-color; + background-color: @heading-bg-color; + border-color: @heading-border; + + .panel-collapse .panel-body { + border-top-color: @border; + } + } + & > .panel-footer { + + .panel-collapse .panel-body { + border-bottom-color: @border; + } + } +} + // Alerts // ------------------------- -.alert-variant(@background, @border, @text-color) { +.alert-variant(@background; @border; @text-color) { background-color: @background; border-color: @border; color: @text-color; @@ -359,11 +371,40 @@ } } -// Button pseudo states +// Tables +// ------------------------- +.table-row-variant(@state; @background; @border) { + // Exact selectors below required to override `.table-striped` and prevent + // inheritance to nested tables. + .table > thead > tr, + .table > tbody > tr, + .table > tfoot > tr { + > td.@{state}, + > th.@{state}, + &.@{state} > td, + &.@{state} > th { + background-color: @background; + border-color: @border; + } + } + + // Hover states for `.table-hover` + // Note: this is not available for cells or rows within `thead` or `tfoot`. + .table-hover > tbody > tr { + > td.@{state}:hover, + > th.@{state}:hover, + &.@{state}:hover > td { + background-color: darken(@background, 5%); + border-color: darken(@border, 5%); + } + } +} + +// Button variants // ------------------------- // Easily pump out default styles, as well as :hover, :focus, :active, // and disabled options for all buttons -.btn-pseudo-states(@color, @background, @border) { +.button-variant(@color; @background; @border) { color: @color; background-color: @background; border-color: @border; @@ -371,11 +412,17 @@ &:hover, &:focus, &:active, - &.active { - background-color: darken(@background, 5%); - border-color: darken(@border, 10%); + &.active, + .open .dropdown-toggle& { + color: @color; + background-color: darken(@background, 8%); + border-color: darken(@border, 12%); + } + &:active, + &.active, + .open .dropdown-toggle& { + background-image: none; } - &.disabled, &[disabled], fieldset[disabled] & { @@ -390,6 +437,39 @@ } } +// Button sizes +// ------------------------- +.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { + padding: @padding-vertical @padding-horizontal; + font-size: @font-size; + line-height: @line-height; + border-radius: @border-radius; +} + +// Pagination +// ------------------------- +.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) { + > li { + > a, + > span { + padding: @padding-vertical @padding-horizontal; + font-size: @font-size; + } + &:first-child { + > a, + > span { + .border-left-radius(@border-radius); + } + } + &:last-child { + > a, + > span { + .border-right-radius(@border-radius); + } + } + } +} + // Labels // ------------------------- .label-variant(@color) { @@ -405,7 +485,7 @@ // Navbar vertical align // ------------------------- // Vertically center elements in the navbar. -// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin. +// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin. .navbar-vertical-align(@element-height) { margin-top: ((@navbar-height - @element-height) / 2); margin-bottom: ((@navbar-height - @element-height) / 2); @@ -448,79 +528,142 @@ } // Creates a wrapper for a series of columns -.make-row() { +.make-row(@gutter: @grid-gutter-width) { // Then clear the floated columns .clearfix(); - @media (min-width: @screen-small) { - margin-left: (@grid-gutter-width / -2); - margin-right: (@grid-gutter-width / -2); + .container & { + @media (min-width: @screen-small) { + margin-left: (@gutter / -2); + margin-right: (@gutter / -2); + } } // Negative margin nested rows out to align the content of columns .row { - margin-left: (@grid-gutter-width / -2); - margin-right: (@grid-gutter-width / -2); + margin-left: (@gutter / -2); + margin-right: (@gutter / -2); + } +} + +// Generate the extra small columns +.make-xs-column(@columns; @gutter: @grid-gutter-width) { + 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); +} + +// 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-small) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +// Generate the small column offsets +.make-sm-column-offset(@columns) { + @media (min-width: @screen-small) { + margin-left: percentage((@columns / @grid-columns)); + } +} +.make-sm-column-push(@columns) { + @media (min-width: @screen-small) { + left: percentage((@columns / @grid-columns)); + } +} +.make-sm-column-pull(@columns) { + @media (min-width: @screen-small) { + right: percentage((@columns / @grid-columns)); } } -// Generate the columns -.make-column(@columns) { +// 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: (@grid-gutter-width / 2); - padding-right: (@grid-gutter-width / 2); + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); // Calculate width based on number of columns available - @media (min-width: @grid-float-breakpoint) { + @media (min-width: @screen-medium) { float: left; width: percentage((@columns / @grid-columns)); } } -// Generate the column offsets -.make-column-offset(@columns) { - @media (min-width: @grid-float-breakpoint) { +// Generate the large column offsets +.make-md-column-offset(@columns) { + @media (min-width: @screen-medium) { margin-left: percentage((@columns / @grid-columns)); } } -.make-column-push(@columns) { - @media (min-width: @grid-float-breakpoint) { +.make-md-column-push(@columns) { + @media (min-width: @screen-medium) { left: percentage((@columns / @grid-columns)); } } -.make-column-pull(@columns) { - @media (min-width: @grid-float-breakpoint) { +.make-md-column-pull(@columns) { + @media (min-width: @screen-medium) { right: percentage((@columns / @grid-columns)); } } -// Generate the small columns -.make-small-column(@columns) { +// Generate the large columns +.make-lg-column(@columns; @gutter: @grid-gutter-width) { position: relative; - float: left; // Prevent columns from collapsing when empty min-height: 1px; // Inner gutter via padding - padding-left: (@grid-gutter-width / 2); - padding-right: (@grid-gutter-width / 2); - @max-width: (@grid-float-breakpoint - 1); + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); // Calculate width based on number of columns available - @media (max-width: @max-width) { + @media (min-width: @screen-large) { + float: left; width: percentage((@columns / @grid-columns)); } } +// Generate the large column offsets +.make-lg-column-offset(@columns) { + @media (min-width: @screen-large) { + margin-left: percentage((@columns / @grid-columns)); + } +} +.make-lg-column-push(@columns) { + @media (min-width: @screen-large) { + left: percentage((@columns / @grid-columns)); + } +} +.make-lg-column-pull(@columns) { + @media (min-width: @screen-large) { + right: percentage((@columns / @grid-columns)); + } +} + // Form validation states // // Used in forms.less to generate the form validation CSS for warnings, errors, // and successes. -.form-control-validation(@text-color: #555, @border-color: #ccc, @background-color: #f5f5f5) { +.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) { // Color the label and help text .help-block, .control-label { @@ -528,7 +671,6 @@ } // Set the border and box shadow on specific inputs to match .form-control { - padding-right: 32px; // to account for the feedback icon border-color: @border-color; .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work &:focus { @@ -544,3 +686,48 @@ background-color: @background-color; } } + +// Form control focus state +// +// Generate a customized focus state and for any input with the specified color, +// which defaults to the `@input-focus-border` variable. +// +// We highly encourage you to not customize the default value, but instead use +// this to tweak colors on an as-needed basis. This aesthetic change is based on +// WebKit's default styles, but applicable to a wider range of browsers. Its +// usability and accessibility should be taken into account with any change. +// +// Example usage: change the default blue border and shadow to white for better +// contrast against a dark gray background. + +.form-control-focus(@color: @input-border-focus) { + @color-rgba: rgba(red(@color), green(@color), blue(@color), .6); + &:focus { + border-color: @color; + outline: 0; + .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}"); + } +} + +// Form control sizing +// +// Relative text size, padding, and border-radii changes for form controls. For +// horizontal sizing, wrap controls in the predefined grid classes. `<select>` +// element gets special love because it's special, and that's a fact! + +.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { + height: @input-height; + padding: @padding-vertical @padding-horizontal; + font-size: @font-size; + line-height: @line-height; + border-radius: @border-radius; + + select& { + height: @input-height; + line-height: @input-height; + } + + textarea& { + height: auto; + } +} diff --git a/bower_components/bootstrap/less/modals.less b/bower_components/bootstrap/less/modals.less index 8b7349ce..b43ecfd9 100644..100755 --- a/bower_components/bootstrap/less/modals.less +++ b/bower_components/bootstrap/less/modals.less @@ -29,15 +29,13 @@ .translate(0, -25%); .transition-transform(~"0.3s ease-out"); } - &.fade.in .modal-dialog { .translate(0, 0)} + &.in .modal-dialog { .translate(0, 0)} } // Shell div to position the modal with bottom padding .modal-dialog { - position: relative; - top: 0; - left: 0; - right: 0; + margin-left: auto; + margin-right: auto; width: auto; padding: 10px; z-index: (@zindex-modal-background + 10); @@ -51,7 +49,7 @@ border: 1px solid @modal-content-border-color; border-radius: @border-radius-large; .box-shadow(0 3px 9px rgba(0,0,0,.5)); - .background-clip(padding-box); + background-clip: padding-box; // Remove focus outline from opened modal outline: none; } @@ -67,7 +65,7 @@ background-color: @modal-backdrop-bg; // Fade for backdrop &.fade { .opacity(0); } - &.fade.in { .opacity(.5); } + &.in { .opacity(.5); } } // Modal header @@ -124,8 +122,7 @@ .modal-dialog { left: 50%; right: auto; - width: 560px; - margin-left: -280px; + width: 600px; padding-top: 30px; padding-bottom: 30px; } diff --git a/bower_components/bootstrap/less/navbar.less b/bower_components/bootstrap/less/navbar.less index 653a8d6d..b5320ba4 100644..100755 --- a/bower_components/bootstrap/less/navbar.less +++ b/bower_components/bootstrap/less/navbar.less @@ -2,73 +2,101 @@ // Navbars // -------------------------------------------------- + // Wrapper and base class +// +// Provide a static navbar from which we expand to create full-width, fixed, and +// other navbar variations. + .navbar { position: relative; min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode) - margin-bottom: 20px; - padding-left: @navbar-padding-horizontal; - padding-right: @navbar-padding-horizontal; + margin-bottom: @navbar-margin-bottom; background-color: @navbar-bg; - border-radius: @border-radius-base; + border: 1px solid @navbar-border; // Prevent floats from breaking the navbar .clearfix(); + + @media (min-width: @grid-float-breakpoint) { + border-radius: @navbar-border-radius; + } } -// Navbar nav links -// ------------------------- -.navbar-nav { - // Space out from .navbar .brand and .btn-navbar when stacked in mobile views - margin-top: 10px; - margin-bottom: 15px; +// Navbar heading +// +// Groups `.navbar-brand` and `.navbar-toggle` into a single component for easy +// styling of responsive aspects. - > li > a { - padding-top: ((@navbar-height - @line-height-computed) / 2); - padding-bottom: ((@navbar-height - @line-height-computed) / 2); - color: @navbar-link-color; - line-height: 20px; - border-radius: @border-radius-base; - &:hover, - &:focus { - color: @navbar-link-hover-color; - background-color: @navbar-link-hover-bg; - } +.navbar-header { + padding-left: @navbar-padding-horizontal; + padding-right: @navbar-padding-horizontal; + .clearfix(); + + @media (min-width: @grid-float-breakpoint) { + float: left; } - > .active > a { - &, - &:hover, - &:focus { - color: @navbar-link-active-color; - background-color: @navbar-link-active-bg; - } +} + + +// Navbar collapse (body) +// +// Group your navbar content into this for easy collapsing and expanding across +// various device sizes. By default, this content is collapsed when <768px, but +// will expand past that for a horizontal display. +// +// To start (on mobile devices) the navbar links, forms, and buttons are stacked +// vertically and include a `max-height` to overflow in case you have too much +// content for the user's viewport. + +.navbar-collapse { + max-height: 340px; + overflow-x: visible; + padding-right: @navbar-padding-horizontal; + padding-left: @navbar-padding-horizontal; + border-top: 1px solid darken(@navbar-bg, 7%); + box-shadow: inset 0 1px 0 rgba(255,255,255,.1); + .clearfix(); + -webkit-overflow-scrolling: touch; + + &.in { + overflow-y: auto; } - > .disabled > a { - &, - &:hover, - &:focus { - color: @navbar-link-disabled-color; - background-color: @navbar-link-disabled-bg; + + @media (min-width: @grid-float-breakpoint) { + width: auto; + padding-right: 0; + padding-left: 0; + border-top: 0; + box-shadow: none; + + &.collapse { + display: block !important; + height: auto !important; + padding-bottom: 0; // Override default setting + overflow: visible !important; } - } - // Right aligned contents - // Make them full width first so that they align properly on mobile - &.pull-right { - width: 100%; + &.in { + overflow-y: visible; + } } } - // // Navbar alignment options -// -------------------------------------------------- +// +// Display the navbar across the entirity of the page or fixed it to the top or +// bottom of the page. -// Static navbar +// Static top (unfixed, but 100% wide) navbar .navbar-static-top { - border-radius: 0; + border-width: 0 0 1px; + @media (min-width: @grid-float-breakpoint) { + border-radius: 0; + } } // Fix the top/bottom navbars when screen real estate supports it @@ -78,7 +106,12 @@ right: 0; left: 0; z-index: @zindex-navbar-fixed; - border-radius: 0; + border-width: 0 0 1px; + + // Undo the rounded corners + @media (min-width: @grid-float-breakpoint) { + border-radius: 0; + } } .navbar-fixed-top { top: 0; @@ -89,23 +122,15 @@ } - -// -// Navbar optional components -// -------------------------------------------------- - // Brand/project name + .navbar-brand { - display: block; - max-width: 200px; - margin-left: auto; - margin-right: auto; - padding: @navbar-padding-vertical @navbar-padding-horizontal; + float: left; + padding-top: @navbar-padding-vertical; + padding-bottom: @navbar-padding-vertical; font-size: @font-size-large; - font-weight: 500; line-height: @line-height-computed; color: @navbar-brand-color; - text-align: center; &:hover, &:focus { color: @navbar-brand-hover-color; @@ -114,14 +139,17 @@ } } -// Collapsible navbar toggle + +// Navbar toggle +// +// Custom button for toggling the `.navbar-collapse`, powered by the collapse +// JavaScript plugin. + .navbar-toggle { - position: absolute; - top: floor((@navbar-height - 32) / 2); - right: 10px; - width: 48px; - height: 32px; - padding: 8px 12px; + position: relative; + float: right; + padding: 9px 10px; + .navbar-vertical-align(34px); background-color: transparent; border: 1px solid @navbar-toggle-border-color; border-radius: @border-radius-base; @@ -142,26 +170,178 @@ .icon-bar + .icon-bar { margin-top: 4px; } + + @media (min-width: @grid-float-breakpoint) { + position: relative; + top: auto; + left: auto; + display: none; + } } + +// Navbar nav links +// +// Builds on top of the `.nav` components with it's own modifier class to make +// the nav the full height of the horizontal nav (above 768px). + +.navbar-nav { + margin: (@navbar-padding-vertical / 2) -@navbar-padding-horizontal; + + > li > a { + padding-top: 10px; + padding-bottom: 10px; + color: @navbar-link-color; + line-height: @line-height-computed; + &:hover, + &:focus { + color: @navbar-link-hover-color; + background-color: @navbar-link-hover-bg; + } + } + > .active > a { + &, + &:hover, + &:focus { + color: @navbar-link-active-color; + background-color: @navbar-link-active-bg; + } + } + > .disabled > a { + &, + &:hover, + &:focus { + color: @navbar-link-disabled-color; + background-color: @navbar-link-disabled-bg; + } + } + + @media (max-width: @screen-phone-max) { + // Dropdowns get custom display when collapsed + .open .dropdown-menu { + position: static; + float: none; + width: auto; + margin-top: 0; + background-color: transparent; + border: 0; + box-shadow: none; + > li > a, + .dropdown-header { + padding: 5px 15px 5px 25px; + } + > li > a { + color: @navbar-link-color; + line-height: @line-height-computed; + &:hover, + &:focus { + color: @navbar-link-hover-color; + background-color: @navbar-link-hover-bg; + background-image: none; + } + } + > .active > a { + &, + &:hover, + &:focus { + color: @navbar-link-active-color; + background-color: @navbar-link-active-bg; + } + } + > .disabled > a { + &, + &:hover, + &:focus { + color: @navbar-link-disabled-color; + background-color: @navbar-link-disabled-bg; + } + } + } + } + + // Uncollapse the nav + @media (min-width: @grid-float-breakpoint) { + float: left; + margin: 0; + + > li { + float: left; + > a { + padding-top: ((@navbar-height - @line-height-computed) / 2); + padding-bottom: ((@navbar-height - @line-height-computed) / 2); + } + } + } + +} + + +// Component alignment +// +// Repurpose the pull utilities as their own navbar utilities to avoid specifity +// issues with parents and chaining. Only do this when the navbar is uncollapsed +// though so that navbar contents properly stack and align in mobile. + +@media (min-width: @grid-float-breakpoint) { + .navbar-left { .pull-left(); } + .navbar-right { + .pull-right(); + .dropdown-menu { + .pull-right > .dropdown-menu(); + } + } +} + + // Navbar form +// +// Extension of the `.form-inline` with some extra flavor for optimum display in +// our navbars. + .navbar-form { + margin-left: -@navbar-padding-horizontal; + margin-right: -@navbar-padding-horizontal; + padding: 10px @navbar-padding-horizontal; + border-top: 1px solid darken(@navbar-bg, 7%); + border-bottom: 1px solid darken(@navbar-bg, 7%); + @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1); + .box-shadow(@shadow); + + // Mixin behavior for optimum display .form-inline(); - .navbar-vertical-align(@input-height-base); // Vertically center in navbar + + .form-group { + @media (max-width: @screen-phone-max) { + margin-bottom: 5px; + } + } + + // Vertically center in expanded, horizontal navbar + .navbar-vertical-align(@input-height-base); + + // Undo 100% width for pull classes + @media (min-width: @grid-float-breakpoint) { + width: auto; + border: 0; + margin-left: 0; + margin-right: 0; + padding-top: 0; + padding-bottom: 0; + .box-shadow(none); + } } + // Dropdown menus // Menu position and menu carets .navbar-nav > li > .dropdown-menu { margin-top: 0; - border-top-left-radius: 0; - border-top-right-radius: 0; + .border-top-radius(0); } // Menu position and menu caret support for dropups via extra dropup class .navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; + .border-bottom-radius(0); } // Dropdown menu items and carets @@ -200,12 +380,50 @@ } +// Buttons in navbars +// +// Vertically center a button within a navbar (when *not* in a form). + +.navbar-btn { + .navbar-vertical-align(@input-height-base); +} + + +// Text in navbars +// +// Add a class to make any element properly align itself vertically within the navbars. + +.navbar-text { + float: left; + color: @navbar-color; + .navbar-vertical-align(@line-height-computed); + + @media (min-width: @grid-float-breakpoint) { + margin-left: @navbar-padding-horizontal; + margin-right: @navbar-padding-horizontal; + } +} + + +// Links in navbars +// +// Add a class to ensure links outside the navbar nav are colored correctly. + +// Default navbar variables +.navbar-link { + color: @navbar-link-color; + &:hover { + color: @navbar-link-hover-color; + } +} + // Inverse navbar // -------------------------------------------------- .navbar-inverse { background-color: @navbar-inverse-bg; + border-color: @navbar-inverse-border; .navbar-brand { color: @navbar-inverse-brand-color; @@ -260,6 +478,11 @@ } } + .navbar-collapse, + .navbar-form { + border-color: darken(@navbar-inverse-bg, 7%); + } + // Dropdowns .navbar-nav { > .open > a { @@ -288,93 +511,46 @@ } } } - } -} - - -// Responsive navbar -// -------------------------------------------------- - -@media screen and (min-width: @grid-float-breakpoint) { - - .navbar-brand { - float: left; - margin-left: -(@navbar-padding-horizontal); - margin-right: 5px; - } - .navbar-nav { - float: left; - // undo margin to make nav extend full height of navbar - margin-top: 0; - margin-bottom: 0; - - > li { - float: left; - > a { - border-radius: 0; + @media (max-width: @screen-phone-max) { + // Dropdowns get custom display + .open .dropdown-menu { + > .dropdown-header { + border-color: @navbar-inverse-border; + } + > li > a { + color: @navbar-inverse-link-color; + &:hover, + &:focus { + color: @navbar-inverse-link-hover-color; + background-color: @navbar-inverse-link-hover-bg; + } + } + > .active > a { + &, + &:hover, + &:focus { + color: @navbar-inverse-link-active-color; + background-color: @navbar-inverse-link-active-bg; + } + } + > .disabled > a { + &, + &:hover, + &:focus { + color: @navbar-inverse-link-disabled-color; + background-color: @navbar-inverse-link-disabled-bg; + } + } } } - - &.pull-right { - float: right; - width: auto; - } } - // Required to make the collapsing navbar work on regular desktops - .navbar-toggle { - position: relative; - top: auto; - left: auto; - display: none; - } - .nav-collapse.collapse { - display: block !important; - height: auto !important; - overflow: visible !important; - } - -} - - - -// Buttons in navbars -// -// Vertically center a button within a navbar (when *not* in a form). - -.navbar-btn { - margin-top: ((@navbar-height - @input-height-base) / 2); -} - - - -// Text in navbars -// -// Add a class to make any element properly align itself vertically within the navbars. - -.navbar-text { - .navbar-vertical-align(@line-height-computed); -} - - - -// Links in navbars -// -// Add a class to ensure links outside the navbar nav are colored correctly. - -// Default navbar variables -.navbar-link { - color: @navbar-link-color; - &:hover { - color: @navbar-link-hover-color; + .navbar-link { + color: @navbar-inverse-link-color; + &:hover { + color: @navbar-inverse-link-hover-color; + } } -} -// Use the inverse navbar variables -.navbar-inverse .navbar-link { - color: @navbar-inverse-link-color; - &:hover { - color: @navbar-inverse-link-hover-color; - } } diff --git a/bower_components/bootstrap/less/navs.less b/bower_components/bootstrap/less/navs.less index 00b75377..abee86dc 100644..100755 --- a/bower_components/bootstrap/less/navs.less +++ b/bower_components/bootstrap/less/navs.less @@ -19,7 +19,7 @@ > a { position: relative; display: block; - padding: 10px 15px; + padding: @nav-link-padding; &:hover, &:focus { text-decoration: none; @@ -39,44 +39,30 @@ cursor: not-allowed; } } - - // Space the headers out when they follow another list item (link) - + .nav-header { - margin-top: 9px; - } } // Open dropdowns - &.open > a { + .open > a { &, &:hover, &:focus { - color: @nav-open-link-hover-color; - background-color: @link-color; + background-color: @nav-link-hover-bg; border-color: @link-color; - .caret { - border-top-color: @nav-open-caret-border-color; - border-bottom-color: @nav-open-caret-border-color; - } } } - // Redeclare pull classes because of specificity - // Todo: consider making these utilities !important to avoid this bullshit - > .pull-right { - float: right; - } - // Dividers (basically an hr) within the dropdown .nav-divider { .nav-divider(); } -} - + // Prevent IE8 from misplacing imgs + // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989 + > li > a > img { + max-width: none; + } +} -// Nav variations -// -------------------------------------------------- // Tabs // ------------------------- @@ -96,7 +82,7 @@ border: 1px solid transparent; border-radius: @border-radius-base @border-radius-base 0 0; &:hover { - border-color: @nav-tabs-link-hover-border-color; + border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color; } } @@ -153,27 +139,35 @@ > li { float: none; + li { - > a { - margin-top: 2px; - margin-left: 0; // no need for this gap between nav items - } + margin-top: 2px; + margin-left: 0; // no need for this gap between nav items } } } + +// Nav variations +// -------------------------------------------------- + // Justified nav links // ------------------------- .nav-justified { width: 100%; + > li { float: none; - display: table-cell; - width: 1%; - > a { + > a { text-align: center; } } + + @media (min-width: @screen-small) { + > li { + display: table-cell; + width: 1%; + } + } } // Move borders to anchors instead of bottom of list @@ -188,11 +182,9 @@ > .active > a { border-bottom-color: @nav-tabs-justified-active-link-border-color; } - } - // Tabbable tabs // ------------------------- diff --git a/bower_components/bootstrap/less/normalize.less b/bower_components/bootstrap/less/normalize.less index a2e9c648..a2e9c648 100644..100755 --- a/bower_components/bootstrap/less/normalize.less +++ b/bower_components/bootstrap/less/normalize.less diff --git a/bower_components/bootstrap/less/pager.less b/bower_components/bootstrap/less/pager.less index 04585a3a..04585a3a 100644..100755 --- a/bower_components/bootstrap/less/pager.less +++ b/bower_components/bootstrap/less/pager.less diff --git a/bower_components/bootstrap/less/pagination.less b/bower_components/bootstrap/less/pagination.less index 83b72e47..b480b388 100644..100755 --- a/bower_components/bootstrap/less/pagination.less +++ b/bower_components/bootstrap/less/pagination.less @@ -6,23 +6,24 @@ padding-left: 0; margin: @line-height-computed 0; border-radius: @border-radius-base; - + > li { display: inline; // Remove list-style and block-level defaults > a, > span { + position: relative; float: left; // Collapse white-space - padding: 4px 12px; + padding: @padding-base-vertical @padding-base-horizontal; line-height: @line-height-base; text-decoration: none; background-color: @pagination-bg; border: 1px solid @pagination-border; - border-left-width: 0; + margin-left: -1px; } &:first-child { > a, > span { - border-left-width: 1px; + margin-left: 0; .border-left-radius(@border-radius-base); } } @@ -33,19 +34,28 @@ } } } - - > li > a:hover, - > li > a:focus, - > .active > a, - > .active > span { - background-color: @pagination-active-bg; + + > li > a, + > li > span { + &:hover, + &:focus { + background-color: @pagination-hover-bg; + } } + > .active > a, > .active > span { - color: @pagination-active-color; - cursor: default; + &, + &:hover, + &:focus { + z-index: 2; + color: @pagination-active-color; + background-color: @pagination-active-bg; + border-color: @pagination-active-bg; + cursor: default; + } } - + > .disabled { > span, > a, @@ -53,6 +63,7 @@ > a:focus { color: @pagination-disabled-color; background-color: @pagination-bg; + border-color: @pagination-border; cursor: not-allowed; } } @@ -62,47 +73,11 @@ // -------------------------------------------------- // Large -.pagination-large { - > li { - > a, - > span { - padding: @padding-large-vertical @padding-large-horizontal; - font-size: @font-size-large; - } - &:first-child { - > a, - > span { - .border-left-radius(@border-radius-large); - } - } - &:last-child { - > a, - > span { - .border-right-radius(@border-radius-large); - } - } - } +.pagination-lg { + .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @border-radius-large); } // Small -.pagination-small { - > li { - > a, - > span { - padding: @padding-small-vertical @padding-small-horizontal; - font-size: @font-size-small; - } - &:first-child { - > a, - > span { - .border-left-radius(@border-radius-small); - } - } - &:last-child { - > a, - > span { - .border-right-radius(@border-radius-small); - } - } - } +.pagination-sm { + .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @border-radius-small); } diff --git a/bower_components/bootstrap/less/panels.less b/bower_components/bootstrap/less/panels.less index 691a1554..6d22dd96 100644..100755 --- a/bower_components/bootstrap/less/panels.less +++ b/bower_components/bootstrap/less/panels.less @@ -5,22 +5,54 @@ // Base class .panel { - padding: 15px; - margin-bottom: 20px; + margin-bottom: @line-height-computed; background-color: @panel-bg; border: 1px solid @panel-border; border-radius: @panel-border-radius; .box-shadow(0 1px 1px rgba(0,0,0,.05)); } +// Panel contents +.panel-body { + padding: 15px; +} + +// List groups in panels +// +// By default, space out list group content from panel headings to account for +// any kind of custom content between the two. + +.panel { + > .list-group { + margin-bottom: 0; + + .list-group-item { + border-width: 1px 0; + + // Remove border radius for top one + &:first-child { + .border-top-radius(0); + } + // But keep it for the last one + &:last-child { + border-bottom: 0; + } + } + } +} +// Collapse space between when there's no additional content. +.panel-heading + .list-group { + .list-group-item:first-child { + border-top-width: 0; + } +} + // Optional heading .panel-heading { - margin: -15px -15px 15px; padding: 10px 15px; background-color: @panel-heading-bg; border-bottom: 1px solid @panel-border; - border-top-left-radius: (@panel-border-radius - 1); - border-top-right-radius: (@panel-border-radius - 1); + .border-top-radius(@panel-border-radius - 1); } // Within heading, strip any `h*` tag of it's default margins for spacing. @@ -28,75 +60,69 @@ margin-top: 0; margin-bottom: 0; font-size: (@font-size-base * 1.25); - font-weight: 500; + > a { + color: inherit; + } } // Optional footer (stays gray in every modifier class) .panel-footer { - margin: 15px -15px -15px; padding: 10px 15px; background-color: @panel-footer-bg; border-top: 1px solid @panel-border; - border-bottom-left-radius: (@panel-border-radius - 1); - border-bottom-right-radius: (@panel-border-radius - 1); + .border-bottom-radius(@panel-border-radius - 1); } -// Contextual variations -.panel-primary { - border-color: @panel-primary-border; + +// Collapsable panels (aka, accordion) +// +// Wrap a series of panels in `.panel-group` to turn them into an accordion with +// the help of our collapse JavaScript plugin. + +.panel-group { + // Tighten up margin so it's only between panels + .panel { + margin-bottom: 0; + border-radius: @panel-border-radius; + overflow: hidden; // crop contents when collapsed + + .panel { + margin-top: 5px; + } + } + .panel-heading { - color: @panel-primary-text; - background-color: @panel-primary-heading-bg; - border-color: @panel-primary-border; + border-bottom: 0; + + .panel-collapse .panel-body { + border-top: 1px solid @panel-border; + } + } + .panel-footer { + border-top: 0; + + .panel-collapse .panel-body { + border-bottom: 1px solid @panel-border; + } + } + + // New subcomponent for wrapping collapsable content for proper animations + .panel-collapse { + } } + + +// Contextual variations +.panel-primary { + .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border); +} .panel-success { - border-color: @panel-success-border; - .panel-heading { - color: @panel-success-text; - background-color: @panel-success-heading-bg; - border-color: @panel-success-border; - } + .panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border); } .panel-warning { - border-color: @panel-warning-border; - .panel-heading { - color: @panel-warning-text; - background-color: @panel-warning-heading-bg; - border-color: @panel-warning-border; - } + .panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border); } .panel-danger { - border-color: @panel-danger-border; - .panel-heading { - color: @panel-danger-text; - background-color: @panel-danger-heading-bg; - border-color: @panel-danger-border; - } + .panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border); } .panel-info { - border-color: @panel-info-border; - .panel-heading { - color: @panel-info-text; - background-color: @panel-info-heading-bg; - border-color: @panel-info-border; - } -} - -// List groups in panels -.list-group-flush { - margin: 15px -15px -15px; - - .list-group-item { - border-width: 1px 0; - - // Remove border radius for top one - &:first-child { - .border-top-radius(0); - } - // But keep it for the last one - &:last-child { - border-bottom: 0; - } - } + .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border); } diff --git a/bower_components/bootstrap/less/popovers.less b/bower_components/bootstrap/less/popovers.less index c07350f9..345bb1a3 100644..100755 --- a/bower_components/bootstrap/less/popovers.less +++ b/bower_components/bootstrap/less/popovers.less @@ -13,8 +13,6 @@ padding: 1px; text-align: left; // Reset given new insertion method background-color: @popover-bg; - -webkit-bg-clip: padding-box; - -moz-bg-clip: padding; background-clip: padding-box; border: 1px solid @popover-fallback-border-color; border: 1px solid @popover-border-color; diff --git a/bower_components/bootstrap/less/print.less b/bower_components/bootstrap/less/print.less index 1e4bffe3..1e4bffe3 100644..100755 --- a/bower_components/bootstrap/less/print.less +++ b/bower_components/bootstrap/less/print.less diff --git a/bower_components/bootstrap/less/progress-bars.less b/bower_components/bootstrap/less/progress-bars.less index fe399abf..49e5df8e 100644..100755 --- a/bower_components/bootstrap/less/progress-bars.less +++ b/bower_components/bootstrap/less/progress-bars.less @@ -18,19 +18,13 @@ to { background-position: 0 0; } } -// IE9 -@-ms-keyframes progress-bar-stripes { - from { background-position: 40px 0; } - to { background-position: 0 0; } -} - // Opera @-o-keyframes progress-bar-stripes { from { background-position: 0 0; } to { background-position: 40px 0; } } -// Spec +// Spec and IE10+ @keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } @@ -67,7 +61,7 @@ // Striped bars .progress-striped .progress-bar { #gradient > .striped(@progress-bar-bg); - .background-size(40px 40px); + background-size: 40px 40px; } // Call animation for the active one @@ -84,22 +78,18 @@ // Variations // ------------------------- -// Danger (red) -.progress-bar-danger { - .progress-bar-variant(@progress-bar-danger-bg); -} - -// Success (green) .progress-bar-success { .progress-bar-variant(@progress-bar-success-bg); } -// Warning (orange) +.progress-bar-info { + .progress-bar-variant(@progress-bar-info-bg); +} + .progress-bar-warning { .progress-bar-variant(@progress-bar-warning-bg); } -// Info (teal) -.progress-bar-info { - .progress-bar-variant(@progress-bar-info-bg); +.progress-bar-danger { + .progress-bar-variant(@progress-bar-danger-bg); } diff --git a/bower_components/bootstrap/less/responsive-utilities.less b/bower_components/bootstrap/less/responsive-utilities.less index 38dd9639..cec86908 100644..100755 --- a/bower_components/bootstrap/less/responsive-utilities.less +++ b/bower_components/bootstrap/less/responsive-utilities.less @@ -35,70 +35,100 @@ // Visibility utilities -// For Phones -.visible-sm { +.visible-xs { .responsive-visibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-large-desktop) { + .responsive-invisibility(); + } +} +.visible-sm { + .responsive-invisibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { + .responsive-visibility(); + } + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-large-desktop) { + .responsive-invisibility(); + } } .visible-md { .responsive-invisibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-visibility(); + } + @media (min-width: @screen-large-desktop) { + .responsive-invisibility(); + } } .visible-lg { .responsive-invisibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-invisibility(); + } + @media (min-width: @screen-large-desktop) { + .responsive-visibility(); + } } -.hidden-sm { +.hidden-xs { .responsive-invisibility(); -} -.hidden-md { - .responsive-visibility(); -} -.hidden-lg { - .responsive-visibility(); -} - - -// Tablets & small desktops only -@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { - .visible-sm { - .responsive-invisibility(); - } - .visible-md { + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { .responsive-visibility(); } - .visible-lg { - .responsive-invisibility(); + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-visibility(); } - - .hidden-sm { + @media (min-width: @screen-large-desktop) { .responsive-visibility(); } - .hidden-md { +} +.hidden-sm { + .responsive-visibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { .responsive-invisibility(); } - .hidden-lg { + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { + .responsive-visibility(); + } + @media (min-width: @screen-large-desktop) { .responsive-visibility(); } } - -// For desktops -@media (min-width: @screen-desktop) { - .visible-sm { - .responsive-invisibility(); +.hidden-md { + .responsive-visibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { + .responsive-visibility(); } - .visible-md { + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { .responsive-invisibility(); } - .visible-lg { + @media (min-width: @screen-large-desktop) { .responsive-visibility(); } - - .hidden-sm { +} +.hidden-lg { + .responsive-visibility(); + @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { .responsive-visibility(); } - .hidden-md { + @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { .responsive-visibility(); } - .hidden-lg { + @media (min-width: @screen-large-desktop) { .responsive-invisibility(); } } diff --git a/bower_components/bootstrap/less/scaffolding.less b/bower_components/bootstrap/less/scaffolding.less index b6128dc5..3a6ed3d9 100644..100755 --- a/bower_components/bootstrap/less/scaffolding.less +++ b/bower_components/bootstrap/less/scaffolding.less @@ -6,7 +6,9 @@ // Reset the box-sizing // ------------------------- -* { +*, +*:before, +*:after { .box-sizing(border-box); } @@ -37,6 +39,14 @@ textarea { line-height: inherit; } +// Reset unusual Firefox-on-Android default style, see https://github.com/necolas/normalize.css/issues/214 +button, +input, +select[multiple], +textarea { + background-image: none; +} + // Links // ------------------------- @@ -64,9 +74,7 @@ img { // Responsive images (ensure images don't scale beyond their parents) .img-responsive { - display: inline-block; - 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 + .img-responsive(); } // Rounded corners @@ -79,7 +87,7 @@ img { // Perfect circle .img-circle { - border-radius: 500px; // crank the border-radius so it works with most reasonably sized images + border-radius: 50%; // set radius in percents } @@ -93,3 +101,17 @@ hr { border-top: 1px solid @hr-border; } +// Only display content to screen readers +// See: http://a11yproject.com/posts/how-to-hide-content/ +// ------------------------- + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + margin: -1px; + padding: 0; + overflow: hidden; + clip: rect(0 0 0 0); + border: 0; +} diff --git a/bower_components/bootstrap/less/tables.less b/bower_components/bootstrap/less/tables.less index 68e33dcc..05c09192 100644..100755 --- a/bower_components/bootstrap/less/tables.less +++ b/bower_components/bootstrap/less/tables.less @@ -162,50 +162,14 @@ table { > th.active, &.active > td, &.active > th { - background-color: @table-bg-hover; - } - > td.success, - > th.success, - &.success > td, - &.success > th { - background-color: @state-success-bg; - border-color: @state-success-border; - } - > td.danger, - > th.danger, - &.danger > td, - &.danger > th { - background-color: @state-danger-bg; - border-color: @state-danger-border; - } - > td.warning, - > th.warning, - &.warning > td, - &.warning > th { - background-color: @state-warning-bg; - border-color: @state-warning-border; + background-color: @table-bg-active; } } -// Hover states for `.table-hover` -// Note: this is not available for cells or rows within `thead` or `tfoot`. -.table-hover > tbody > tr { - > td.success:hover, - > th.success:hover, - &.success:hover > td { - background-color: darken(@state-success-bg, 5%); - border-color: darken(@state-success-border, 5%); - } - > td.danger:hover, - > th.danger:hover, - &.danger:hover > td { - background-color: darken(@state-danger-bg, 5%); - border-color: darken(@state-danger-border, 5%); - } - > td.warning:hover, - > th.warning:hover, - &.warning:hover > td { - background-color: darken(@state-warning-bg, 5%); - border-color: darken(@state-warning-border, 5%); - } -} +// Contextual variants +// ------------------- +.table-row-variant(success; @state-success-bg; @state-success-border); + +.table-row-variant(danger; @state-danger-bg; @state-danger-border); + +.table-row-variant(warning; @state-warning-bg; @state-warning-border); diff --git a/bower_components/bootstrap/less/thumbnails.less b/bower_components/bootstrap/less/thumbnails.less index 1f896708..76f79b9e 100644..100755 --- a/bower_components/bootstrap/less/thumbnails.less +++ b/bower_components/bootstrap/less/thumbnails.less @@ -10,7 +10,7 @@ // Can be `a`, `div`, or `img` .thumbnail, .img-thumbnail { - padding: 4px; + padding: @thumbnail-padding; line-height: @line-height-base; background-color: @thumbnail-bg; border: 1px solid @thumbnail-border; @@ -20,10 +20,12 @@ .thumbnail { display: block; } -.thumbnail > img, -.img-thumbnail { +.thumbnail > img { .img-responsive(); } +.img-thumbnail { + .img-responsive(inline-block); +} // Add a hover state for linked versions only a.thumbnail:hover, @@ -37,6 +39,6 @@ a.thumbnail:focus { margin-right: auto; } .thumbnail .caption { - padding: 9px; + padding: @thumbnail-caption-padding; color: @thumbnail-caption-color; } diff --git a/bower_components/bootstrap/less/tooltip.less b/bower_components/bootstrap/less/tooltip.less index 819b9dff..5a95b846 100644..100755 --- a/bower_components/bootstrap/less/tooltip.less +++ b/bower_components/bootstrap/less/tooltip.less @@ -13,7 +13,7 @@ line-height: 1.4; .opacity(0); - &.in { .opacity(1); } + &.in { .opacity(.9); } &.top { margin-top: -3px; padding: 5px 0; } &.right { margin-left: 3px; padding: 0 5px; } &.bottom { margin-top: 3px; padding: 5px 0; } diff --git a/bower_components/bootstrap/less/type.less b/bower_components/bootstrap/less/type.less index 0acb7f35..3fa558f7 100644..100755 --- a/bower_components/bootstrap/less/type.less +++ b/bower_components/bootstrap/less/type.less @@ -141,18 +141,25 @@ dt { dd { margin-left: 0; // Undo browser default } -// Horizontal layout (like forms) -.dl-horizontal { - dt { - float: left; - width: (@component-offset-horizontal - 20); - clear: left; - text-align: right; - .text-overflow(); - } - dd { - .clearfix(); // Clear the floated `dt` if an empty `dd` is present - margin-left: @component-offset-horizontal; + +// Horizontal description lists +// +// Defaults to being stacked without any of the below styles applied, until the +// grid breakpoint is reached (default of ~768px). + +@media (min-width: @grid-float-breakpoint) { + .dl-horizontal { + dt { + float: left; + width: (@component-offset-horizontal - 20); + clear: left; + text-align: right; + .text-overflow(); + } + dd { + margin-left: @component-offset-horizontal; + .clearfix(); // Clear the floated `dt` if an empty `dd` is present + } } } @@ -195,7 +202,6 @@ blockquote { // Float right with text-align: right &.pull-right { - float: right; padding-right: 15px; padding-left: 0; border-right: 5px solid @blockquote-border-color; diff --git a/bower_components/bootstrap/less/utilities.less b/bower_components/bootstrap/less/utilities.less index d296b32c..3d310e65 100644..100755 --- a/bower_components/bootstrap/less/utilities.less +++ b/bower_components/bootstrap/less/utilities.less @@ -10,10 +10,10 @@ .clearfix(); } .pull-right { - float: right; + float: right !important; } .pull-left { - float: left; + float: left !important; } diff --git a/bower_components/bootstrap/less/variables.less b/bower_components/bootstrap/less/variables.less index 878725f6..aa0f9fb0 100644..100755 --- a/bower_components/bootstrap/less/variables.less +++ b/bower_components/bootstrap/less/variables.less @@ -60,21 +60,26 @@ // ------------------------- // Based on 14px font-size and 1.428 line-height (~20px to start) -@padding-base-vertical: 8px; +@padding-base-vertical: 6px; @padding-base-horizontal: 12px; -@padding-large-vertical: 14px; +@padding-large-vertical: 10px; @padding-large-horizontal: 16px; @padding-small-vertical: 5px; @padding-small-horizontal: 10px; +@line-height-large: 1.33; +@line-height-small: 1.5; + @border-radius-base: 4px; @border-radius-large: 6px; @border-radius-small: 3px; @component-active-bg: @brand-primary; +@caret-width-base: 4px; +@caret-width-large: 5px; // Tables // ------------------------- @@ -93,31 +98,33 @@ // Buttons // ------------------------- -@btn-default-color: #fff; -@btn-default-bg: #474949; -@btn-default-border: @btn-default-bg; +@btn-font-weight: bold; + +@btn-default-color: #333; +@btn-default-bg: #fff; +@btn-default-border: #ccc; -@btn-primary-color: @btn-default-color; +@btn-primary-color: #fff; @btn-primary-bg: @brand-primary; -@btn-primary-border: @btn-primary-bg; +@btn-primary-border: darken(@btn-primary-bg, 5%); -@btn-success-color: @btn-default-color; +@btn-success-color: #fff; @btn-success-bg: @brand-success; -@btn-success-border: @btn-success-bg; +@btn-success-border: darken(@btn-success-bg, 5%); -@btn-warning-color: @btn-default-color; +@btn-warning-color: #fff; @btn-warning-bg: @brand-warning; -@btn-warning-border: @btn-warning-bg; +@btn-warning-border: darken(@btn-warning-bg, 5%); -@btn-danger-color: @btn-default-color; +@btn-danger-color: #fff; @btn-danger-bg: @brand-danger; -@btn-danger-border: @btn-danger-bg; +@btn-danger-border: darken(@btn-danger-bg, 5%); -@btn-info-color: @btn-default-color; +@btn-info-color: #fff; @btn-info-bg: @brand-info; -@btn-info-border: @btn-info-bg; +@btn-info-border: darken(@btn-info-bg, 5%); -@btn-hover-color: @btn-default-color; +@btn-link-disabled-color: @gray-light; // Forms @@ -126,17 +133,21 @@ @input-bg: #fff; @input-bg-disabled: @gray-lighter; +@input-color: @gray; @input-border: #ccc; @input-border-radius: @border-radius-base; +@input-border-focus: #66afe9; @input-color-placeholder: @gray-light; @input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2); -@input-height-large: (ceil(@font-size-large * @line-height-base) + (@padding-large-vertical * 2) + 2); -@input-height-small: (ceil(@font-size-small * @line-height-base) + (@padding-small-vertical * 2) + 2); +@input-height-large: (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2); +@input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2); +@legend-color: @gray-dark; @legend-border-color: #e5e5e5; +@input-group-addon-bg: @gray-lighter; @input-group-addon-border-color: @input-border; @@ -155,6 +166,10 @@ @dropdown-link-hover-color: #fff; @dropdown-link-hover-bg: @dropdown-link-active-bg; +@dropdown-link-disabled-color: @gray-light; + +@dropdown-header-color: @gray-light; + @dropdown-caret-color: #000; @@ -174,15 +189,54 @@ @zindex-modal-background: 1040; @zindex-modal: 1050; +// Media queries breakpoints +// -------------------------------------------------- + +// Extra small screen / phone +@screen-xsmall: 480px; +@screen-phone: @screen-xsmall; + +// Small screen / tablet +@screen-small: 768px; +@screen-tablet: @screen-small; + +// Medium screen / desktop +@screen-medium: 992px; +@screen-desktop: @screen-medium; + +// Large screen / wide desktop +@screen-large: 1200px; +@screen-large-desktop: @screen-large; + +// So media queries don't overlap when required, provide a maximum +@screen-phone-max: (@screen-small - 1); +@screen-small-max: (@screen-medium - 1); +@screen-tablet-max: (@screen-desktop - 1); +@screen-desktop-max: (@screen-large-desktop - 1); + + +// Grid system +// -------------------------------------------------- + +// Number of columns in the grid system +@grid-columns: 12; +// Padding, to be divided by two and applied to the left and right of all columns +@grid-gutter-width: 30px; +// Point at which the navbar stops collapsing +@grid-float-breakpoint: @screen-tablet; + // Navbar // ------------------------- // Basics of a navbar @navbar-height: 50px; +@navbar-margin-bottom: @line-height-computed; @navbar-color: #777; -@navbar-bg: #eee; -@navbar-padding-horizontal: floor(@grid-gutter-width / 2); // ~15px +@navbar-bg: #f8f8f8; +@navbar-border: darken(@navbar-bg, 6.5%); +@navbar-border-radius: @border-radius-base; +@navbar-padding-horizontal: floor(@grid-gutter-width / 2); @navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2); // Navbar links @@ -190,7 +244,7 @@ @navbar-link-hover-color: #333; @navbar-link-hover-bg: transparent; @navbar-link-active-color: #555; -@navbar-link-active-bg: darken(@navbar-bg, 10%); +@navbar-link-active-bg: darken(@navbar-bg, 6.5%); @navbar-link-disabled-color: #ccc; @navbar-link-disabled-bg: transparent; @@ -210,6 +264,7 @@ // Reset inverted navbar basics @navbar-inverse-color: @gray-light; @navbar-inverse-bg: #222; +@navbar-inverse-border: darken(@navbar-inverse-bg, 10%); // Inverted navbar links @navbar-inverse-link-color: @gray-light; @@ -241,6 +296,7 @@ // Navs // ------------------------- +@nav-link-padding: 10px 15px; @nav-link-hover-bg: @gray-lighter; @nav-disabled-link-color: @gray-light; @@ -271,10 +327,15 @@ @pagination-bg: #fff; @pagination-border: #ddd; -@pagination-active-bg: #f5f5f5; -@pagination-active-color: @gray-light; + +@pagination-hover-bg: @gray-lighter; + +@pagination-active-bg: @brand-primary; +@pagination-active-color: #fff; + @pagination-disabled-color: @gray-light; + // Pager // ------------------------- @@ -314,7 +375,7 @@ // ------------------------- @tooltip-max-width: 200px; @tooltip-color: #fff; -@tooltip-bg: rgba(0,0,0,.9); +@tooltip-bg: #000; @tooltip-arrow-width: 5px; @tooltip-arrow-color: @tooltip-bg; @@ -339,6 +400,9 @@ // Labels // ------------------------- + +@label-default-bg: @gray-light; +@label-primary-bg: @brand-primary; @label-success-bg: @brand-success; @label-info-bg: @brand-info; @label-warning-bg: @brand-warning; @@ -366,10 +430,13 @@ // Alerts // ------------------------- +@alert-padding: 15px; +@alert-border-radius: @border-radius-base; +@alert-link-font-weight: bold; + @alert-bg: @state-warning-bg; @alert-text: @state-warning-text; @alert-border: @state-warning-border; -@alert-border-radius: @border-radius-base; @alert-success-bg: @state-success-bg; @alert-success-text: @state-success-text; @@ -442,31 +509,33 @@ // Thumbnails // ------------------------- -@thumbnail-caption-color: @text-color; +@thumbnail-padding: 4px; @thumbnail-bg: @body-bg; @thumbnail-border: #ddd; @thumbnail-border-radius: @border-radius-base; +@thumbnail-caption-color: @text-color; +@thumbnail-caption-padding: 9px; + // Wells // ------------------------- @well-bg: #f5f5f5; -// Accordion -// ------------------------- -@accordion-border-color: #e5e5e5; - - // Badges // ------------------------- @badge-color: #fff; @badge-link-hover-color: #fff; - @badge-bg: @gray-light; + @badge-active-color: @link-color; @badge-active-bg: #fff; +@badge-font-weight: bold; +@badge-line-height: 1; +@badge-border-radius: 10px; + // Breadcrumbs // ------------------------- @@ -477,12 +546,16 @@ // Carousel // ------------------------ + @carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6); @carousel-control-color: #fff; +@carousel-control-width: 15%; +@carousel-control-opacity: .5; +@carousel-control-font-size: 20px; -@carousel-indicator-border-color: #fff; @carousel-indicator-active-bg: #fff; +@carousel-indicator-border-color: #fff; @carousel-caption-color: #fff; @@ -490,6 +563,7 @@ // Close // ------------------------ @close-color: #000; +@close-font-weight: bold; @close-text-shadow: 0 1px 0 #fff; @@ -499,7 +573,9 @@ @code-bg: #f9f2f4; @pre-bg: #f5f5f5; +@pre-color: @gray-dark; @pre-border-color: #ccc; +@pre-scrollable-max-height: 340px; // Type // ------------------------ @@ -520,49 +596,14 @@ @component-offset-horizontal: 180px; -// Media queries breakpoints -// -------------------------------------------------- - -// Tiny screen / phone -@screen-tiny: 480px; -@screen-phone: @screen-tiny; - -// Small screen / tablet -@screen-small: 768px; -@screen-tablet: @screen-small; - -// Medium screen / desktop -@screen-medium: 992px; -@screen-desktop: @screen-medium; - -// So media queries don't overlap when required, provide a maximum -@screen-small-max: (@screen-medium - 1); -@screen-tablet-max: @screen-small-max; - -// Large screen / wide desktop -@screen-large: 1200px; -@screen-large-desktop: @screen-large; - - // Container sizes // -------------------------------------------------- // Small screen / tablet -@container-tablet: 728px; +@container-tablet: 720px; // Medium screen / desktop @container-desktop: 940px; // Large screen / wide desktop -@container-large-desktop: 1170px; - - -// Grid system -// -------------------------------------------------- - -// Number of columns in the grid system -@grid-columns: 12; -// Padding, to be divided by two and applied to the left and right of all columns -@grid-gutter-width: 30px; -// Point at which the navbar stops collapsing -@grid-float-breakpoint: @screen-tablet; +@container-large-desktop: 1140px; diff --git a/bower_components/bootstrap/less/wells.less b/bower_components/bootstrap/less/wells.less index 6a909f44..865abc2e 100644..100755 --- a/bower_components/bootstrap/less/wells.less +++ b/bower_components/bootstrap/less/wells.less @@ -19,11 +19,11 @@ } // Sizes -.well-large { +.well-lg { padding: 24px; border-radius: @border-radius-large; } -.well-small { +.well-sm { padding: 9px; border-radius: @border-radius-small; } |