, or .
+.list-group {
+ // No need to set list-style: none; since .list-group-item is block level
+ margin-bottom: 20px;
+ padding-left: 0; // reset padding because ul and ol
+ background-color: @list-group-bg;
+}
+
+// Individual list items
+// -------------------------
+
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: 10px 30px 10px 15px;
+ // Place the border on the list items and negative margin up for better styling
+ margin-bottom: -1px;
+ border: 1px solid @list-group-border;
+}
+// Round the first and last items
+.list-group-item:first-child {
+ .border-top-radius(@border-radius-base);
+}
+.list-group-item:last-child {
+ margin-bottom: 0;
+ .border-bottom-radius(@border-radius-base);
+}
+
+
+// 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 {
+ .list-group-item-heading {
+ color: #333;
+ }
+ .list-group-item-text {
+ color: #555;
+ }
+}
+
+// Hover state
+a.list-group-item:hover,
+a.list-group-item:focus {
+ text-decoration: none;
+ background-color: @list-group-hover-bg;
+}
+
+// Active class on item itself, not parent
+a.list-group-item.active {
+ z-index: 2; // Place active items above their siblings for proper border styling
+ color: @list-group-active-color;
+ background-color: @list-group-active-bg;
+ border-color: @list-group-active-border;
+
+ // Force color to inherit for custom content
+ .list-group-item-heading {
+ color: inherit;
+ }
+ .list-group-item-text {
+ color: lighten(@list-group-active-bg, 40%);
+ }
+}
+
+// Chevrons and badges within list items
+// -------------------------
+
+.list-group-item > .badge,
+.list-group-item > .glyphicon-chevron-right {
+ float: right;
+ margin-right: -15px;
+}
+.list-group-item > .glyphicon + .badge {
+ margin-right: 5px;
+}
diff --git a/docs/less/bootstrap/media.less b/docs/less/bootstrap/media.less
new file mode 100644
index 0000000..21063eb
--- /dev/null
+++ b/docs/less/bootstrap/media.less
@@ -0,0 +1,54 @@
+// Media objects
+// Source: http://stubbornella.org/content/?p=497
+// --------------------------------------------------
+
+
+// Common styles
+// -------------------------
+
+// Clear the floats
+.media,
+.media-body {
+ overflow: hidden;
+ zoom: 1;
+}
+
+// Proper spacing between instances of .media
+.media,
+.media .media {
+ margin-top: 15px;
+}
+.media:first-child {
+ margin-top: 0;
+}
+
+// For images and videos, set to block
+.media-object {
+ display: block;
+}
+
+// Reset margins on headings for tighter default spacing
+.media-heading {
+ margin: 0 0 5px;
+}
+
+
+// Media image alignment
+// -------------------------
+
+.media > .pull-left {
+ margin-right: 10px;
+}
+.media > .pull-right {
+ margin-left: 10px;
+}
+
+
+// Media list variation
+// -------------------------
+
+// Undo default ul/ol styles
+.media-list {
+ margin-left: 0;
+ list-style: none;
+}
diff --git a/docs/less/bootstrap/mixins.less b/docs/less/bootstrap/mixins.less
new file mode 100644
index 0000000..9825e9a
--- /dev/null
+++ b/docs/less/bootstrap/mixins.less
@@ -0,0 +1,495 @@
+//
+// Mixins
+// --------------------------------------------------
+
+
+// Utilities
+// -------------------------
+
+// Clearfix
+// Source: http://nicolasgallagher.com/micro-clearfix-hack/
+//
+// For modern browsers
+// 1. The space content is one way to avoid an Opera bug when the
+// contenteditable attribute is included anywhere else in the document.
+// Otherwise it causes space to appear at the top and bottom of elements
+// that are clearfixed.
+// 2. The use of `table` rather than `block` is only necessary if using
+// `:before` to contain the top-margins of child elements.
+.clearfix() {
+ &:before,
+ &:after {
+ content: " "; /* 1 */
+ display: table; /* 2 */
+ }
+ &:after {
+ clear: both;
+ }
+}
+
+// Webkit-style focus
+.tab-focus() {
+ // Default
+ outline: thin dotted #333;
+ // Webkit
+ outline: 5px auto -webkit-focus-ring-color;
+ outline-offset: -2px;
+}
+
+// Center-align a block level element
+.center-block() {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+// Sizing shortcuts
+.size(@width, @height) {
+ width: @width;
+ height: @height;
+}
+.square(@size) {
+ .size(@size, @size);
+}
+
+// Placeholder text
+.placeholder(@color: @input-color-placeholder) {
+ &:-moz-placeholder { color: @color; } // Firefox 4-18
+ &::-moz-placeholder { color: @color; } // Firefox 19+
+ &:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
+ &::-webkit-input-placeholder { color: @color; } // Safari and Chrome
+}
+
+// Text overflow
+// Requires inline-block or block for proper styling
+.text-overflow() {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+// CSS image replacement
+// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
+.hide-text() {
+ font: 0/0 a;
+ color: transparent;
+ text-shadow: none;
+ background-color: transparent;
+ border: 0;
+}
+
+
+
+// CSS3 PROPERTIES
+// --------------------------------------------------
+
+// Single side border-radius
+.border-top-radius(@radius) {
+ border-top-right-radius: @radius;
+ border-top-left-radius: @radius;
+}
+.border-right-radius(@radius) {
+ border-bottom-right-radius: @radius;
+ border-top-right-radius: @radius;
+}
+.border-bottom-radius(@radius) {
+ border-bottom-right-radius: @radius;
+ border-bottom-left-radius: @radius;
+}
+.border-left-radius(@radius) {
+ border-bottom-left-radius: @radius;
+ border-top-left-radius: @radius;
+}
+
+// Drop shadows
+.box-shadow(@shadow) {
+ -webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
+ box-shadow: @shadow;
+}
+
+// Transitions
+.transition(@transition) {
+ -webkit-transition: @transition;
+ -moz-transition: @transition;
+ -o-transition: @transition;
+ transition: @transition;
+}
+.transition-delay(@transition-delay) {
+ -webkit-transition-delay: @transition-delay;
+ -moz-transition-delay: @transition-delay;
+ -o-transition-delay: @transition-delay;
+ transition-delay: @transition-delay;
+}
+.transition-duration(@transition-duration) {
+ -webkit-transition-duration: @transition-duration;
+ -moz-transition-duration: @transition-duration;
+ -o-transition-duration: @transition-duration;
+ transition-duration: @transition-duration;
+}
+
+// Transformations
+.rotate(@degrees) {
+ -webkit-transform: rotate(@degrees);
+ -moz-transform: rotate(@degrees);
+ -ms-transform: rotate(@degrees);
+ -o-transform: rotate(@degrees);
+ transform: rotate(@degrees);
+}
+.scale(@ratio) {
+ -webkit-transform: scale(@ratio);
+ -moz-transform: scale(@ratio);
+ -ms-transform: scale(@ratio);
+ -o-transform: scale(@ratio);
+ transform: scale(@ratio);
+}
+.translate(@x, @y) {
+ -webkit-transform: translate(@x, @y);
+ -moz-transform: translate(@x, @y);
+ -ms-transform: translate(@x, @y);
+ -o-transform: translate(@x, @y);
+ transform: translate(@x, @y);
+}
+.skew(@x, @y) {
+ -webkit-transform: skew(@x, @y);
+ -moz-transform: skew(@x, @y);
+ -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885
+ -o-transform: skew(@x, @y);
+ transform: skew(@x, @y);
+}
+.translate3d(@x, @y, @z) {
+ -webkit-transform: translate3d(@x, @y, @z);
+ -moz-transform: translate3d(@x, @y, @z);
+ -o-transform: translate3d(@x, @y, @z);
+ transform: translate3d(@x, @y, @z);
+}
+
+// Backface visibility
+// Prevent browsers from flickering when using CSS 3D transforms.
+// 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) {
+ -webkit-background-clip: @clip;
+ -moz-background-clip: @clip;
+ background-clip: @clip;
+}
+
+// Background sizing
+.background-size(@size) {
+ -webkit-background-size: @size;
+ -moz-background-size: @size;
+ -o-background-size: @size;
+ background-size: @size;
+}
+
+// Box sizing
+.box-sizing(@boxmodel) {
+ -webkit-box-sizing: @boxmodel;
+ -moz-box-sizing: @boxmodel;
+ box-sizing: @boxmodel;
+}
+
+// User select
+// For selecting text on the page
+.user-select(@select) {
+ -webkit-user-select: @select;
+ -moz-user-select: @select;
+ -ms-user-select: @select;
+ -o-user-select: @select;
+ user-select: @select;
+}
+
+// Resize anything
+.resizable(@direction) {
+ resize: @direction; // Options: horizontal, vertical, both
+ overflow: auto; // Safari fix
+}
+
+// CSS3 Content Columns
+.content-columns(@column-count, @column-gap: @grid-gutter-width) {
+ -webkit-column-count: @column-count;
+ -moz-column-count: @column-count;
+ column-count: @column-count;
+ -webkit-column-gap: @column-gap;
+ -moz-column-gap: @column-gap;
+ column-gap: @column-gap;
+}
+
+// Optional hyphenation
+.hyphens(@mode: auto) {
+ word-wrap: break-word;
+ -webkit-hyphens: @mode;
+ -moz-hyphens: @mode;
+ -ms-hyphens: @mode;
+ -o-hyphens: @mode;
+ hyphens: @mode;
+}
+
+// Opacity
+.opacity(@opacity) {
+ opacity: @opacity;
+ // IE8 filter
+ @opacity-ie: (@opacity * 100);
+ filter: ~"alpha(opacity=@{opacity-ie})";
+}
+
+
+
+// GRADIENTS
+// --------------------------------------------------
+
+#gradient {
+
+ // Horizontal gradient, from left to right
+ //
+ // 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;
+ 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+
+ background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
+ background-repeat: repeat-x;
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down
+ }
+
+ // Vertical gradient, from top to bottom
+ //
+ // 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;
+ 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+
+ background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
+ background-repeat: repeat-x;
+ 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;
+ 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%);
+ 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);
+ background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
+ 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%);
+ 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);
+ background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
+ 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;
+ 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;
+ background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
+ background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
+ background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
+ background-image: 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);
+ }
+}
+
+// Reset filters for IE
+//
+// When you need to remove a gradient background, don't forget to use this to reset
+// the IE filter for IE9 and below.
+.reset-filter() {
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
+}
+
+
+
+// RETINA IMAGE SUPPORT
+// --------------------------------------------------
+
+// Short retina mixin for setting background-image and -size
+.retina-image(@file-1x, @file-2x, @width-1x, @height-1x) {
+ background-image: url("@{file-1x}");
+
+ @media
+ only screen and (-webkit-min-device-pixel-ratio: 2),
+ only screen and ( min--moz-device-pixel-ratio: 2),
+ only screen and ( -o-min-device-pixel-ratio: 2/1),
+ only screen and ( min-device-pixel-ratio: 2),
+ only screen and ( min-resolution: 192dpi),
+ only screen and ( min-resolution: 2dppx) {
+ background-image: url("@{file-2x}");
+ background-size: @width-1x @height-1x;
+ }
+}
+
+
+// COMPONENT MIXINS
+// --------------------------------------------------
+
+// Horizontal dividers
+// -------------------------
+// Dividers (basically an hr) within dropdowns and nav lists
+.nav-divider(@top: #e5e5e5, @bottom: #fff) {
+ height: 2px; // 1px for background, one for border
+ margin: ((@line-height-computed / 2) - 1) 0;
+ overflow: hidden;
+ background-color: @top;
+ border-bottom: 1px solid @bottom;
+}
+
+// Button psuedo states
+// -------------------------
+// Easily pump out default styles, as well as :hover, :focus, :active,
+// and disabled options for all buttons
+.btn-pseudo-states(@color, @background, @border) {
+ color: @color;
+ background-color: @background;
+ border-color: @border;
+
+ &:hover,
+ &:focus,
+ &:active,
+ &.active {
+ background-color: darken(@background, 5%);
+ border-color: darken(@border, 10%);
+ }
+
+ &.disabled,
+ &[disabled],
+ fieldset[disabled] & {
+ &:hover,
+ &:focus,
+ &:active,
+ &.active {
+ background-color: @background;
+ border-color: @border
+ }
+ }
+}
+
+// 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.
+.navbar-vertical-align(@element-height) {
+ margin-top: ((@navbar-height - @element-height) / 2);
+ margin-bottom: ((@navbar-height - @element-height) / 2);
+}
+
+
+
+// Grid System
+// -----------
+
+// Centered container element
+.container-fixed() {
+ margin-right: auto;
+ margin-left: auto;
+ .clearfix();
+}
+
+// Make a grid
+
+// Creates a wrapper for a series of columns
+.make-row() {
+ // Then clear the floated columns
+ .clearfix();
+
+ @media (min-width: @screen-small) {
+ margin-left: (@grid-gutter-width / -2);
+ margin-right: (@grid-gutter-width / -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);
+ }
+}
+// Generate the columns
+.make-column(@columns) {
+ position: relative;
+ // Float and set width: 100%; for easy stacking on mobile devices
+ float: left;
+ width: 100%;
+ // 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);
+
+ // Calculate width based on number of columns available
+ @media (min-width: @grid-float-breakpoint) {
+ width: percentage((@columns / @grid-columns));
+ }
+}
+// Generate the column offsets
+.make-column-offset(@columns) {
+ @media (min-width: @grid-float-breakpoint) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-column-push(@columns) {
+ @media (min-width: @grid-float-breakpoint) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-column-pull(@columns) {
+ @media (min-width: @grid-float-breakpoint) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
+
+
+
+// Framework mixins
+// --------------------------------------------------
+
+// Generate form validation states
+.form-field-validation(@text-color: #555, @border-color: #ccc, @background-color: #f5f5f5) {
+ // Color the label text
+ .control-label {
+ color: @text-color;
+ }
+ // Set the border and box shadow on specific inputs to match
+ .input-with-feedback {
+ 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 {
+ border-color: darken(@border-color, 10%);
+ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
+ .box-shadow(@shadow);
+ }
+ }
+ // Set validation states also for addons
+ .input-group-addon {
+ color: @text-color;
+ border-color: @border-color;
+ background-color: @background-color;
+ }
+}
diff --git a/docs/less/bootstrap/modals.less b/docs/less/bootstrap/modals.less
new file mode 100644
index 0000000..144588a
--- /dev/null
+++ b/docs/less/bootstrap/modals.less
@@ -0,0 +1,137 @@
+//
+// Modals
+// --------------------------------------------------
+
+// .modal-open - body class for killing the scroll
+// .modal - container to scroll within
+// .modal-dialog - positioning shell for the actual modal
+// .modal-content - actual modal w/ bg and corners and shit
+
+// Kill the scroll on the body
+.modal-open {
+ overflow: hidden;
+}
+
+// Container that the modal scrolls within
+.modal {
+ display: none;
+ overflow: auto;
+ overflow-y: scroll;
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: @zindex-modal-background;
+ -webkit-overflow-scrolling: touch;
+
+ // When fading in the modal, animate it to slide down
+ &.fade {
+ top: -25%;
+ .transition(~"opacity 0.3s linear, top 0.3s ease-out");
+ }
+ &.fade.in { top: 0; }
+}
+
+// Shell div to position the modal with bottom padding
+.modal-dialog {
+ position: relative;
+ top: 0;
+ left: 0;
+ right: 0;
+ width: auto;
+ padding: 10px;
+ z-index: (@zindex-modal-background + 10);
+}
+
+// Actual modal
+.modal-content {
+ position: relative;
+ background-color: #fff;
+ border: 1px solid #999;
+ border: 1px solid rgba(0,0,0,.2);
+ border-radius: 6px;
+ .box-shadow(0 3px 9px rgba(0,0,0,.5));
+ .background-clip(padding-box);
+ // Remove focus outline from opened modal
+ outline: none;
+}
+
+// Modal background
+.modal-backdrop {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: (@zindex-modal-background - 10);
+ background-color: #000;
+ // Fade for backdrop
+ &.fade { .opacity(0); }
+ &.fade.in { .opacity(.5); }
+}
+
+// Modal header
+// Top section of the modal w/ title and dismiss
+.modal-header {
+ padding: @modal-title-padding;
+ border-bottom: 1px solid #e5e5e5;
+ min-height: (@modal-title-padding + @modal-title-line-height);
+}
+// Close icon
+.modal-header .close {
+ margin-top: -2px;
+}
+
+// Title text within header
+.modal-title {
+ margin: 0;
+ line-height: @modal-title-line-height;
+}
+
+// Modal body
+// Where all modal content resides (sibling of .modal-header and .modal-footer)
+.modal-body {
+ position: relative;
+ padding: @modal-inner-padding;
+}
+
+// Footer (for actions)
+.modal-footer {
+ margin-top: 15px;
+ padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding;
+ text-align: right; // right align buttons
+ border-top: 1px solid #e5e5e5;
+ .clearfix(); // clear it in case folks use .pull-* classes on buttons
+
+ // Properly space out buttons
+ .btn + .btn {
+ margin-left: 5px;
+ margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
+ }
+ // but override that for button groups
+ .btn-group .btn + .btn {
+ margin-left: -1px;
+ }
+ // and override it for block buttons as well
+ .btn-block + .btn-block {
+ margin-left: 0;
+ }
+}
+
+// Scale up the modal
+@media screen and (min-width: @screen-tablet) {
+
+ .modal-dialog {
+ left: 50%;
+ right: auto;
+ width: 560px;
+ margin-left: -280px;
+ padding-top: 30px;
+ padding-bottom: 30px;
+ }
+ .modal-content {
+ .box-shadow(0 5px 15px rgba(0,0,0,.5));
+ }
+
+}
diff --git a/docs/less/bootstrap/navbar.less b/docs/less/bootstrap/navbar.less
new file mode 100644
index 0000000..b828360
--- /dev/null
+++ b/docs/less/bootstrap/navbar.less
@@ -0,0 +1,363 @@
+//
+// Navbars
+// --------------------------------------------------
+
+// Wrapper and base class
+.navbar {
+ position: relative;
+ margin-bottom: 20px;
+ padding-left: @navbar-padding;
+ padding-right: @navbar-padding;
+ background-color: @navbar-bg;
+ border-radius: @border-radius-base;
+
+ // Prevent floats from breaking the navbar
+ .clearfix();
+}
+
+// Navbar nav links
+// -------------------------
+
+.navbar-nav {
+ // Space out from .navbar .brand and .btn-navbar when stacked in mobile views
+ // and outdent nav links so text lines up with logo.
+ margin-top: 10px;
+ margin-bottom: 15px;
+
+ > 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;
+ }
+ > li > a:hover,
+ > li > a:focus {
+ color: @navbar-link-hover-color;
+ background-color: @navbar-link-hover-bg;
+ }
+ > .active > a,
+ > .active > a:hover,
+ > .active > a:focus {
+ color: @navbar-link-active-color;
+ background-color: @navbar-link-active-bg;
+ }
+ > .disabled > a,
+ > .disabled > a:hover,
+ > .disabled > a:focus {
+ color: @navbar-link-disabled-color;
+ background-color: @navbar-link-disabled-bg;
+ }
+
+ // Right aligned contents
+ // Make them full width first so that they align properly on mobile
+ &.pull-right {
+ width: 100%;
+ }
+}
+
+
+
+//
+// Navbar alignment options
+// --------------------------------------------------
+
+// Static navbar
+.navbar-static-top {
+ border-radius: 0;
+}
+
+// Fix the top/bottom navbars when screen real estate supports it
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+ position: fixed;
+ right: 0;
+ left: 0;
+ z-index: @zindex-navbar-fixed;
+ border-radius: 0;
+}
+.navbar-fixed-top {
+ top: 0;
+}
+.navbar-fixed-bottom {
+ bottom: 0;
+ margin-bottom: 0; // override .navbar defaults
+}
+
+
+
+//
+// Navbar optional components
+// --------------------------------------------------
+
+// Brand/project name
+.navbar-brand {
+ display: block;
+ max-width: 200px;
+ margin-left: auto;
+ margin-right: auto;
+ padding: @navbar-padding;
+ 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;
+ text-decoration: none;
+ background-color: @navbar-brand-hover-bg;
+ }
+}
+
+// Collapsible navbar toggle
+.navbar-toggle {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ padding: 8px 12px;
+ background-color: transparent;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+
+ &:hover,
+ &:focus {
+ background-color: #ddd;
+ }
+
+ // Bars
+ .icon-bar {
+ display: block;
+ width: 22px;
+ height: 2px;
+ background-color: #ccc;
+ border-radius: 1px;
+ }
+ .icon-bar + .icon-bar {
+ margin-top: 4px;
+ }
+}
+
+// Navbar form
+.navbar-form {
+ .form-inline();
+ .navbar-vertical-align(@input-height-base); // Vertically center in navbar
+}
+
+// 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;
+}
+// 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;
+}
+
+// Dropdown menu items and carets
+.navbar-nav {
+ // Caret should match text color on hover
+ > .dropdown > a:hover .caret,
+ > .dropdown > a:focus .caret {
+ border-top-color: @navbar-link-hover-color;
+ border-bottom-color: @navbar-link-hover-color;
+ }
+
+ // Remove background color from open dropdown
+ > .open > a,
+ > .open > a:hover,
+ > .open > a:focus {
+ background-color: @navbar-link-active-bg;
+ color: @navbar-link-active-color;
+ }
+ > .dropdown > a .caret {
+ border-top-color: @navbar-link-color;
+ border-bottom-color: @navbar-link-color;
+ }
+ > .open > a .caret,
+ > .open > a:hover .caret,
+ > .open > a:focus .caret {
+ border-top-color: @navbar-link-active-color;
+ border-bottom-color: @navbar-link-active-color;
+ }
+}
+
+// Right aligned menus need alt position
+.navbar-nav.pull-right > li > .dropdown-menu,
+.navbar-nav > li > .dropdown-menu.pull-right {
+ left: auto;
+ right: 0;
+}
+
+
+
+// Inverse navbar
+// --------------------------------------------------
+
+.navbar-inverse {
+ background-color: @navbar-inverse-bg;
+
+ .navbar-brand {
+ color: @navbar-inverse-brand-color;
+ &:hover,
+ &:focus {
+ color: @navbar-inverse-brand-hover-color;
+ background-color: @navbar-inverse-brand-hover-bg;
+ }
+ }
+
+ .navbar-text {
+ color: @navbar-inverse-color;
+ }
+
+ .navbar-nav {
+ > li > a {
+ color: @navbar-inverse-link-color;
+ }
+ > li > a:hover,
+ > li > a:focus {
+ color: @navbar-inverse-link-hover-color;
+ background-color: @navbar-inverse-link-hover-bg;
+ }
+ > .active > a,
+ > .active > a:hover,
+ > .active > a:focus {
+ color: @navbar-inverse-link-active-color;
+ background-color: @navbar-inverse-link-active-bg;
+ }
+ > .disabled > a,
+ > .disabled > a:hover,
+ > .disabled > a:focus {
+ color: @navbar-inverse-link-disabled-color;
+ background-color: @navbar-inverse-link-disabled-bg;
+ }
+ }
+
+ // Darken the responsive nav toggle
+ .navbar-toggle {
+ border-color: #333;
+ &:hover,
+ &:focus {
+ background-color: #333;
+ }
+ .icon-bar {
+ background-color: #fff;
+ }
+ }
+
+ // Dropdowns
+ .navbar-nav {
+ > .open > a,
+ > .open > a:hover,
+ > .open > a:focus {
+ background-color: @navbar-inverse-link-active-bg;
+ color: @navbar-inverse-link-active-color;
+ }
+ > .dropdown > a:hover .caret {
+ border-top-color: @navbar-inverse-link-hover-color;
+ border-bottom-color: @navbar-inverse-link-hover-color;
+ }
+ > .dropdown > a .caret {
+ border-top-color: @navbar-inverse-link-color;
+ border-bottom-color: @navbar-inverse-link-color;
+ }
+ > .open > a .caret,
+ > .open > a:hover .caret,
+ > .open > a:focus .caret {
+ border-top-color: @navbar-inverse-link-active-color;
+ border-bottom-color: @navbar-inverse-link-active-color;
+ }
+
+ }
+}
+
+
+
+// Responsive navbar
+// --------------------------------------------------
+
+@media screen and (min-width: @grid-float-breakpoint) {
+
+ .navbar-brand {
+ float: left;
+ margin-left: -(@navbar-padding);
+ 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;
+ }
+ }
+
+ &.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 {
+ 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;
+ }
+}
+
+// Use the inverse navbar variables
+.navbar-inverse .navbar-link {
+ color: @navbar-inverse-link-color;
+ &:hover {
+ color: @navbar-inverse-link-hover-color;
+ }
+}
diff --git a/docs/less/bootstrap/navs.less b/docs/less/bootstrap/navs.less
new file mode 100644
index 0000000..e5925bf
--- /dev/null
+++ b/docs/less/bootstrap/navs.less
@@ -0,0 +1,247 @@
+//
+// Navs
+// --------------------------------------------------
+
+
+// Base class
+// --------------------------------------------------
+
+.nav {
+ margin-left: 0;
+ margin-bottom: 0;
+ padding-left: 0; // Override default ul/ol
+ list-style: none;
+ .clearfix();
+
+ > li {
+ position: relative;
+ display: block;
+
+ > a {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+ &:hover,
+ &:focus {
+ text-decoration: none;
+ background-color: @gray-lighter;
+ }
+ }
+
+ // Disabled state sets text to gray and nukes hover/tab effects
+ &.disabled > a {
+ color: @gray-light;
+ }
+ &.disabled > a:hover,
+ &.disabled > a:focus {
+ color: @gray-light;
+ text-decoration: none;
+ background-color: transparent;
+ cursor: default;
+ }
+
+ // Space the headers out when they follow another list item (link)
+ + .nav-header {
+ margin-top: 9px;
+ }
+ }
+
+ // Open dropdowns
+ &.open > a,
+ &.open > a:hover,
+ &.open > a:focus {
+ color: #fff;
+ background-color: @link-color;
+ border-color: @link-color;
+ .caret {
+ border-top-color: #fff;
+ border-bottom-color: #fff;
+ }
+ }
+
+ // Redeclare pull classes because of specifity
+ // 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();
+ }
+}
+
+
+
+// Nav variations
+// --------------------------------------------------
+
+// Tabs
+// -------------------------
+
+// Give the tabs something to sit on
+.nav-tabs {
+ border-bottom: 1px solid #ddd;
+ > li {
+ float: left;
+ // Make the list-items overlay the bottom border
+ margin-bottom: -1px;
+
+ // Actual tabs (as links)
+ > a {
+ margin-right: 2px;
+ line-height: @line-height-base;
+ border: 1px solid transparent;
+ border-radius: @border-radius-base @border-radius-base 0 0;
+ &:hover {
+ border-color: @gray-lighter @gray-lighter #ddd;
+ }
+ }
+
+ // Active state, and it's :hover to override normal :hover
+ &.active > a,
+ &.active > a:hover,
+ &.active > a:focus {
+ color: @gray;
+ background-color: @body-bg;
+ border: 1px solid #ddd;
+ border-bottom-color: transparent;
+ cursor: default;
+ }
+ }
+ // pulling this in mainly for less shorthand
+ &.nav-justified {
+ .nav-justified;
+ .nav-tabs-justified;
+ }
+}
+
+
+// Pills
+// -------------------------
+.nav-pills {
+ > li {
+ float: left;
+
+ // Links rendered as pills
+ > a {
+ border-radius: 5px;
+ }
+ + li {
+ > a {
+ margin-left: 2px;
+ }
+ }
+
+ // Active state
+ &.active > a,
+ &.active > a:hover,
+ &.active > a:focus {
+ color: #fff;
+ background-color: @component-active-bg;
+ }
+ }
+}
+
+
+// Stacked pills
+.nav-stacked {
+ > li {
+ float: none;
+ + li {
+ > a {
+ margin-top: 2px;
+ margin-left: 0; // no need for this gap between nav items
+ }
+ }
+ }
+}
+
+// Justified nav links
+// -------------------------
+
+.nav-justified {
+ width: 100%;
+ > li {
+ float: none;
+ display: table-cell;
+ width: 1%;
+ > a {
+ text-align: center;
+ }
+ }
+}
+
+// Move borders to anchors instead of bottom of list
+.nav-tabs-justified () {
+ border-bottom: 0;
+ > li > a {
+ border-bottom: 1px solid #ddd;
+
+ // Override margin from .nav-tabs
+ margin-right: 0;
+ }
+ > .active > a {
+ border-bottom-color: @body-bg;
+ }
+
+}
+
+
+
+// Nav headers (for dropdowns and lists)
+// -------------------------
+
+.nav-header {
+ display: block;
+ padding: 3px 15px;
+ font-size: @font-size-mini;
+ font-weight: bold;
+ line-height: @line-height-base;
+ color: @gray-light;
+ text-shadow: 0 1px 0 rgba(255,255,255,.5);
+ text-transform: uppercase;
+}
+
+
+
+// Tabbable tabs
+// -------------------------
+
+// Clear any floats
+.tabbable {
+ .clearfix();
+}
+
+// Show/hide tabbable areas
+.tab-content > .tab-pane,
+.pill-content > .pill-pane {
+ display: none;
+}
+.tab-content > .active,
+.pill-content > .active {
+ display: block;
+}
+
+
+
+// Dropdowns
+// -------------------------
+
+// Make dropdown carets use link color in navs
+.nav .caret {
+ border-top-color: @link-color;
+ border-bottom-color: @link-color;
+}
+.nav a:hover .caret {
+ border-top-color: @link-hover-color;
+ border-bottom-color: @link-hover-color;
+}
+
+// Specific dropdowns
+.nav-tabs .dropdown-menu {
+ // make dropdown border overlap tab border
+ margin-top: -1px;
+ // Remove the top rounded corners here since there is a hard edge above the menu
+ .border-top-radius(0);
+}
diff --git a/docs/less/bootstrap/normalize.less b/docs/less/bootstrap/normalize.less
new file mode 100644
index 0000000..a2e9c64
--- /dev/null
+++ b/docs/less/bootstrap/normalize.less
@@ -0,0 +1,396 @@
+/*! normalize.css v2.1.0 | MIT License | git.io/normalize */
+
+// ==========================================================================
+// HTML5 display definitions
+// ==========================================================================
+
+//
+// Correct `block` display not defined in IE 8/9.
+//
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section,
+summary {
+ display: block;
+}
+
+//
+// Correct `inline-block` display not defined in IE 8/9.
+//
+
+audio,
+canvas,
+video {
+ display: inline-block;
+}
+
+//
+// Prevent modern browsers from displaying `audio` without controls.
+// Remove excess height in iOS 5 devices.
+//
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+//
+// Address styling not present in IE 8/9.
+//
+
+[hidden] {
+ display: none;
+}
+
+// ==========================================================================
+// Base
+// ==========================================================================
+
+//
+// 1. Set default font family to sans-serif.
+// 2. Prevent iOS text size adjust after orientation change, without disabling
+// user zoom.
+//
+
+html {
+ font-family: sans-serif; // 1
+ -webkit-text-size-adjust: 100%; // 2
+ -ms-text-size-adjust: 100%; // 2
+}
+
+//
+// Remove default margin.
+//
+
+body {
+ margin: 0;
+}
+
+// ==========================================================================
+// Links
+// ==========================================================================
+
+//
+// Address `outline` inconsistency between Chrome and other browsers.
+//
+
+a:focus {
+ outline: thin dotted;
+}
+
+//
+// Improve readability when focused and also mouse hovered in all browsers.
+//
+
+a:active,
+a:hover {
+ outline: 0;
+}
+
+// ==========================================================================
+// Typography
+// ==========================================================================
+
+//
+// Address variable `h1` font-size and margin within `section` and `article`
+// contexts in Firefox 4+, Safari 5, and Chrome.
+//
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+//
+// Address styling not present in IE 8/9, Safari 5, and Chrome.
+//
+
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+
+//
+// Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
+//
+
+b,
+strong {
+ font-weight: bold;
+}
+
+//
+// Address styling not present in Safari 5 and Chrome.
+//
+
+dfn {
+ font-style: italic;
+}
+
+//
+// Address differences between Firefox and other browsers.
+//
+
+hr {
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ height: 0;
+}
+
+//
+// Address styling not present in IE 8/9.
+//
+
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+//
+// Correct font family set oddly in Safari 5 and Chrome.
+//
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, serif;
+ font-size: 1em;
+}
+
+//
+// Improve readability of pre-formatted text in all browsers.
+//
+
+pre {
+ white-space: pre-wrap;
+}
+
+//
+// Set consistent quote types.
+//
+
+q {
+ quotes: "\201C" "\201D" "\2018" "\2019";
+}
+
+//
+// Address inconsistent and variable font size in all browsers.
+//
+
+small {
+ font-size: 80%;
+}
+
+//
+// Prevent `sub` and `sup` affecting `line-height` in all browsers.
+//
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sup {
+ top: -0.5em;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+// ==========================================================================
+// Embedded content
+// ==========================================================================
+
+//
+// Remove border when inside `a` element in IE 8/9.
+//
+
+img {
+ border: 0;
+}
+
+//
+// Correct overflow displayed oddly in IE 9.
+//
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+// ==========================================================================
+// Figures
+// ==========================================================================
+
+//
+// Address margin not present in IE 8/9 and Safari 5.
+//
+
+figure {
+ margin: 0;
+}
+
+// ==========================================================================
+// Forms
+// ==========================================================================
+
+//
+// Define consistent border, margin, and padding.
+//
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+//
+// 1. Correct `color` not being inherited in IE 8/9.
+// 2. Remove padding so people aren't caught out if they zero out fieldsets.
+//
+
+legend {
+ border: 0; // 1
+ padding: 0; // 2
+}
+
+//
+// 1. Correct font family not being inherited in all browsers.
+// 2. Correct font size not being inherited in all browsers.
+// 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
+//
+
+button,
+input,
+select,
+textarea {
+ font-family: inherit; // 1
+ font-size: 100%; // 2
+ margin: 0; // 3
+}
+
+//
+// Address Firefox 4+ setting `line-height` on `input` using `!important` in
+// the UA stylesheet.
+//
+
+button,
+input {
+ line-height: normal;
+}
+
+//
+// Address inconsistent `text-transform` inheritance for `button` and `select`.
+// All other form control elements do not inherit `text-transform` values.
+// Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
+// Correct `select` style inheritance in Firefox 4+ and Opera.
+//
+
+button,
+select {
+ text-transform: none;
+}
+
+//
+// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+// and `video` controls.
+// 2. Correct inability to style clickable `input` types in iOS.
+// 3. Improve usability and consistency of cursor style between image-type
+// `input` and others.
+//
+
+button,
+html input[type="button"], // 1
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; // 2
+ cursor: pointer; // 3
+}
+
+//
+// Re-set default cursor for disabled elements.
+//
+
+button[disabled],
+html input[disabled] {
+ cursor: default;
+}
+
+//
+// 1. Address box sizing set to `content-box` in IE 8/9.
+// 2. Remove excess padding in IE 8/9.
+//
+
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; // 1
+ padding: 0; // 2
+}
+
+//
+// 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
+// 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
+// (include `-moz` to future-proof).
+//
+
+input[type="search"] {
+ -webkit-appearance: textfield; // 1
+ -moz-box-sizing: content-box;
+ -webkit-box-sizing: content-box; // 2
+ box-sizing: content-box;
+}
+
+//
+// Remove inner padding and search cancel button in Safari 5 and Chrome
+// on OS X.
+//
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+//
+// Remove inner padding and border in Firefox 4+.
+//
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+//
+// 1. Remove default vertical scrollbar in IE 8/9.
+// 2. Improve readability and alignment in all browsers.
+//
+
+textarea {
+ overflow: auto; // 1
+ vertical-align: top; // 2
+}
+
+// ==========================================================================
+// Tables
+// ==========================================================================
+
+//
+// Remove most spacing between table cells.
+//
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
diff --git a/docs/less/bootstrap/pager.less b/docs/less/bootstrap/pager.less
new file mode 100644
index 0000000..0b2fcf7
--- /dev/null
+++ b/docs/less/bootstrap/pager.less
@@ -0,0 +1,54 @@
+//
+// Pager pagination
+// --------------------------------------------------
+
+
+.pager {
+ margin: @line-height-computed 0;
+ list-style: none;
+ text-align: center;
+ .clearfix();
+ li {
+ display: inline;
+ > a,
+ > span {
+ display: inline-block;
+ padding: 5px 14px;
+ background-color: @pagination-bg;
+ border: 1px solid @pagination-border;
+ border-radius: 15px;
+ }
+
+ > a:hover,
+ > a:focus {
+ text-decoration: none;
+ background-color: @pagination-active-bg;
+ }
+ }
+
+ .next {
+ > a,
+ > span {
+ float: right;
+ }
+ }
+
+ .previous {
+ > a,
+ > span {
+ float: left;
+ }
+ }
+
+ .disabled {
+ > a,
+ > a:hover,
+ > a:focus,
+ > span {
+ color: @gray-light;
+ background-color: @pagination-bg;
+ cursor: default;
+ }
+ }
+
+}
diff --git a/docs/less/bootstrap/pagination.less b/docs/less/bootstrap/pagination.less
new file mode 100644
index 0000000..73c063b
--- /dev/null
+++ b/docs/less/bootstrap/pagination.less
@@ -0,0 +1,87 @@
+//
+// Pagination (multiple pages)
+// --------------------------------------------------
+.pagination {
+ display: inline-block;
+ margin: @line-height-computed 0;
+ border-radius: @border-radius-base;
+}
+.pagination > li {
+ display: inline; // Remove list-style and block-level defaults
+}
+.pagination > li > a,
+.pagination > li > span {
+ float: left; // Collapse white-space
+ padding: 4px 12px;
+ line-height: @line-height-base;
+ text-decoration: none;
+ background-color: @pagination-bg;
+ border: 1px solid @pagination-border;
+ border-left-width: 0;
+}
+.pagination > li > a:hover,
+.pagination > li > a:focus,
+.pagination > .active > a,
+.pagination > .active > span {
+ background-color: @pagination-active-bg;
+}
+.pagination > .active > a,
+.pagination > .active > span {
+ color: @gray-light;
+ cursor: default;
+}
+.pagination > .disabled > span,
+.pagination > .disabled > a,
+.pagination > .disabled > a:hover,
+.pagination > .disabled > a:focus {
+ color: @gray-light;
+ background-color: @pagination-bg;
+ cursor: default;
+}
+.pagination > li:first-child > a,
+.pagination > li:first-child > span {
+ border-left-width: 1px;
+ .border-left-radius(@border-radius-base);
+}
+.pagination > li:last-child > a,
+.pagination > li:last-child > span {
+ .border-right-radius(@border-radius-base);
+}
+
+
+// Sizing
+// --------------------------------------------------
+
+// Large
+.pagination-large {
+ > li > a,
+ > li > span {
+ padding: @padding-large-vertical @padding-large-horizontal;
+ font-size: @font-size-large;
+ }
+ > li:first-child > a,
+ > li:first-child > span {
+ .border-left-radius(@border-radius-large);
+ }
+ > li:last-child > a,
+ > li:last-child > span {
+ .border-right-radius(@border-radius-large);
+ }
+}
+
+// Small
+.pagination-small {
+ > li > a,
+ > li > span {
+ padding: @padding-small-vertical @padding-small-horizontal;
+ font-size: @font-size-small;
+ }
+ > li:first-child > a,
+ > li:first-child > span {
+ .border-left-radius(@border-radius-small);
+ }
+ > li:last-child > a,
+ > li:last-child > span {
+ .border-right-radius(@border-radius-small);
+ }
+}
diff --git a/docs/less/bootstrap/panels.less b/docs/less/bootstrap/panels.less
new file mode 100644
index 0000000..a08febe
--- /dev/null
+++ b/docs/less/bootstrap/panels.less
@@ -0,0 +1,96 @@
+//
+// Panels
+// --------------------------------------------------
+
+
+// Base class
+.panel {
+ padding: 15px;
+ margin-bottom: 20px;
+ background-color: @panel-bg;
+ border: 1px solid @panel-border;
+ border-radius: @panel-border-radius;
+ .box-shadow(0 1px 1px rgba(0,0,0,.05));
+}
+
+// Optional heading
+.panel-heading {
+ margin: -15px -15px 15px;
+ padding: 10px 15px;
+ font-size: (@font-size-base * 1.25);
+ font-weight: 500;
+ 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);
+}
+
+// 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);
+}
+
+// Contextual variations
+.panel-primary {
+ border-color: @panel-primary-border;
+ .panel-heading {
+ color: @panel-primary-text;
+ background-color: @panel-primary-heading-bg;
+ border-color: @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-warning {
+ border-color: @panel-warning-border;
+ .panel-heading {
+ color: @panel-warning-text;
+ background-color: @panel-warning-heading-bg;
+ border-color: @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-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;
+ }
+ }
+}
diff --git a/docs/less/bootstrap/popovers.less b/docs/less/bootstrap/popovers.less
new file mode 100644
index 0000000..bcd30e9
--- /dev/null
+++ b/docs/less/bootstrap/popovers.less
@@ -0,0 +1,129 @@
+//
+// Popovers
+// --------------------------------------------------
+
+
+.popover {
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: @zindex-popover;
+ display: none;
+ max-width: 276px;
+ 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 #ccc;
+ border: 1px solid rgba(0,0,0,.2);
+ border-radius: 6px;
+ .box-shadow(0 5px 10px rgba(0,0,0,.2));
+
+ // Overrides for proper insertion
+ white-space: normal;
+
+ // Offset the popover to account for the popover arrow
+ &.top { margin-top: -10px; }
+ &.right { margin-left: 10px; }
+ &.bottom { margin-top: 10px; }
+ &.left { margin-left: -10px; }
+}
+
+.popover-title {
+ margin: 0; // reset heading margin
+ padding: 8px 14px;
+ font-size: @font-size-base;
+ font-weight: normal;
+ line-height: 18px;
+ background-color: @popover-title-bg;
+ border-bottom: 1px solid darken(@popover-title-bg, 5%);
+ border-radius: 5px 5px 0 0;
+}
+
+.popover-content {
+ padding: 9px 14px;
+}
+
+// Arrows
+//
+// .arrow is outer, .arrow:after is inner
+
+.popover .arrow,
+.popover .arrow:after {
+ position: absolute;
+ display: block;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+}
+.popover .arrow {
+ border-width: @popover-arrow-outer-width;
+}
+.popover .arrow:after {
+ border-width: @popover-arrow-width;
+ content: "";
+}
+
+.popover {
+ &.top .arrow {
+ left: 50%;
+ margin-left: -@popover-arrow-outer-width;
+ border-bottom-width: 0;
+ border-top-color: #999; // IE8 fallback
+ border-top-color: @popover-arrow-outer-color;
+ bottom: -@popover-arrow-outer-width;
+ &:after {
+ bottom: 1px;
+ margin-left: -@popover-arrow-width;
+ border-bottom-width: 0;
+ border-top-color: @popover-arrow-color;
+ }
+ }
+ &.right .arrow {
+ top: 50%;
+ left: -@popover-arrow-outer-width;
+ margin-top: -@popover-arrow-outer-width;
+ border-left-width: 0;
+ border-right-color: #999; // IE8 fallback
+ border-right-color: @popover-arrow-outer-color;
+ &:after {
+ left: 1px;
+ bottom: -@popover-arrow-width;
+ border-left-width: 0;
+ border-right-color: @popover-arrow-color;
+ }
+ }
+ &.bottom .arrow {
+ left: 50%;
+ margin-left: -@popover-arrow-outer-width;
+ border-top-width: 0;
+ border-bottom-color: #999; // IE8 fallback
+ border-bottom-color: @popover-arrow-outer-color;
+ top: -@popover-arrow-outer-width;
+ &:after {
+ top: 1px;
+ margin-left: -@popover-arrow-width;
+ border-top-width: 0;
+ border-bottom-color: @popover-arrow-color;
+ }
+ }
+
+ &.left .arrow {
+ top: 50%;
+ right: -@popover-arrow-outer-width;
+ margin-top: -@popover-arrow-outer-width;
+ border-right-width: 0;
+ border-left-color: #999; // IE8 fallback
+ border-left-color: @popover-arrow-outer-color;
+ &:after {
+ right: 1px;
+ border-right-width: 0;
+ border-left-color: @popover-arrow-color;
+ bottom: -@popover-arrow-width;
+ }
+ }
+
+}
diff --git a/docs/less/bootstrap/print.less b/docs/less/bootstrap/print.less
new file mode 100644
index 0000000..64c1ff9
--- /dev/null
+++ b/docs/less/bootstrap/print.less
@@ -0,0 +1,85 @@
+//
+// Basic print styles
+// --------------------------------------------------
+// Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css
+
+@media print {
+
+ * {
+ text-shadow: none !important;
+ color: #000 !important; // Black prints faster: h5bp.com/s
+ background: transparent !important;
+ box-shadow: none !important;
+ }
+
+ a,
+ a:visited {
+ text-decoration: underline;
+ }
+
+ a[href]:after {
+ content: " (" attr(href) ")";
+ }
+
+ abbr[title]:after {
+ content: " (" attr(title) ")";
+ }
+
+ // Don't show links for images, or javascript/internal links
+ .ir a:after,
+ a[href^="javascript:"]:after,
+ a[href^="#"]:after {
+ content: "";
+ }
+
+ pre,
+ blockquote {
+ border: 1px solid #999;
+ page-break-inside: avoid;
+ }
+
+ thead {
+ display: table-header-group; // h5bp.com/t
+ }
+
+ tr,
+ img {
+ page-break-inside: avoid;
+ }
+
+ img {
+ max-width: 100% !important;
+ }
+
+ @page {
+ margin: 2cm .5cm;
+ }
+
+ p,
+ h2,
+ h3 {
+ orphans: 3;
+ widows: 3;
+ }
+
+ h2,
+ h3 {
+ page-break-after: avoid;
+ }
+
+ // Bootstrap components
+ .navbar {
+ display: none;
+ }
+ .table td,
+ .table th {
+ background-color: #fff !important;
+ }
+ .btn > .caret,
+ .dropup > .btn > .caret {
+ border-top-color: #000 !important;
+ }
+ .label {
+ border: 1px solid #000;
+ }
+}
diff --git a/docs/less/bootstrap/progress-bars.less b/docs/less/bootstrap/progress-bars.less
new file mode 100644
index 0000000..e963fa9
--- /dev/null
+++ b/docs/less/bootstrap/progress-bars.less
@@ -0,0 +1,118 @@
+//
+// Progress bars
+// --------------------------------------------------
+
+
+// Bar animations
+// -------------------------
+
+// Webkit
+@-webkit-keyframes progress-bar-stripes {
+ from { background-position: 40px 0; }
+ to { background-position: 0 0; }
+}
+
+// Firefox
+@-moz-keyframes progress-bar-stripes {
+ from { background-position: 40px 0; }
+ 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
+@keyframes progress-bar-stripes {
+ from { background-position: 40px 0; }
+ to { background-position: 0 0; }
+}
+
+
+
+// Bar itself
+// -------------------------
+
+// Outer container
+.progress {
+ overflow: hidden;
+ height: @line-height-computed;
+ margin-bottom: @line-height-computed;
+ background-color: @progress-bg;
+ border-radius: @border-radius-base;
+ .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
+}
+
+// Bar of progress
+.progress-bar {
+ float: left;
+ width: 0%;
+ height: 100%;
+ font-size: @font-size-small;
+ color: #fff;
+ text-align: center;
+ text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+ background-color: @progress-bar-bg;
+ .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
+ .transition(width .6s ease);
+}
+
+// Striped bars
+.progress-striped .progress-bar {
+ #gradient > .striped(@progress-bar-bg);
+ .background-size(40px 40px);
+}
+
+// Call animation for the active one
+.progress.active .progress-bar {
+ -webkit-animation: progress-bar-stripes 2s linear infinite;
+ -moz-animation: progress-bar-stripes 2s linear infinite;
+ -ms-animation: progress-bar-stripes 2s linear infinite;
+ -o-animation: progress-bar-stripes 2s linear infinite;
+ animation: progress-bar-stripes 2s linear infinite;
+}
+
+
+
+// Variations
+// -------------------------
+
+// Danger (red)
+.progress-bar-danger {
+ background-color: @progress-bar-danger-bg;
+ .progress-striped & {
+ #gradient > .striped(@progress-bar-danger-bg);
+ }
+}
+
+// Success (green)
+.progress-bar-success {
+ background-color: @progress-bar-success-bg;
+ .progress-striped & {
+ #gradient > .striped(@progress-bar-success-bg);
+ }
+}
+
+// Warning (orange)
+.progress-bar-warning {
+ background-color: @progress-bar-warning-bg;
+ .progress-striped & {
+ #gradient > .striped(@progress-bar-warning-bg);
+ }
+}
+
+// Info (teal)
+.progress-bar-info {
+ background-color: @progress-bar-info-bg;
+ .progress-striped & {
+ #gradient > .striped(@progress-bar-info-bg);
+ }
+}
diff --git a/docs/less/bootstrap/responsive-utilities.less b/docs/less/bootstrap/responsive-utilities.less
new file mode 100644
index 0000000..082109e
--- /dev/null
+++ b/docs/less/bootstrap/responsive-utilities.less
@@ -0,0 +1,127 @@
+//
+// Responsive: Utility classes
+// --------------------------------------------------
+
+
+// IE10 Metro responsive
+// Required for Windows 8 Metro split-screen snapping with IE10
+//
+// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
+@-ms-viewport{
+ width: device-width;
+}
+
+// IE10 on Windows Phone 8
+// IE10 on WP8 doesn't report CSS pixels, but actual device pixels. In
+// other words, say on a Lumia, you'll get 768px as the device width,
+// meaning users will see the tablet styles and not phone styles.
+//
+// Alternatively you can override this with JS (see source below), but
+// we won't be doing that here given our limited scope.
+//
+// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/
+@media screen and (max-width: 400px) {
+ @-ms-viewport{
+ width: 320px;
+ }
+}
+
+// Hide from screenreaders and browsers
+// Credit: HTML5 Boilerplate
+.hidden {
+ display: none;
+ visibility: hidden;
+}
+
+// Visibility utilities
+
+// For Phones
+.visible-sm {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+}
+.visible-md { display: none !important; }
+.visible-lg { display: none !important; }
+
+.hidden-sm { display: none !important; }
+.hidden-md {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+}
+.hidden-lg {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+}
+
+
+// Tablets & small desktops only
+@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .visible-sm { display: none !important; }
+ .visible-md {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+ .visible-lg { display: none !important; }
+
+ .hidden-sm {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+ .hidden-md { display: none !important; }
+ .hidden-lg {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+}
+
+// For desktops
+@media (min-width: @screen-desktop) {
+ .visible-sm { display: none !important; }
+ .visible-md { display: none !important; }
+ .visible-lg {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+
+ .hidden-sm {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+ .hidden-md {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+ .hidden-lg { display: none !important; }
+}
+
+// Print utilities
+.visible-print { display: none !important; }
+.hidden-print { }
+
+@media print {
+ .visible-print {
+ display: block !important;
+ tr& { display: table-row !important; }
+ th&,
+ td& { display: table-cell !important; }
+ }
+ .hidden-print { display: none !important; }
+}
diff --git a/docs/less/bootstrap/scaffolding.less b/docs/less/bootstrap/scaffolding.less
new file mode 100644
index 0000000..9f57397
--- /dev/null
+++ b/docs/less/bootstrap/scaffolding.less
@@ -0,0 +1,81 @@
+//
+// Scaffolding
+// --------------------------------------------------
+
+
+// Reset the box-sizing
+// -------------------------
+
+* {
+ .box-sizing(border-box);
+}
+
+
+// Body reset
+// -------------------------
+
+html {
+ font-size: 62.5%;
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+
+body {
+ font-family: @font-family-base;
+ font-size: @font-size-base;
+ line-height: @line-height-base;
+ color: @text-color;
+ background-color: @body-bg;
+}
+
+// Reset fonts for revelant elements
+input,
+button,
+select,
+textarea {
+ font-family: inherit;
+ font-size: inherit;
+ line-height: inherit;
+}
+
+
+// Links
+// -------------------------
+
+a {
+ color: @link-color;
+ text-decoration: none;
+}
+a:hover,
+a:focus {
+ color: @link-hover-color;
+ text-decoration: underline;
+}
+a:focus {
+ .tab-focus();
+}
+
+
+// Images
+// -------------------------
+
+img {
+ // Responsive images (ensure images don't scale beyond their parents)
+ max-width: 100%; // Part 1: Set a maxium relative to the parent
+ height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+
+ // Match vertical alignment with other comment elements
+ vertical-align: middle;
+}
+
+// Rounded corners
+.img-rounded {
+ border-radius: 6px;
+}
+
+// Image thumbnails
+// See thumbnails.less for `.img-thumbnail`
+
+// Perfect circle
+.img-circle {
+ border-radius: 500px; // crank the border-radius so it works with most reasonably sized images
+}
diff --git a/docs/less/bootstrap/tables.less b/docs/less/bootstrap/tables.less
new file mode 100644
index 0000000..88481a9
--- /dev/null
+++ b/docs/less/bootstrap/tables.less
@@ -0,0 +1,244 @@
+//
+// Tables
+// --------------------------------------------------
+
+
+table {
+ max-width: 100%;
+ background-color: @table-bg;
+}
+th {
+ text-align: left;
+}
+
+
+// BASELINE STYLES
+// ---------------
+
+.table {
+ width: 100%;
+ margin-bottom: @line-height-computed;
+ // Cells
+ thead > tr > th,
+ tbody > tr > th,
+ thead > tr > td,
+ tbody > tr > td {
+ padding: 8px;
+ line-height: @line-height-base;
+ vertical-align: top;
+ border-top: 1px solid @table-border-color;
+ }
+ // Bottom align for column headings
+ thead > tr > th {
+ vertical-align: bottom;
+ }
+ // Remove top border from thead by default
+ caption + thead tr:first-child th,
+ caption + thead tr:first-child td,
+ colgroup + thead tr:first-child th,
+ colgroup + thead tr:first-child td,
+ thead:first-child tr:first-child th,
+ thead:first-child tr:first-child td {
+ border-top: 0;
+ }
+ // Account for multiple tbody instances
+ tbody + tbody {
+ border-top: 2px solid @table-border-color;
+ }
+
+ // Nesting
+ .table {
+ background-color: @body-bg;
+ }
+}
+
+
+
+// CONDENSED TABLE W/ HALF PADDING
+// -------------------------------
+
+.table-condensed {
+ thead > tr > th,
+ tbody > tr > th,
+ thead > tr > td,
+ tbody > tr > td {
+ padding: 4px 5px;
+ }
+}
+
+
+
+// BORDERED VERSION
+// ----------------
+
+.table-bordered {
+ border: 1px solid @table-border-color;
+ border-collapse: separate; // Done so we can round those corners!
+ border-left: 0;
+ border-radius: @border-radius-base;
+
+ > thead > tr > th,
+ > tbody > tr > th,
+ > thead > tr > td,
+ > tbody > tr > td {
+ border-left: 1px solid @table-border-color;
+ }
+ // Prevent a double border
+ > caption + thead > tr:first-child th,
+ > caption + tbody > tr:first-child th,
+ > caption + tbody > tr:first-child td,
+ > colgroup + thead > tr:first-child th,
+ > colgroup + tbody > tr:first-child th,
+ > colgroup + tbody > tr:first-child td,
+ > thead:first-child > tr:first-child th,
+ > tbody:first-child > tr:first-child th,
+ > tbody:first-child > tr:first-child td {
+ border-top: 0;
+ }
+ // For first th/td in the first row in the first thead or tbody
+ > thead:first-child > tr:first-child > th:first-child,
+ > tbody:first-child > tr:first-child > td:first-child,
+ > tbody:first-child > tr:first-child > th:first-child {
+ border-top-left-radius: @border-radius-base;
+ }
+ // For last th/td in the first row in the first thead or tbody
+ > thead:first-child > tr:first-child > th:last-child,
+ > tbody:first-child > tr:first-child > td:last-child,
+ > tbody:first-child > tr:first-child > th:last-child {
+ border-top-right-radius: @border-radius-base;
+ }
+ // For first th/td (can be either) in the last row in the last thead, tbody, and tfoot
+ > thead:last-child > tr:last-child > th:first-child,
+ > tbody:last-child > tr:last-child > td:first-child,
+ > tbody:last-child > tr:last-child > th:first-child,
+ > tfoot:last-child > tr:last-child > td:first-child,
+ > tfoot:last-child > tr:last-child > th:first-child {
+ border-bottom-left-radius: @border-radius-base;
+ }
+ // For last th/td (can be either) in the last row in the last thead, tbody, and tfoot
+ > thead:last-child > tr:last-child > th:last-child,
+ > tbody:last-child > tr:last-child > td:last-child,
+ > tbody:last-child > tr:last-child > th:last-child,
+ > tfoot:last-child > tr:last-child > td:last-child,
+ > tfoot:last-child > tr:last-child > th:last-child {
+ border-bottom-right-radius: @border-radius-base;
+ }
+
+ // Clear border-radius for first and last td in the last row in the last tbody for table with tfoot
+ > tfoot + tbody:last-child > tr:last-child > td:first-child {
+ border-bottom-left-radius: 0;
+ }
+ > tfoot + tbody:last-child > tr:last-child > td:last-child {
+ border-bottom-right-radius: 0;
+ }
+
+ // Special fixes to round the left border on the first td/th
+ > caption + thead > tr:first-child > th:first-child,
+ > caption + tbody > tr:first-child > td:first-child,
+ > colgroup + thead > tr:first-child > th:first-child,
+ > colgroup + tbody > tr:first-child > td:first-child {
+ border-top-left-radius: @border-radius-base;
+ }
+ > caption + thead > tr:first-child > th:last-child,
+ > caption + tbody > tr:first-child > td:last-child,
+ > colgroup + thead > tr:first-child > th:last-child,
+ > colgroup + tbody > tr:first-child > td:last-child {
+ border-top-right-radius: @border-radius-base;
+ }
+
+}
+
+
+
+// ZEBRA-STRIPING
+// --------------
+
+// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+.table-striped {
+ > tbody {
+ > tr:nth-child(odd) > td,
+ > tr:nth-child(odd) > th {
+ background-color: @table-bg-accent;
+ }
+ }
+}
+
+
+
+// HOVER EFFECT
+// ------------
+
+// Placed here since it has to come after the potential zebra striping
+.table-hover {
+ > tbody {
+ > tr:hover > td,
+ > tr:hover > th {
+ background-color: @table-bg-hover;
+ }
+ }
+}
+
+
+
+// TABLE CELL SIZING
+// -----------------
+
+// Reset default table behavior
+table col[class^="col-"] {
+ float: none;
+ display: table-column;
+}
+table td[class^="col-"],
+table th[class^="col-"] {
+ float: none;
+ display: table-cell;
+}
+
+
+
+// TABLE BACKGROUNDS
+// -----------------
+// Exact selectors below required to override .table-striped
+
+.table > tbody > tr {
+ > td.success,
+ > th.success,
+ &.success > td {
+ background-color: @state-success-bg;
+ border-color: @state-success-border;
+ }
+ > td.danger,
+ > th.danger,
+ &.danger > td {
+ background-color: @state-danger-bg;
+ border-color: @state-danger-border;
+ }
+ > td.warning,
+ > th.warning,
+ &.warning > td {
+ background-color: @state-warning-bg;
+ border-color: @state-warning-border;
+ }
+}
+
+// Hover states for .table-hover
+.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%);
+ }
+}
diff --git a/docs/less/bootstrap/thumbnails.less b/docs/less/bootstrap/thumbnails.less
new file mode 100644
index 0000000..f31d786
--- /dev/null
+++ b/docs/less/bootstrap/thumbnails.less
@@ -0,0 +1,43 @@
+//
+// Thumbnails
+// --------------------------------------------------
+
+
+// Base classes
+// For thumbnail block-level composite components and simple image styles
+
+// The actual thumbnailed element
+// Can be `a`, `div`, or `img`
+.thumbnail,
+.img-thumbnail {
+ padding: 4px;
+ line-height: @line-height-base;
+ background-color: @thumbnail-bg;
+ border: 1px solid @thumbnail-border;
+ border-radius: @thumbnail-border-radius;
+ .transition(all .2s ease-in-out);
+}
+.thumbnail {
+ display: block;
+}
+.img-thumbnail {
+ display: inline-block;
+}
+
+// Add a hover state for linked versions only
+a.thumbnail:hover,
+a.thumbnail:focus {
+ border-color: @link-color;
+}
+
+// Images and captions
+.thumbnail > img {
+ display: block;
+ max-width: 100%;
+ margin-left: auto;
+ margin-right: auto;
+}
+.thumbnail .caption {
+ padding: 9px;
+ color: @thumbnail-caption-color;
+}
diff --git a/docs/less/bootstrap/tooltip.less b/docs/less/bootstrap/tooltip.less
new file mode 100644
index 0000000..9dba6f0
--- /dev/null
+++ b/docs/less/bootstrap/tooltip.less
@@ -0,0 +1,71 @@
+//
+// Tooltips
+// --------------------------------------------------
+
+
+// Base class
+.tooltip {
+ position: absolute;
+ z-index: @zindex-tooltip;
+ display: block;
+ visibility: visible;
+ font-size: @font-size-mini;
+ line-height: 1.4;
+ .opacity(0);
+
+ &.in { .opacity(1); }
+ &.top { margin-top: -3px; padding: 5px 0; }
+ &.right { margin-left: 3px; padding: 0 5px; }
+ &.bottom { margin-top: 3px; padding: 5px 0; }
+ &.left { margin-left: -3px; padding: 0 5px; }
+}
+
+// Wrapper for the tooltip content
+.tooltip-inner {
+ max-width: 200px;
+ padding: 3px 8px;
+ color: @tooltip-color;
+ text-align: center;
+ text-decoration: none;
+ background-color: @tooltip-bg;
+ border-radius: @border-radius-base;
+}
+
+// Arrows
+.tooltip-arrow {
+ position: absolute;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+}
+.tooltip {
+ &.top .tooltip-arrow {
+ bottom: 0;
+ left: 50%;
+ margin-left: -@tooltip-arrow-width;
+ border-width: @tooltip-arrow-width @tooltip-arrow-width 0;
+ border-top-color: @tooltip-arrow-color;
+ }
+ &.right .tooltip-arrow {
+ top: 50%;
+ left: 0;
+ margin-top: -@tooltip-arrow-width;
+ border-width: @tooltip-arrow-width @tooltip-arrow-width @tooltip-arrow-width 0;
+ border-right-color: @tooltip-arrow-color;
+ }
+ &.left .tooltip-arrow {
+ top: 50%;
+ right: 0;
+ margin-top: -@tooltip-arrow-width;
+ border-width: @tooltip-arrow-width 0 @tooltip-arrow-width @tooltip-arrow-width;
+ border-left-color: @tooltip-arrow-color;
+ }
+ &.bottom .tooltip-arrow {
+ top: 0;
+ left: 50%;
+ margin-left: -@tooltip-arrow-width;
+ border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;
+ border-bottom-color: @tooltip-arrow-color;
+ }
+}
diff --git a/docs/less/bootstrap/type.less b/docs/less/bootstrap/type.less
new file mode 100644
index 0000000..9892d55
--- /dev/null
+++ b/docs/less/bootstrap/type.less
@@ -0,0 +1,246 @@
+//
+// Typography
+// --------------------------------------------------
+
+
+// Body text
+// -------------------------
+
+p {
+ margin: 0 0 (@line-height-computed / 2);
+}
+.lead {
+ margin-bottom: @line-height-computed;
+ font-size: (@font-size-base * 1.5);
+ font-weight: 200;
+ line-height: 1.4;
+}
+
+
+// Emphasis & misc
+// -------------------------
+
+// Ex: 14px base font * 85% = about 12px
+small { font-size: 85%; }
+
+cite { font-style: normal; }
+
+// Utility classes
+.text-muted { color: @gray-light; }
+a.text-muted:hover,
+a.text-muted:focus { color: darken(@gray-light, 10%); }
+
+.text-warning { color: @state-warning-text; }
+a.text-warning:hover,
+a.text-warning:focus { color: darken(@state-warning-text, 10%); }
+
+.text-danger { color: @state-danger-text; }
+a.text-danger:hover,
+a.text-danger:focus { color: darken(@state-danger-text, 10%); }
+
+.text-success { color: @state-success-text; }
+a.text-success:hover,
+a.text-success:focus { color: darken(@state-success-text, 10%); }
+
+.text-left { text-align: left; }
+.text-right { text-align: right; }
+.text-center { text-align: center; }
+
+
+// Headings
+// -------------------------
+
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6 {
+ font-family: @headings-font-family;
+ font-weight: @headings-font-weight;
+ line-height: @headings-line-height;
+ small {
+ font-weight: normal;
+ line-height: 1;
+ color: @gray-light;
+ }
+}
+
+h1,
+h2,
+h3 {
+ margin-top: @line-height-computed;
+ margin-bottom: (@line-height-computed / 2);
+}
+h4,
+h5,
+h6 {
+ margin-top: (@line-height-computed / 2);
+ margin-bottom: (@line-height-computed / 2);
+}
+
+h1, .h1 { font-size: ceil(@font-size-base * 2.70); } // ~38px
+h2, .h2 { font-size: ceil(@font-size-base * 2.25); } // ~32px
+h3, .h3 { font-size: ceil(@font-size-base * 1.70); } // ~24px
+h4, .h4 { font-size: ceil(@font-size-base * 1.25); } // ~18px
+h5, .h5 { font-size: @font-size-base; }
+h6, .h6 { font-size: ceil(@font-size-base * 0.85); } // ~12px
+
+h1 small, .h1 small { font-size: ceil(@font-size-base * 1.70); } // ~24px
+h2 small, .h2 small { font-size: ceil(@font-size-base * 1.25); } // ~18px
+h3 small, .h3 small,
+h4 small, .h4 small { font-size: @font-size-base; }
+
+
+// Page header
+// -------------------------
+
+.page-header {
+ padding-bottom: ((@line-height-computed / 2) - 1);
+ margin: (@line-height-computed * 2) 0 @line-height-computed;
+ border-bottom: 1px solid @gray-lighter;
+}
+
+
+
+// Lists
+// --------------------------------------------------
+
+// Unordered and Ordered lists
+ul,
+ol {
+ margin-top: 0;
+ margin-bottom: (@line-height-computed / 2);
+}
+ul ul,
+ul ol,
+ol ol,
+ol ul {
+ margin-bottom: 0;
+}
+
+// List options
+
+// Unstyled keeps list items block level, just removes default browser padding and list-style
+.list-unstyled {
+ padding-left: 0;
+ list-style: none;
+}
+// Inline turns list items into inline-block
+.list-inline {
+ .list-unstyled();
+ > li {
+ display: inline-block;
+ padding-left: 5px;
+ padding-right: 5px;
+ }
+}
+
+// Description Lists
+dl {
+ margin-bottom: @line-height-computed;
+}
+dt,
+dd {
+ line-height: @line-height-base;
+}
+dt {
+ font-weight: bold;
+}
+dd {
+ margin-left: (@line-height-computed / 2);
+}
+// 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;
+ }
+}
+
+// MISC
+// ----
+
+// Horizontal rules
+hr {
+ margin: @line-height-computed 0;
+ border: 0;
+ border-top: 1px solid @hr-border;
+ border-bottom: 1px solid #fff;
+ border-bottom: 1px solid rgba(255,255,255,.5);
+}
+
+// Abbreviations and acronyms
+abbr[title],
+// Added data-* attribute to help out our tooltip plugin, per https://github.com/twitter/bootstrap/issues/5257
+abbr[data-original-title] {
+ cursor: help;
+ border-bottom: 1px dotted @gray-light;
+}
+abbr.initialism {
+ font-size: 90%;
+ text-transform: uppercase;
+}
+
+// Blockquotes
+blockquote {
+ padding: (@line-height-computed / 2) @line-height-computed;
+ margin: 0 0 @line-height-computed;
+ border-left: 5px solid @gray-lighter;
+ p {
+ font-size: (@font-size-base * 1.25);
+ font-weight: 300;
+ line-height: 1.25;
+ }
+ p:last-child {
+ margin-bottom: 0;
+ }
+ small {
+ display: block;
+ line-height: @line-height-base;
+ color: @gray-light;
+ &:before {
+ content: '\2014 \00A0';
+ }
+ }
+
+ // Float right with text-align: right
+ &.pull-right {
+ float: right;
+ padding-right: 15px;
+ padding-left: 0;
+ border-right: 5px solid @gray-lighter;
+ border-left: 0;
+ p,
+ small {
+ text-align: right;
+ }
+ small {
+ &:before {
+ content: '';
+ }
+ &:after {
+ content: '\00A0 \2014';
+ }
+ }
+ }
+}
+
+// Quotes
+q:before,
+q:after,
+blockquote:before,
+blockquote:after {
+ content: "";
+}
+
+// Addresses
+address {
+ display: block;
+ margin-bottom: @line-height-computed;
+ font-style: normal;
+ line-height: @line-height-base;
+}
diff --git a/docs/less/bootstrap/utilities.less b/docs/less/bootstrap/utilities.less
new file mode 100644
index 0000000..d296b32
--- /dev/null
+++ b/docs/less/bootstrap/utilities.less
@@ -0,0 +1,42 @@
+//
+// Utility classes
+// --------------------------------------------------
+
+
+// Floats
+// -------------------------
+
+.clearfix {
+ .clearfix();
+}
+.pull-right {
+ float: right;
+}
+.pull-left {
+ float: left;
+}
+
+
+// Toggling content
+// -------------------------
+
+.hide {
+ display: none !important;
+}
+.show {
+ display: block !important;
+}
+.invisible {
+ visibility: hidden;
+}
+.text-hide {
+ .hide-text();
+}
+
+
+// For Affix plugin
+// -------------------------
+
+.affix {
+ position: fixed;
+}
diff --git a/docs/less/bootstrap/variables.less b/docs/less/bootstrap/variables.less
new file mode 100644
index 0000000..4fd0d49
--- /dev/null
+++ b/docs/less/bootstrap/variables.less
@@ -0,0 +1,429 @@
+//
+// Variables
+// --------------------------------------------------
+
+
+// Global values
+// --------------------------------------------------
+
+
+// Grays
+// -------------------------
+
+@gray-darker: lighten(#000, 13.5%); // #222
+@gray-dark: lighten(#000, 20%); // #333
+@gray: lighten(#000, 33.5%); // #555
+@gray-light: lighten(#000, 60%); // #999
+@gray-lighter: lighten(#000, 93.5%); // #eee
+
+// Brand colors
+// -------------------------
+
+@brand-primary: #428bca;
+@brand-success: #5cb85c;
+@brand-warning: #f0ad4e;
+@brand-danger: #d9534f;
+@brand-info: #5bc0de;
+
+// Scaffolding
+// -------------------------
+
+@body-bg: #fff;
+@text-color: @gray-dark;
+
+// Links
+// -------------------------
+
+@link-color: @brand-primary;
+@link-hover-color: darken(@link-color, 15%);
+
+// Typography
+// -------------------------
+
+@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
+@font-family-serif: Georgia, "Times New Roman", Times, serif;
+@font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace;
+@font-family-base: @font-family-sans-serif;
+
+@font-size-base: 14px;
+@font-size-large: ceil(@font-size-base * 1.25); // ~18px
+@font-size-small: ceil(@font-size-base * 0.85); // ~12px
+@font-size-mini: ceil(@font-size-base * 0.75); // ~11px
+
+@line-height-base: 1.428571429; // 20/14
+@line-height-computed: floor(@font-size-base * @line-height-base); // ~20px
+
+@headings-font-family: @font-family-base;
+@headings-font-weight: 500;
+@headings-line-height: 1.1;
+
+
+// Components
+// -------------------------
+// Based on 14px font-size and 1.428 line-height (~20px to start)
+
+@padding-base-vertical: 8px;
+@padding-base-horizontal: 12px;
+
+@padding-large-vertical: 14px;
+@padding-large-horizontal: 16px;
+
+@padding-small-vertical: 5px;
+@padding-small-horizontal: 10px;
+
+@border-radius-base: 4px;
+@border-radius-large: 6px;
+@border-radius-small: 3px;
+
+@component-active-bg: @brand-primary;
+
+
+// Tables
+// -------------------------
+
+@table-bg: transparent; // overall background-color
+@table-bg-accent: #f9f9f9; // for striping
+@table-bg-hover: #f5f5f5; // for hover
+
+@table-border-color: #ddd; // table and cell border
+
+
+// Buttons
+// -------------------------
+
+@btn-default-color: #fff;
+@btn-default-bg: #474949;
+@btn-default-border: @btn-default-bg;
+
+@btn-primary-color: @btn-default-color;
+@btn-primary-bg: @brand-primary;
+@btn-primary-border: @btn-primary-bg;
+
+@btn-success-color: @btn-default-color;
+@btn-success-bg: @brand-success;
+@btn-success-border: @btn-success-bg;
+
+@btn-warning-color: @btn-default-color;
+@btn-warning-bg: @brand-warning;
+@btn-warning-border: @btn-warning-bg;
+
+@btn-danger-color: @btn-default-color;
+@btn-danger-bg: @brand-danger;
+@btn-danger-border: @btn-danger-bg;
+
+@btn-info-color: @btn-default-color;
+@btn-info-bg: @brand-info;
+@btn-info-border: @btn-info-bg;
+
+
+
+// Forms
+// -------------------------
+
+@input-bg: #fff;
+@input-bg-disabled: @gray-lighter;
+
+@input-border: #ccc;
+@input-border-radius: @border-radius-base;
+
+@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);
+
+
+// Dropdowns
+// -------------------------
+
+@dropdown-bg: #fff;
+@dropdown-border: rgba(0,0,0,.15);
+@dropdown-divider-top: #e5e5e5;
+@dropdown-divider-bottom: #fff;
+
+@dropdown-link-active-color: #fff;
+@dropdown-link-active-bg: @component-active-bg;
+
+@dropdown-link-color: @gray-dark;
+@dropdown-link-hover-color: #fff;
+@dropdown-link-hover-bg: @dropdown-link-active-bg;
+
+
+// COMPONENT VARIABLES
+// --------------------------------------------------
+
+
+// Z-index master list
+// -------------------------
+// Used for a bird's eye view of components dependent on the z-axis
+// Try to avoid customizing these :)
+
+@zindex-dropdown: 1000;
+@zindex-popover: 1010;
+@zindex-tooltip: 1030;
+@zindex-navbar-fixed: 1030;
+@zindex-modal-background: 1040;
+@zindex-modal: 1050;
+
+
+// Glyphicons font path
+// -------------------------
+@glyphicons-font-path: "../fonts";
+
+
+// Navbar
+// -------------------------
+
+// Basics of a navbar
+@navbar-height: 50px;
+@navbar-color: #777;
+@navbar-bg: #eee;
+@navbar-padding: floor(@grid-gutter-width / 2); // ~15px
+
+// Navbar links
+@navbar-link-color: #777;
+@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-disabled-color: #ccc;
+@navbar-link-disabled-bg: transparent;
+
+// Navbar brand label
+@navbar-brand-color: @navbar-link-color;
+@navbar-brand-hover-color: darken(@navbar-link-color, 10%);
+@navbar-brand-hover-bg: transparent;
+
+// Inverted navbar
+@navbar-inverse-color: @gray-light;
+@navbar-inverse-bg: #222;
+
+// Inverted navbar links
+@navbar-inverse-link-color: @gray-light;
+@navbar-inverse-link-hover-color: #fff;
+@navbar-inverse-link-hover-bg: transparent;
+@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;
+@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);
+@navbar-inverse-link-disabled-color: #444;
+@navbar-inverse-link-disabled-bg: transparent;
+
+// Inverted navbar brand label
+@navbar-inverse-brand-color: @navbar-inverse-link-color;
+@navbar-inverse-brand-hover-color: #fff;
+@navbar-inverse-brand-hover-bg: transparent;
+
+// Inverted navbar search
+// Normal navbar needs no special styles or vars
+@navbar-inverse-search-bg: lighten(@navbar-inverse-bg, 25%);
+@navbar-inverse-search-bg-focus: #fff;
+@navbar-inverse-search-border: @navbar-inverse-bg;
+@navbar-inverse-search-placeholder-color: #ccc;
+
+
+// Pagination
+// -------------------------
+
+@pagination-bg: #fff;
+@pagination-border: #ddd;
+@pagination-active-bg: #f5f5f5;
+
+
+// Jumbotron
+// -------------------------
+
+@jumbotron-bg: @gray-lighter;
+@jumbotron-heading-color: inherit;
+@jumbotron-lead-color: inherit;
+
+
+// Form states and alerts
+// -------------------------
+
+@state-warning-text: #c09853;
+@state-warning-bg: #fcf8e3;
+@state-warning-border: darken(spin(@state-warning-bg, -10), 3%);
+
+@state-danger-text: #b94a48;
+@state-danger-bg: #f2dede;
+@state-danger-border: darken(spin(@state-danger-bg, -10), 3%);
+
+@state-success-text: #468847;
+@state-success-bg: #dff0d8;
+@state-success-border: darken(spin(@state-success-bg, -10), 5%);
+
+@state-info-text: #3a87ad;
+@state-info-bg: #d9edf7;
+@state-info-border: darken(spin(@state-info-bg, -10), 7%);
+
+
+// Tooltips and popovers
+// -------------------------
+@tooltip-color: #fff;
+@tooltip-bg: rgba(0,0,0,.9);
+@tooltip-arrow-width: 5px;
+@tooltip-arrow-color: @tooltip-bg;
+
+@popover-bg: #fff;
+@popover-arrow-width: 10px;
+@popover-arrow-color: #fff;
+@popover-title-bg: darken(@popover-bg, 3%);
+
+// Special enhancement for popovers
+@popover-arrow-outer-width: (@popover-arrow-width + 1);
+@popover-arrow-outer-color: rgba(0,0,0,.25);
+
+
+// Labels
+// -------------------------
+@label-success-bg: @brand-success;
+@label-info-bg: @brand-info;
+@label-warning-bg: @brand-warning;
+@label-danger-bg: @brand-danger;
+
+
+// Modals
+// -------------------------
+@modal-inner-padding: 20px;
+
+@modal-title-padding: 15px;
+@modal-title-line-height: @line-height-base;
+
+// Alerts
+// -------------------------
+@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;
+@alert-success-border: @state-success-border;
+
+@alert-danger-bg: @state-danger-bg;
+@alert-danger-text: @state-danger-text;
+@alert-danger-border: @state-danger-border;
+
+@alert-info-bg: @state-info-bg;
+@alert-info-text: @state-info-text;
+@alert-info-border: @state-info-border;
+
+
+// Progress bars
+// -------------------------
+@progress-bg: #f5f5f5;
+@progress-bar-bg: @brand-primary;
+@progress-bar-success-bg: @brand-success;
+@progress-bar-warning-bg: @brand-warning;
+@progress-bar-danger-bg: @brand-danger;
+@progress-bar-info-bg: @brand-info;
+
+
+// List group
+// -------------------------
+@list-group-bg: #fff;
+@list-group-border: #ddd;
+@list-group-border-radius: @border-radius-base;
+
+@list-group-hover-bg: #f5f5f5;
+@list-group-active-color: #fff;
+@list-group-active-bg: @component-active-bg;
+@list-group-active-border: @list-group-active-bg;
+
+// Panels
+// -------------------------
+@panel-bg: #fff;
+@panel-border: #ddd;
+@panel-border-radius: @border-radius-base;
+@panel-heading-bg: #f5f5f5;
+@panel-footer-bg: #f5f5f5;
+
+@panel-primary-text: #fff;
+@panel-primary-border: @brand-primary;
+@panel-primary-heading-bg: @brand-primary;
+
+@panel-success-text: @state-success-text;
+@panel-success-border: @state-success-border;
+@panel-success-heading-bg: @state-success-bg;
+
+@panel-warning-text: @state-warning-text;
+@panel-warning-border: @state-warning-border;
+@panel-warning-heading-bg: @state-warning-bg;
+
+@panel-danger-text: @state-danger-text;
+@panel-danger-border: @state-danger-border;
+@panel-danger-heading-bg: @state-danger-bg;
+
+@panel-info-text: @state-info-text;
+@panel-info-border: @state-info-border;
+@panel-info-heading-bg: @state-info-bg;
+
+
+// Thumbnails
+// -------------------------
+@thumbnail-caption-color: @text-color;
+@thumbnail-bg: @body-bg;
+@thumbnail-border: #ddd;
+@thumbnail-border-radius: @border-radius-base;
+
+
+// Wells
+// -------------------------
+@well-bg: #f5f5f5;
+
+
+// Miscellaneous
+// -------------------------
+
+// Hr border color
+@hr-border: @gray-lighter;
+
+// Horizontal forms & lists
+@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;
+
+// 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;
diff --git a/docs/less/bootstrap/wells.less b/docs/less/bootstrap/wells.less
new file mode 100644
index 0000000..6a909f4
--- /dev/null
+++ b/docs/less/bootstrap/wells.less
@@ -0,0 +1,29 @@
+//
+// Wells
+// --------------------------------------------------
+
+
+// Base class
+.well {
+ min-height: 20px;
+ padding: 19px;
+ margin-bottom: 20px;
+ background-color: @well-bg;
+ border: 1px solid darken(@well-bg, 7%);
+ border-radius: @border-radius-base;
+ .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
+ blockquote {
+ border-color: #ddd;
+ border-color: rgba(0,0,0,.15);
+ }
+}
+
+// Sizes
+.well-large {
+ padding: 24px;
+ border-radius: @border-radius-large;
+}
+.well-small {
+ padding: 9px;
+ border-radius: @border-radius-small;
+}
diff --git a/docs/less/cheatsheet.less b/docs/less/cheatsheet.less
new file mode 100644
index 0000000..2ee62e6
--- /dev/null
+++ b/docs/less/cheatsheet.less
@@ -0,0 +1,57 @@
+* {
+ padding:0;
+ margin:0;
+}
+#header_content {
+ width: 960px;
+ margin: 0 auto;
+}
+#main {
+ float: none;
+}
+#main_content {
+ width: 960px;
+ margin: 0 auto;
+ float: none;
+}
+h2 {
+ font-family: 'Average Sans', sans-serif;
+ color: #0099FF;
+ margin-top: 25px;
+ margin-bottom: 15px;
+}
+.left {
+ float:left;
+ width: 320px;
+}
+.center {
+ float:left;
+ width: 320px;
+}
+.right {
+ float:left;
+ width: 320px;
+}
+.icon {
+ font-family: 'weather';
+ src: url('../font/weathericons-regular-webfont.eot');
+ src: url('../font/weathericons-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../font/weathericons-regular-webfont.woff') format('woff'), url('../font/weathericons-regular-webfont.ttf') format('truetype'), url('../font/weathericons-regular-webfont.svg#weathericons-regular-webfontRg') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+.icon_name {
+ font-family: 'Average Sans', sans-serif;
+}
+.icon_unicode {
+ font-family: 'Average Sans', sans-serif;
+ color: #BBBBBB;
+ font-size: 0.8em;
+ float: none;
+}
+.stop_float {
+ clear: both;
+}
+#footer_content {
+ width: 960px;
+ margin: 0 auto;
+}
diff --git a/docs/less/main.less b/docs/less/main.less
new file mode 100644
index 0000000..3d59d4c
--- /dev/null
+++ b/docs/less/main.less
@@ -0,0 +1,250 @@
+body {
+ font-family: @copy;
+ font-weight: @normal;
+ font-size: 14px;
+ color: hsl(0, 0%, 20%);
+}
+
+ .reference {
+ font-family: "Helvetica", Arial, sans-serif;
+ font-size: 22px;
+ }
+
+
+h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
+ font-family: @copy;
+}
+
+header {
+ position: relative;
+ height: 100px;
+ padding-top: 0px;
+ background: url("img/sky.jpg") top center no-repeat fixed;
+ border-bottom: 5px solid hsl(0, 0%, 25%);
+ @media (min-width: @screen-tablet) {
+ height: 300px;
+ }
+ h1 {
+ float: left;
+ font-family: "proxima nova", @copy;
+ font-weight: 100;
+ font-size: 30px;
+ margin-top: 40px;
+ margin-left: 0px;
+ color: hsl(0, 0%, 100%);
+ text-shadow: 0px 2px 2px hsla(0, 0%, 0%, .9);
+ @media (min-width: @screen-tablet) {
+ font-size: 60px;
+ margin-top: 180px;
+ }
+ }
+ .icon {
+ position: absolute;
+ right: 20px;
+ top: 40px;
+ //bottom: 10px;
+ color: hsl(0, 0%, 100%);
+ font-size: 55px;
+ margin-left: 100px;
+ //margin-top: 120px;
+ float: left;
+ line-height: .65em;
+ text-shadow: 0px 2px 2px hsla(0, 0%, 0%, .5);
+ @media (min-width: @screen-tablet) {
+ font-size: 200px;
+ top: 100px;
+ }
+ }
+}
+
+footer {
+ height: 200px;
+ background-color: hsl(0, 0%, 20%);
+ margin-top: 30px;
+ color: hsl(0, 0%, 100%);
+ padding-top: 15px;
+ font-weight: @normal;
+ a {
+ color: hsl(0, 0%, 70%);
+ }
+}
+
+.buttons {
+ font-size: 100px;
+}
+
+.follow {
+ text-align: center;
+}
+
+.intro-icons {
+ font-size: 15px;
+ color: hsl(208, 56%, 47%);
+ i {
+ margin-right: 10px;
+ }
+ @media (min-width: @screen-tablet) {
+ font-size: 25px;
+ i {
+ margin-right: 10px;
+ }
+ }
+ @media (min-width: @screen-desktop) {
+ font-size: 45px;
+ i {
+ margin-right: 10px;
+ }
+ }
+}
+
+.headline {
+ font-size: 25px;
+ line-height: 1.3em;
+ margin-bottom: 30px;
+}
+
+.social {
+ margin-top: 15px;
+ p {
+ margin-bottom: 0px;
+ text-align: center;
+ }
+}
+
+
+.download-here {
+ margin-top: 20px;
+
+}
+
+.download {
+ display: block;
+
+}
+
+.intro {
+ font-size: 18px;
+ margin-top: 30px;
+ font-weight: @normal;
+}
+.beta {
+ margin-top: 20px;
+ color: hsl(0, 0%, 50%);
+ .title {
+ color: hsl(0, 0%, 50%);
+ font-weight: @semibold;
+ font-size: 20px;
+ }
+ p {
+ font-weight: @normal;
+ font-size: 15px;
+ }
+}
+.download-button {
+ .make-column(4);
+ .make-column-offset(4);
+}
+
+.banner {
+ background-color: hsl(0, 0%, 90%);
+ background-image: url("img/large-bg2.jpg");
+ background-repeat: no-repeat;
+ background-position: top center;
+ background-attachment: fixed;
+ height: 250px;
+ h1 {
+ color: hsl(0, 0%, 100%);
+ font-weight: @normal;
+ }
+
+ a {
+ display: block;
+ text-decoration: none;
+ }
+
+ .tweet {
+ //font-size: 25px;
+ //float: left;
+ .icon-circle {
+ color: hsl(200, 100%, 60%);
+ }
+ .icon-twitter {
+ color: hsl(0, 0%, 100%);
+ }
+ &:hover {
+ .icon-circle {
+ color: hsl(200, 100%, 40%);
+ }
+ }
+ }
+ .icon-stack {
+ display: inline-block;
+ }
+ .tweeter {
+ display: inline-block;
+ font-weight: @bold;
+ color: hsl(0, 0%, 100%);
+ }
+
+
+ .github {
+ font-size: 25px;
+ float: left;
+ .icon-circle {
+ color: hsl(200, 0%, 60%);
+ }
+ .icon-github-alt {
+ color: hsl(0, 0%, 100%);
+ }
+
+ }
+}
+
+.iconExamples {
+ .clearfix;
+ h2 {
+ font-family: @copy;
+ font-weight: @ultraLight;
+ color: hsl(217, 51%, 47%);
+ }
+ .example {
+ @fontsize: 28px;
+ .clearfix;
+ text-align: center;
+ margin: 10px 3px;
+ .icon {
+ font-size: @fontsize;
+ float: left;
+ width: 35px;
+ i {
+ //background-color: hsl(120, 100%, 70%);
+ }
+ }
+ .class {
+ text-align: center;
+ font-size: 14px;
+ float: left;
+ margin-top: 6px;
+ font-weight: 400;
+ margin-left: 10px;
+ color: hsl(0, 0%, 20%);
+ }
+ }
+}
+
+
+
+
+.download-share {
+ padding: 20px 0px 30px 0px;
+ border-top: 1px solid hsl(0, 0%, 90%);
+ border-bottom: 1px solid hsl(0, 0%, 90%);
+ background-color: hsl(0, 0%, 95%);
+ margin-top: 30px;
+
+ .box-shadow(inset 0px 0px 15px hsla(0, 0%, 0%, .1))
+}
+
+
+
+
diff --git a/docs/less/mixins.less b/docs/less/mixins.less
new file mode 100644
index 0000000..ae556c1
--- /dev/null
+++ b/docs/less/mixins.less
@@ -0,0 +1,96 @@
+.gray(@percent) {
+ color: hsl(0,0%,(@percent));
+}
+
+.ul-inline-no-style() {
+ margin: 0px;
+ list-style: none;
+ .clearfix;
+ li {
+ float: left;
+ display: block;
+ }
+}
+
+.ul-block-no-style() {
+ margin: 0px;
+ list-style: none;
+ .clearfix;
+}
+
+// 1 pixel black and white text shadows
+.textShadowBlack(@shadow) {
+ text-shadow: 0 1px 1px hsla(0,0%,0%,@shadow);
+}
+.textShadowWhite(@shadow: 0 1px 0px hsla(0,0%,100%,0.8)) {
+ text-shadow: @shadow;
+}
+
+
+// easy background image mixin
+.bgi(@src, @xpos: 0, @ypos: 0, @repeat: no-repeat) {
+ background-image: url(@src);
+ background-position: @xpos @ypos;
+ background-attachment: scroll;
+ background-repeat: @repeat;
+}
+
+
+// Background-cover mixin yay
+.background-cover(@cover: cover) {
+ -webkit-background-size: @cover;
+ -moz-background-size: @cover;
+ -o-background-size: @cover;
+ background-size: @cover;
+}
+
+
+// CSS3 modern box sizing - padding is included in sum
+.box-sizing(@type: border-box) {
+ -webkit-box-sizing: @type;
+ -moz-box-sizing: @type;
+ box-sizing: @type;
+}
+
+
+
+// the retina mixin. An example goes: .at2x(img/header@2x.png, 650px, 150px, top, left, no-repeat, scroll)
+// Put the size that the image appears on a non-retina, e.g. if it's a 200px x 200px non-retina, that is the effective size. The @2x 400px x 400px is calculated automatically. The order to type it is width then height.
+// A modification of the retina.js less mixin - https://github.com/imulus/retinajs
+
+
+@highdpi: ~"(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-resolution: 1.5dppx)";
+.at2x(@path, @w: auto, @h: auto, @xpos: 0, @ypos: 0, @repeat: no-repeat, @attachment: scroll) {
+ background-image: url(@path);
+ background-position: @xpos @ypos;
+ background-repeat: @repeat;
+ background-attachment: @attachment;
+ @at2x_path: ~`"@{path}".split('.').slice(0, "@{path}".split('.').length - 1).join(".") + "@2x" + "." + "@{path}".split('.')["@{path}".split('.').length - 1]`;
+ @media @highdpi {
+ background-image: url(@at2x_path);
+ background-size: @w @h;
+ background-position: @xpos @ypos;
+ background-repeat: @repeat;
+ background-attachment: @attachment;
+ }
+}
+
+
+// the highlight color for the page
+.highlight(@backgroundColor, @textColor) {
+ ::selection, -moz::selection {
+ background: @backgroundColor;
+ color: @textColor;
+ }
+}
+.highlight(hsl(207, 100%, 52%), @white);
+
+.noselect() {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
diff --git a/docs/less/styles.less b/docs/less/styles.less
new file mode 100644
index 0000000..edcc164
--- /dev/null
+++ b/docs/less/styles.less
@@ -0,0 +1,11 @@
+@import "bootstrap-includes.less";
+
+
+@import "../../less/weather-icons.less";
+@import "variables.less";
+@import "mixins.less";
+@import "cheatsheet.less";
+@import "main.less";
+
+
+
diff --git a/docs/less/variables.less b/docs/less/variables.less
new file mode 100644
index 0000000..76aaa59
--- /dev/null
+++ b/docs/less/variables.less
@@ -0,0 +1,16 @@
+// Font Stuff
+
+@copy: "Helvetica Neue", Helvetica, Arial, sans-serif;
+@white: #fff;
+@black: #000;
+@red: hsl(0, 100%, 50%);
+
+@ultraLight: 200;
+@light: 300;
+@normal: 400;
+@semibold: 500;
+@bold: 700;
+@extraBold: 800;
+@blackBold: 900;
+
+
diff --git a/less/icon-classes.less b/less/weather-icons-classes.less
similarity index 100%
rename from less/icon-classes.less
rename to less/weather-icons-classes.less
diff --git a/less/variables.less b/less/weather-icons-variables.less
similarity index 100%
rename from less/variables.less
rename to less/weather-icons-variables.less
diff --git a/less/weather-icons.less b/less/weather-icons.less
index 648ef37..76fe674 100644
--- a/less/weather-icons.less
+++ b/less/weather-icons.less
@@ -26,8 +26,8 @@
-@import "variables.less";
-@import "icon-classes.less";
+@import "weather-icons-variables.less";
+@import "weather-icons-classes.less";
// Include anything you need to make the Weather Icons styled here //
diff --git a/less/weather-icons.min.less b/less/weather-icons.min.less
index 3abcb3e..b0ddd5a 100644
--- a/less/weather-icons.min.less
+++ b/less/weather-icons.min.less
@@ -26,8 +26,8 @@
-@import "variables.less";
-@import "icon-classes.less";
+@import "weather-icons-variables.less";
+@import "weather-icons-classes.less";
// Include anything you need to make the Weather Icons styled here //