and elements
3 | // --------------------------------------------------------
4 |
5 | // Inline and block code styles
6 | code,
7 | pre {
8 | padding: 0 3px 2px;
9 | #font > #family > .monospace;
10 | font-size: @baseFontSize - 1;
11 | color: @grayDark;
12 | .border-radius(3px);
13 | }
14 |
15 | // Inline code
16 | code {
17 | padding: 3px 4px;
18 | color: #d14;
19 | background-color: #f7f7f9;
20 | border: 1px solid #e1e1e8;
21 | }
22 |
23 | // Blocks of code
24 | pre {
25 | display: block;
26 | padding: (@baseLineHeight - 1) / 2;
27 | margin: 0 0 @baseLineHeight / 2;
28 | font-size: 12px;
29 | line-height: @baseLineHeight;
30 | background-color: #f5f5f5;
31 | border: 1px solid #ccc; // fallback for IE7-8
32 | border: 1px solid rgba(0,0,0,.15);
33 | .border-radius(4px);
34 | white-space: pre;
35 | white-space: pre-wrap;
36 | word-break: break-all;
37 | word-wrap: break-word;
38 |
39 | // Make prettyprint styles more spaced out for readability
40 | &.prettyprint {
41 | margin-bottom: @baseLineHeight;
42 | }
43 |
44 | // Account for some code outputs that place code tags in pre tags
45 | code {
46 | padding: 0;
47 | color: inherit;
48 | background-color: transparent;
49 | border: 0;
50 | }
51 | }
52 |
53 | // Enable scrollable blocks of code
54 | .pre-scrollable {
55 | max-height: 340px;
56 | overflow-y: scroll;
57 | }
--------------------------------------------------------------------------------
/css/lib/alerts.less:
--------------------------------------------------------------------------------
1 | // ALERT STYLES
2 | // ------------
3 |
4 | // Base alert styles
5 | .alert {
6 | padding: 8px 35px 8px 14px;
7 | margin-bottom: @baseLineHeight;
8 | text-shadow: 0 1px 0 rgba(255,255,255,.5);
9 | background-color: @warningBackground;
10 | border: 1px solid @warningBorder;
11 | .border-radius(4px);
12 | }
13 | .alert,
14 | .alert-heading {
15 | color: @warningText;
16 | }
17 |
18 | // Adjust close link position
19 | .alert .close {
20 | position: relative;
21 | top: -2px;
22 | right: -21px;
23 | line-height: 18px;
24 | }
25 |
26 | // Alternate styles
27 | // ----------------
28 |
29 | .alert-success {
30 | background-color: @successBackground;
31 | border-color: @successBorder;
32 | }
33 | .alert-success,
34 | .alert-success .alert-heading {
35 | color: @successText;
36 | }
37 | .alert-danger,
38 | .alert-error {
39 | background-color: @errorBackground;
40 | border-color: @errorBorder;
41 | }
42 | .alert-danger,
43 | .alert-error,
44 | .alert-danger .alert-heading,
45 | .alert-error .alert-heading {
46 | color: @errorText;
47 | }
48 | .alert-info {
49 | background-color: @infoBackground;
50 | border-color: @infoBorder;
51 | }
52 | .alert-info,
53 | .alert-info .alert-heading {
54 | color: @infoText;
55 | }
56 |
57 |
58 | // Block alerts
59 | // ------------------------
60 | .alert-block {
61 | padding-top: 14px;
62 | padding-bottom: 14px;
63 | }
64 | .alert-block > p,
65 | .alert-block > ul {
66 | margin-bottom: 0;
67 | }
68 | .alert-block p + p {
69 | margin-top: 5px;
70 | }
71 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/unit/bootstrap-alert.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | module("bootstrap-alerts")
4 |
5 | test("should be defined on jquery object", function () {
6 | ok($(document.body).alert, 'alert method is defined')
7 | })
8 |
9 | test("should return element", function () {
10 | ok($(document.body).alert()[0] == document.body, 'document.body returned')
11 | })
12 |
13 | test("should fade element out on clicking .close", function () {
14 | var alertHTML = ''
15 | + '
× '
16 | + '
Holy guacamole! Best check yo self, you\'re not looking too good.
'
17 | + '
'
29 | + '
× '
30 | + '
Holy guacamole! Best check yo self, you\'re not looking too good.
'
31 | + '
'
19 |
20 | $('').appendTo("#qunit-fixture")
21 |
22 | $(tabsHTML).find('li:last a').tab('show')
23 | equals($("#qunit-fixture").find('.active').attr('id'), "profile")
24 |
25 | $(tabsHTML).find('li:first a').tab('show')
26 | equals($("#qunit-fixture").find('.active').attr('id'), "home")
27 | })
28 |
29 | test("should activate element by tab id", function () {
30 | var pillsHTML =
31 | ''
35 |
36 | $('').appendTo("#qunit-fixture")
37 |
38 | $(pillsHTML).find('li:last a').tab('show')
39 | equals($("#qunit-fixture").find('.active').attr('id'), "profile")
40 |
41 | $(pillsHTML).find('li:first a').tab('show')
42 | equals($("#qunit-fixture").find('.active').attr('id'), "home")
43 | })
44 |
45 | })
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Bootstrap Plugin Test Suite
5 |
6 |
7 |
8 |
9 |
10 |
11 |
42 |
43 |
44 |
45 |
46 |
47 |
mdo ')
15 | equals(btn.html(), 'mdo', 'btn text equals mdo')
16 | btn.button('loading')
17 | equals(btn.html(), 'fat', 'btn text equals fat')
18 | stop()
19 | setTimeout(function () {
20 | ok(btn.attr('disabled'), 'btn is disabled')
21 | ok(btn.hasClass('disabled'), 'btn has disabled class')
22 | start()
23 | }, 0)
24 | })
25 |
26 | test("should return reset state", function () {
27 | var btn = $('mdo ')
28 | equals(btn.html(), 'mdo', 'btn text equals mdo')
29 | btn.button('loading')
30 | equals(btn.html(), 'fat', 'btn text equals fat')
31 | stop()
32 | setTimeout(function () {
33 | ok(btn.attr('disabled'), 'btn is disabled')
34 | ok(btn.hasClass('disabled'), 'btn has disabled class')
35 | start()
36 | stop()
37 | }, 0)
38 | btn.button('reset')
39 | equals(btn.html(), 'mdo', 'btn text equals mdo')
40 | setTimeout(function () {
41 | ok(!btn.attr('disabled'), 'btn is not disabled')
42 | ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
43 | start()
44 | }, 0)
45 | })
46 |
47 | test("should toggle active", function () {
48 | var btn = $('mdo ')
49 | ok(!btn.hasClass('active'), 'btn does not have active class')
50 | btn.button('toggle')
51 | ok(btn.hasClass('active'), 'btn has class active')
52 | })
53 |
54 | })
--------------------------------------------------------------------------------
/css/lib/modals.less:
--------------------------------------------------------------------------------
1 | // MODALS
2 | // ------
3 |
4 | // Recalculate z-index where appropriate
5 | .modal-open {
6 | .dropdown-menu { z-index: @zindexDropdown + @zindexModal; }
7 | .dropdown.open { *z-index: @zindexDropdown + @zindexModal; }
8 | .popover { z-index: @zindexPopover + @zindexModal; }
9 | .tooltip { z-index: @zindexTooltip + @zindexModal; }
10 | }
11 |
12 | // Background
13 | .modal-backdrop {
14 | position: fixed;
15 | top: 0;
16 | right: 0;
17 | bottom: 0;
18 | left: 0;
19 | z-index: @zindexModalBackdrop;
20 | background-color: @black;
21 | // Fade for backdrop
22 | &.fade { opacity: 0; }
23 | }
24 |
25 | .modal-backdrop,
26 | .modal-backdrop.fade.in {
27 | .opacity(80);
28 | }
29 |
30 | // Base modal
31 | .modal {
32 | position: fixed;
33 | top: 50%;
34 | left: 50%;
35 | z-index: @zindexModal;
36 | max-height: 500px;
37 | overflow: auto;
38 | width: 560px;
39 | margin: -250px 0 0 -280px;
40 | background-color: @white;
41 | border: 1px solid #999;
42 | border: 1px solid rgba(0,0,0,.3);
43 | *border: 1px solid #999; /* IE6-7 */
44 | .border-radius(6px);
45 | .box-shadow(0 3px 7px rgba(0,0,0,0.3));
46 | .background-clip(padding-box);
47 | &.fade {
48 | .transition(e('opacity .3s linear, top .3s ease-out'));
49 | top: -25%;
50 | }
51 | &.fade.in { top: 50%; }
52 | }
53 | .modal-header {
54 | padding: 9px 15px;
55 | border-bottom: 1px solid #eee;
56 | // Close icon
57 | .close { margin-top: 2px; }
58 | }
59 |
60 | // Body (where all modal content resises)
61 | .modal-body {
62 | padding: 15px;
63 | }
64 | // Remove bottom margin if need be
65 | .modal-body .modal-form {
66 | margin-bottom: 0;
67 | }
68 |
69 | // Footer (for actions)
70 | .modal-footer {
71 | padding: 14px 15px 15px;
72 | margin-bottom: 0;
73 | background-color: #f5f5f5;
74 | border-top: 1px solid #ddd;
75 | .border-radius(0 0 6px 6px);
76 | .box-shadow(inset 0 1px 0 @white);
77 | .clearfix();
78 | .btn {
79 | float: right;
80 | margin-left: 5px;
81 | margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
82 | }
83 | }
84 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/unit/bootstrap-dropdown.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | module("bootstrap-dropdowns")
4 |
5 | test("should be defined on jquery object", function () {
6 | ok($(document.body).dropdown, 'dropdown method is defined')
7 | })
8 |
9 | test("should return element", function () {
10 | ok($(document.body).dropdown()[0] == document.body, 'document.body returned')
11 | })
12 |
13 | test("should add class open to menu if clicked", function () {
14 | var dropdownHTML = ''
15 | + ''
16 | + 'Dropdown '
17 | + ''
23 | + ' '
24 | + ' '
25 | , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
26 |
27 | ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
28 | })
29 |
30 | test("should remove open class if body clicked", function () {
31 | var dropdownHTML = ''
32 | + ''
33 | + 'Dropdown '
34 | + ''
40 | + ' '
41 | + ' '
42 | , dropdown = $(dropdownHTML)
43 | .appendTo('#qunit-fixture')
44 | .find('[data-toggle="dropdown"]')
45 | .dropdown()
46 | .click()
47 | ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
48 | $('body').click()
49 | ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')
50 | dropdown.remove()
51 | })
52 |
53 | })
--------------------------------------------------------------------------------
/css/lib/progress-bars.less:
--------------------------------------------------------------------------------
1 | // PROGRESS BARS
2 | // -------------
3 |
4 |
5 | // ANIMATIONS
6 | // ----------
7 |
8 | // Webkit
9 | @-webkit-keyframes progress-bar-stripes {
10 | from { background-position: 0 0; }
11 | to { background-position: 40px 0; }
12 | }
13 |
14 | // Firefox
15 | @-moz-keyframes progress-bar-stripes {
16 | from { background-position: 0 0; }
17 | to { background-position: 40px 0; }
18 | }
19 |
20 | // Spec
21 | @keyframes progress-bar-stripes {
22 | from { background-position: 0 0; }
23 | to { background-position: 40px 0; }
24 | }
25 |
26 |
27 |
28 | // THE BARS
29 | // --------
30 |
31 | // Outer container
32 | .progress {
33 | overflow: hidden;
34 | height: 18px;
35 | margin-bottom: 18px;
36 | #gradient > .vertical(#f5f5f5, #f9f9f9);
37 | .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
38 | .border-radius(4px);
39 | }
40 |
41 | // Bar of progress
42 | .progress .bar {
43 | width: 0%;
44 | height: 18px;
45 | color: @white;
46 | font-size: 12px;
47 | text-align: center;
48 | text-shadow: 0 -1px 0 rgba(0,0,0,.25);
49 | #gradient > .vertical(#149bdf, #0480be);
50 | .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
51 | .box-sizing(border-box);
52 | .transition(width .6s ease);
53 | }
54 |
55 | // Striped bars
56 | .progress-striped .bar {
57 | #gradient > .striped(#62c462);
58 | .background-size(40px 40px);
59 | }
60 |
61 | // Call animation for the active one
62 | .progress.active .bar {
63 | -webkit-animation: progress-bar-stripes 2s linear infinite;
64 | -moz-animation: progress-bar-stripes 2s linear infinite;
65 | animation: progress-bar-stripes 2s linear infinite;
66 | }
67 |
68 |
69 |
70 | // COLORS
71 | // ------
72 |
73 | // Danger (red)
74 | .progress-danger .bar {
75 | #gradient > .vertical(#ee5f5b, #c43c35);
76 | }
77 | .progress-danger.progress-striped .bar {
78 | #gradient > .striped(#ee5f5b);
79 | }
80 |
81 | // Success (green)
82 | .progress-success .bar {
83 | #gradient > .vertical(#62c462, #57a957);
84 | }
85 | .progress-success.progress-striped .bar {
86 | #gradient > .striped(#62c462);
87 | }
88 |
89 | // Info (teal)
90 | .progress-info .bar {
91 | #gradient > .vertical(#5bc0de, #339bb9);
92 | }
93 | .progress-info.progress-striped .bar {
94 | #gradient > .striped(#5bc0de);
95 | }
96 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Boilerstrap
11 |
12 |
33 |
34 |
35 |
37 |
38 |
39 |
40 |
62 |
63 |
64 |
65 |
--------------------------------------------------------------------------------
/css/lib/carousel.less:
--------------------------------------------------------------------------------
1 | // CAROUSEL
2 | // --------
3 |
4 | .carousel {
5 | position: relative;
6 | margin-bottom: @baseLineHeight;
7 | line-height: 1;
8 | }
9 |
10 | .carousel-inner {
11 | overflow: hidden;
12 | width: 100%;
13 | position: relative;
14 | }
15 |
16 | .carousel {
17 |
18 | .item {
19 | display: none;
20 | position: relative;
21 | .transition(.6s ease-in-out left);
22 | }
23 |
24 | // Account for jankitude on images
25 | .item > img {
26 | display: block;
27 | line-height: 1;
28 | }
29 |
30 | .active,
31 | .next,
32 | .prev { display: block; }
33 |
34 | .active {
35 | left: 0;
36 | }
37 |
38 | .next,
39 | .prev {
40 | position: absolute;
41 | top: 0;
42 | width: 100%;
43 | }
44 |
45 | .next {
46 | left: 100%;
47 | }
48 | .prev {
49 | left: -100%;
50 | }
51 | .next.left,
52 | .prev.right {
53 | left: 0;
54 | }
55 |
56 | .active.left {
57 | left: -100%;
58 | }
59 | .active.right {
60 | left: 100%;
61 | }
62 |
63 | }
64 |
65 | // Left/right controls for nav
66 | // ---------------------------
67 |
68 | .carousel-control {
69 | position: absolute;
70 | top: 40%;
71 | left: 15px;
72 | width: 40px;
73 | height: 40px;
74 | margin-top: -20px;
75 | font-size: 60px;
76 | font-weight: 100;
77 | line-height: 30px;
78 | color: @white;
79 | text-align: center;
80 | background: @grayDarker;
81 | border: 3px solid @white;
82 | .border-radius(23px);
83 | .opacity(50);
84 |
85 | // we can't have this transition here
86 | // because webkit cancels the carousel
87 | // animation if you trip this while
88 | // in the middle of another animation
89 | // ;_;
90 | // .transition(opacity .2s linear);
91 |
92 | // Reposition the right one
93 | &.right {
94 | left: auto;
95 | right: 15px;
96 | }
97 |
98 | // Hover state
99 | &:hover {
100 | color: @white;
101 | text-decoration: none;
102 | .opacity(90);
103 | }
104 | }
105 |
106 | // Caption for text below images
107 | // -----------------------------
108 |
109 | .carousel-caption {
110 | position: absolute;
111 | left: 0;
112 | right: 0;
113 | bottom: 0;
114 | padding: 10px 15px 5px;
115 | background: @grayDark;
116 | background: rgba(0,0,0,.75);
117 | }
118 | .carousel-caption h4,
119 | .carousel-caption p {
120 | color: @white;
121 | }
122 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/unit/bootstrap-tooltip.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | module("bootstrap-tooltip")
4 |
5 | test("should be defined on jquery object", function () {
6 | var div = $("
")
7 | ok(div.tooltip, 'popover method is defined')
8 | })
9 |
10 | test("should return element", function () {
11 | var div = $("
")
12 | ok(div.tooltip() == div, 'document.body returned')
13 | })
14 |
15 | test("should expose default settings", function () {
16 | ok(!!$.fn.tooltip.defaults, 'defaults is defined')
17 | })
18 |
19 | test("should remove title attribute", function () {
20 | var tooltip = $('
")
7 | ok(div.modal, 'modal method is defined')
8 | })
9 |
10 | test("should return element", function () {
11 | var div = $("
")
12 | ok(div.modal() == div, 'document.body returned')
13 | $('#modal-test').remove()
14 | })
15 |
16 | test("should expose defaults var for settings", function () {
17 | ok($.fn.modal.defaults, 'default object exposed')
18 | })
19 |
20 | test("should insert into dom when show method is called", function () {
21 | stop()
22 | $.support.transition = false
23 | $("
")
24 | .bind("shown", function () {
25 | ok($('#modal-test').length, 'modal insterted into dom')
26 | $(this).remove()
27 | start()
28 | })
29 | .modal("show")
30 | })
31 |
32 | test("should hide modal when hide is called", function () {
33 | stop()
34 | $.support.transition = false
35 |
36 | $("
")
37 | .bind("shown", function () {
38 | ok($('#modal-test').is(":visible"), 'modal visible')
39 | ok($('#modal-test').length, 'modal insterted into dom')
40 | $(this).modal("hide")
41 | })
42 | .bind("hidden", function() {
43 | ok(!$('#modal-test').is(":visible"), 'modal hidden')
44 | $('#modal-test').remove()
45 | start()
46 | })
47 | .modal("show")
48 | })
49 |
50 | test("should toggle when toggle is called", function () {
51 | stop()
52 | $.support.transition = false
53 | var div = $("
")
54 | div
55 | .bind("shown", function () {
56 | ok($('#modal-test').is(":visible"), 'modal visible')
57 | ok($('#modal-test').length, 'modal insterted into dom')
58 | div.modal("toggle")
59 | })
60 | .bind("hidden", function() {
61 | ok(!$('#modal-test').is(":visible"), 'modal hidden')
62 | div.remove()
63 | start()
64 | })
65 | .modal("toggle")
66 | })
67 |
68 | test("should remove from dom when click [data-dismiss=modal]", function () {
69 | stop()
70 | $.support.transition = false
71 | var div = $("
")
72 | div
73 | .bind("shown", function () {
74 | ok($('#modal-test').is(":visible"), 'modal visible')
75 | ok($('#modal-test').length, 'modal insterted into dom')
76 | div.find('.close').click()
77 | })
78 | .bind("hidden", function() {
79 | ok(!$('#modal-test').is(":visible"), 'modal hidden')
80 | div.remove()
81 | start()
82 | })
83 | .modal("toggle")
84 | })
85 | })
--------------------------------------------------------------------------------
/js/lib/bootstrap/bootstrap-popover.js:
--------------------------------------------------------------------------------
1 | /* ===========================================================
2 | * bootstrap-popover.js v2.0.1
3 | * http://twitter.github.com/bootstrap/javascript.html#popovers
4 | * ===========================================================
5 | * Copyright 2012 Twitter, Inc.
6 | *
7 | * Licensed under the Apache License, Version 2.0 (the "License");
8 | * you may not use this file except in compliance with the License.
9 | * You may obtain a copy of the License at
10 | *
11 | * http://www.apache.org/licenses/LICENSE-2.0
12 | *
13 | * Unless required by applicable law or agreed to in writing, software
14 | * distributed under the License is distributed on an "AS IS" BASIS,
15 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 | * See the License for the specific language governing permissions and
17 | * limitations under the License.
18 | * =========================================================== */
19 |
20 |
21 | !function( $ ) {
22 |
23 | "use strict"
24 |
25 | var Popover = function ( element, options ) {
26 | this.init('popover', element, options)
27 | }
28 |
29 | /* NOTE: POPOVER EXTENDS BOOTSTRAP-TOOLTIP.js
30 | ========================================== */
31 |
32 | Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, {
33 |
34 | constructor: Popover
35 |
36 | , setContent: function () {
37 | var $tip = this.tip()
38 | , title = this.getTitle()
39 | , content = this.getContent()
40 |
41 | $tip.find('.popover-title')[ $.type(title) == 'object' ? 'append' : 'html' ](title)
42 | $tip.find('.popover-content > *')[ $.type(content) == 'object' ? 'append' : 'html' ](content)
43 |
44 | $tip.removeClass('fade top bottom left right in')
45 | }
46 |
47 | , hasContent: function () {
48 | return this.getTitle() || this.getContent()
49 | }
50 |
51 | , getContent: function () {
52 | var content
53 | , $e = this.$element
54 | , o = this.options
55 |
56 | content = $e.attr('data-content')
57 | || (typeof o.content == 'function' ? o.content.call($e[0]) : o.content)
58 |
59 | content = content.toString().replace(/(^\s*|\s*$)/, "")
60 |
61 | return content
62 | }
63 |
64 | , tip: function() {
65 | if (!this.$tip) {
66 | this.$tip = $(this.options.template)
67 | }
68 | return this.$tip
69 | }
70 |
71 | })
72 |
73 |
74 | /* POPOVER PLUGIN DEFINITION
75 | * ======================= */
76 |
77 | $.fn.popover = function ( option ) {
78 | return this.each(function () {
79 | var $this = $(this)
80 | , data = $this.data('popover')
81 | , options = typeof option == 'object' && option
82 | if (!data) $this.data('popover', (data = new Popover(this, options)))
83 | if (typeof option == 'string') data[option]()
84 | })
85 | }
86 |
87 | $.fn.popover.Constructor = Popover
88 |
89 | $.fn.popover.defaults = $.extend({} , $.fn.tooltip.defaults, {
90 | placement: 'right'
91 | , content: ''
92 | , template: ''
93 | })
94 |
95 | }( window.jQuery );
--------------------------------------------------------------------------------
/css/lib/variables.less:
--------------------------------------------------------------------------------
1 | // Variables.less
2 | // Variables to customize the look and feel of Bootstrap
3 | // -----------------------------------------------------
4 |
5 |
6 |
7 | // GLOBAL VALUES
8 | // --------------------------------------------------
9 |
10 | // Links
11 | @linkColor: #08c;
12 | @linkColorHover: darken(@linkColor, 15%);
13 |
14 | // Grays
15 | @black: #000;
16 | @grayDarker: #222;
17 | @grayDark: #333;
18 | @gray: #555;
19 | @grayLight: #999;
20 | @grayLighter: #eee;
21 | @white: #fff;
22 |
23 | // Accent colors
24 | @blue: #049cdb;
25 | @blueDark: #0064cd;
26 | @green: #46a546;
27 | @red: #9d261d;
28 | @yellow: #ffc40d;
29 | @orange: #f89406;
30 | @pink: #c3325f;
31 | @purple: #7a43b6;
32 |
33 | // Typography
34 | @baseFontSize: 13px;
35 | @baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;
36 | @baseLineHeight: 18px;
37 | @textColor: @grayDark;
38 |
39 | // Buttons
40 | @primaryButtonBackground: @linkColor;
41 |
42 |
43 |
44 | // COMPONENT VARIABLES
45 | // --------------------------------------------------
46 |
47 | // Z-index master list
48 | // Used for a bird's eye view of components dependent on the z-axis
49 | // Try to avoid customizing these :)
50 | @zindexDropdown: 1000;
51 | @zindexPopover: 1010;
52 | @zindexTooltip: 1020;
53 | @zindexFixedNavbar: 1030;
54 | @zindexModalBackdrop: 1040;
55 | @zindexModal: 1050;
56 |
57 | // Sprite icons path
58 | @iconSpritePath: "../../img/glyphicons-halflings.png";
59 | @iconWhiteSpritePath: "../../img/glyphicons-halflings-white.png";
60 |
61 | // Input placeholder text color
62 | @placeholderText: @grayLight;
63 |
64 | // Hr border color
65 | @hrBorder: @grayLighter;
66 |
67 | // Navbar
68 | @navbarHeight: 40px;
69 | @navbarBackground: @grayDarker;
70 | @navbarBackgroundHighlight: @grayDark;
71 | @navbarLinkBackgroundHover: transparent;
72 |
73 | @navbarText: @grayLight;
74 | @navbarLinkColor: @grayLight;
75 | @navbarLinkColorHover: @white;
76 |
77 | // Form states and alerts
78 | @warningText: #c09853;
79 | @warningBackground: #fcf8e3;
80 | @warningBorder: darken(spin(@warningBackground, -10), 3%);
81 |
82 | @errorText: #b94a48;
83 | @errorBackground: #f2dede;
84 | @errorBorder: darken(spin(@errorBackground, -10), 3%);
85 |
86 | @successText: #468847;
87 | @successBackground: #dff0d8;
88 | @successBorder: darken(spin(@successBackground, -10), 5%);
89 |
90 | @infoText: #3a87ad;
91 | @infoBackground: #d9edf7;
92 | @infoBorder: darken(spin(@infoBackground, -10), 7%);
93 |
94 |
95 |
96 | // GRID
97 | // --------------------------------------------------
98 |
99 | // Default 940px grid
100 | @gridColumns: 12;
101 | @gridColumnWidth: 60px;
102 | @gridGutterWidth: 20px;
103 | @gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
104 |
105 | // Fluid grid
106 | @fluidGridColumnWidth: 6.382978723%;
107 | @fluidGridGutterWidth: 2.127659574%;
108 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Boilerstrap
2 | A blank slate for the modern web. Just add creativity.
3 |
4 | ## Wait, what? Why?
5 | I wanted bootstrap, but with all of the HTML5 Boilerplate tweaks, Modernizr loading, js compression, plus better coffeescript support, and control of js concatenation.
6 |
7 | I also wanted an asset organizational strcuture that better assessed the reality that nowdays we live with an uncomforatble mix of compiled and static sources files for css and javascript.
8 |
9 | Furthermore, it's nice to have support for coffeescript, less, and sass, plus easy extensibility to whatever else you want.
10 |
11 | Finally, I just wanted the peace of mind that with a single clone, I'm ready to go with a robust, clean, efficient, cross-browser, optimized, and organized blank slate.
12 |
13 | ## How to Use:
14 | * `rake watch` will build everything and watch for new changes.
15 | * Always link from `bin`, put your code in `src` (to compile) and `lib` (to leave alone)
16 | * Use subfolders folders in `src` to specify what you want to concatenate together. Create an optional file called `ORDERING` in the folder to explicitly specify the order of concatenation.
17 |
18 | ## Basic Structure & Instructions:
19 | * **Rakefile** - Run `rake` to just build and `rake watch` to build and watch
20 | * **css**
21 | * **bin** - All compiled css files end up here
22 | * **lib** - Not touched by Rakefile. You should include from src.
23 | * **src** - All raw css, or less, or sass files. They are compiled and copied one-to-one to the css/bin directory. Use Less or Sass `@include` directives to combine multiple files together. If using raw css, use subfolders to concatenate files.
24 | * *your_subfolder* - All css (ONLY) files are concatenated and put in css/bin as `subfolder.css`
25 | * **js**
26 | * **bin** - All compiled js files. Each file has a regular and minified version.
27 | * **lib** - Not touched by Rakefile. Meant for things like jQuery, or anything else you don't want compiled.
28 | * **src** - All raw javascript and/or coffeescript files go here. They are compiled and copied one-to-one to the js/bin directory. Use subfolders if you want concatenation.
29 | * **global** - All files put in here will be concatenated, compiled, and put in js/bin as `global.js` and `global.min.js`
30 | * ORDERING - A file called `ORDERING` that lists the order of concatenation. Simply list files (just the name including extensions), one per line, in the order you want.
31 | * *your_subfolder* - All files in 'your_subfolder' are concatenated, compiled, and put in js/bin as `your_subfolder.js` and `your_subfolder.min.js`
32 |
33 | ## Best Practices
34 | * Use the built-in @include directives of less and sass to include files from css/lib.
35 | * Think carefully about what you actually want to concatenate, and what you want to independently load.
36 | * All javascript (except modernizr itself) should be loaded with Modernizr.
37 | * If a couple pages (but not all) need the same javascript file, create a page-specific subfolder in the js/src/ directory for each page and sym-link to common javascript files stored in js/lib. If you need the order explicitly defined, don't forget to create an `ORDERING` file and list the files.
38 | * If all pages need the same javascript file, add it to the js/src/global directory so it concatenates into a single load from js/bin/global.js
39 |
40 | ## Dependencies
41 | * `gem install watchr` - To enable code watching
42 | * `npm install -g uglify-js` - To minify javascript
43 | * `npm install -g coffee-script` - To compile coffeescript if you use any
44 | * `npm install -g less` - To compile LESS if you use any
45 | * `gem install sass` - To compile SASS if you use any
46 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/README.md:
--------------------------------------------------------------------------------
1 | ## 2.0 BOOTSTRAP JS PHILOSOPHY
2 | These are the high-level design rules which guide the development of Bootstrap's plugin apis.
3 |
4 | ---
5 |
6 | ### DATA-ATTRIBUTE API
7 |
8 | We believe you should be able to use all plugins provided by Bootstrap purely through the markup API without writing a single line of javascript.
9 |
10 | We acknowledge that this isn't always the most performant and sometimes it may be desirable to turn this functionality off altogether. Therefore, as of 2.0 we provide the ability to disable the data attribute API by unbinding all events on the body namespaced with `'data-api'`. This looks like this:
11 |
12 | $('body').off('.data-api')
13 |
14 | To target a specific plugin, just include the plugins name as a namespace along with the data-api namespace like this:
15 |
16 | $('body').off('.alert.data-api')
17 |
18 | ---
19 |
20 | ### PROGRAMATIC API
21 |
22 | We also believe you should be able to use all plugins provided by Bootstrap purely through the JS API.
23 |
24 | All public APIs should be single, chainable methods, and return the collection acted upon.
25 |
26 | $(".btn.danger").button("toggle").addClass("fat")
27 |
28 | All methods should accept an optional options object, a string which targets a particular method, or null which initiates the default behavior:
29 |
30 | $("#myModal").modal() // initialized with defaults
31 | $("#myModal").modal({ keyboard: false }) // initialized with now keyboard
32 | $("#myModal").modal('show') // initializes and invokes show immediately afterqwe2
33 |
34 | ---
35 |
36 | ### OPTIONS
37 |
38 | Options should be sparse and add universal value. We should pick the right defaults.
39 |
40 | All plugins should have a default object which can be modified to affect all instances' default options. The defaults object should be available via `$.fn.plugin.defaults`.
41 |
42 | $.fn.modal.defaults = { … }
43 |
44 | An options definition should take the following form:
45 |
46 | *noun*: *adjective* - describes or modifies a quality of an instance
47 |
48 | examples:
49 |
50 | backdrop: true
51 | keyboard: false
52 | placement: 'top'
53 |
54 | ---
55 |
56 | ### EVENTS
57 |
58 | All events should have an infinitive and past participle form. The infinitive is fired just before an action takes place, the past participle on completion of the action.
59 |
60 | show | shown
61 | hide | hidden
62 |
63 | ---
64 |
65 | ### CONSTRUCTORS
66 |
67 | Each plugin should expose its raw constructor on a `Constructor` property -- accessed in the following way:
68 |
69 |
70 | $.fn.popover.Constructor
71 |
72 | ---
73 |
74 | ### DATA ACCESSOR
75 |
76 | Each plugin stores a copy of the invoked class on an object. This class instance can be accessed directly through jQuery's data API like this:
77 |
78 | $('[rel=popover]').data('popover') instanceof $.fn.popover.Constructor
79 |
80 | ---
81 |
82 | ### DATA ATTRIBUTES
83 |
84 | Data attributes should take the following form:
85 |
86 | - data-{{verb}}={{plugin}} - defines main interaction
87 | - data-target || href^=# - defined on "control" element (if element controls an element other than self)
88 | - data-{{noun}} - defines class instance options
89 |
90 | examples:
91 |
92 | // control other targets
93 | data-toggle="modal" data-target="#foo"
94 | data-toggle="collapse" data-target="#foo" data-parent="#bar"
95 |
96 | // defined on element they control
97 | data-spy="scroll"
98 |
99 | data-dismiss="modal"
100 | data-dismiss="alert"
101 |
102 | data-toggle="dropdown"
103 |
104 | data-toggle="button"
105 | data-toggle="buttons-checkbox"
106 | data-toggle="buttons-radio"
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/unit/bootstrap-popover.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | module("bootstrap-popover")
4 |
5 | test("should be defined on jquery object", function () {
6 | var div = $('
')
7 | ok(div.popover, 'popover method is defined')
8 | })
9 |
10 | test("should return element", function () {
11 | var div = $('
')
12 | ok(div.popover() == div, 'document.body returned')
13 | })
14 |
15 | test("should render popover element", function () {
16 | $.support.transition = false
17 | var popover = $('@mdo ')
18 | .appendTo('#qunit-fixture')
19 | .popover('show')
20 |
21 | ok($('.popover').length, 'popover was inserted')
22 | popover.popover('hide')
23 | ok(!$(".popover").length, 'popover removed')
24 | })
25 |
26 | test("should store popover instance in popover data object", function () {
27 | $.support.transition = false
28 | var popover = $('@mdo ')
29 | .popover()
30 |
31 | ok(!!popover.data('popover'), 'popover instance exists')
32 | })
33 |
34 | test("should get title and content from options", function () {
35 | $.support.transition = false
36 | var popover = $('@fat ')
37 | .appendTo('#qunit-fixture')
38 | .popover({
39 | title: function () {
40 | return '@fat'
41 | }
42 | , content: function () {
43 | return 'loves writing tests （╯°□°）╯︵ ┻━┻'
44 | }
45 | })
46 |
47 | popover.popover('show')
48 |
49 | ok($('.popover').length, 'popover was inserted')
50 | equals($('.popover .popover-title').text(), '@fat', 'title correctly inserted')
51 | equals($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
52 |
53 | popover.popover('hide')
54 | ok(!$('.popover').length, 'popover was removed')
55 | $('#qunit-fixture').empty()
56 | })
57 |
58 | test("should get title and content from attributes", function () {
59 | $.support.transition = false
60 | var popover = $('@mdo ')
61 | .appendTo('#qunit-fixture')
62 | .popover()
63 | .popover('show')
64 |
65 | ok($('.popover').length, 'popover was inserted')
66 | equals($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
67 | equals($('.popover .popover-content').text(), "loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻", 'content correctly inserted')
68 |
69 | popover.popover('hide')
70 | ok(!$('.popover').length, 'popover was removed')
71 | $('#qunit-fixture').empty()
72 | })
73 |
74 | test("should respect custom classes", function() {
75 | $.support.transition = false
76 | var popover = $('@fat ')
77 | .appendTo('#qunit-fixture')
78 | .popover({
79 | title: 'Test'
80 | , content: 'Test'
81 | , template: ''
82 | })
83 |
84 | popover.popover('show')
85 |
86 | ok($('.popover').length, 'popover was inserted')
87 | ok($('.popover').hasClass('foobar'), 'custom class is present')
88 |
89 | popover.popover('hide')
90 | ok(!$('.popover').length, 'popover was removed')
91 | $('#qunit-fixture').empty()
92 | })
93 | })
--------------------------------------------------------------------------------
/css/lib/dropdowns.less:
--------------------------------------------------------------------------------
1 | // DROPDOWN MENUS
2 | // --------------
3 |
4 | // Use the .menu class on any element within the topbar or ul.tabs and you'll get some superfancy dropdowns
5 | .dropdown {
6 | position: relative;
7 | }
8 | .dropdown-toggle {
9 | // The caret makes the toggle a bit too tall in IE7
10 | *margin-bottom: -3px;
11 | }
12 | .dropdown-toggle:active,
13 | .open .dropdown-toggle {
14 | outline: 0;
15 | }
16 | // Dropdown arrow/caret
17 | .caret {
18 | display: inline-block;
19 | width: 0;
20 | height: 0;
21 | text-indent: -99999px;
22 | // IE7 won't do the border trick if there's a text indent, but it doesn't
23 | // do the content that text-indent is hiding, either, so we're ok.
24 | *text-indent: 0;
25 | vertical-align: top;
26 | border-left: 4px solid transparent;
27 | border-right: 4px solid transparent;
28 | border-top: 4px solid @black;
29 | .opacity(30);
30 | content: "\2193";
31 | }
32 | .dropdown .caret {
33 | margin-top: 8px;
34 | margin-left: 2px;
35 | }
36 | .dropdown:hover .caret,
37 | .open.dropdown .caret {
38 | .opacity(100);
39 | }
40 | // The dropdown menu (ul)
41 | .dropdown-menu {
42 | position: absolute;
43 | top: 100%;
44 | left: 0;
45 | z-index: @zindexDropdown;
46 | float: left;
47 | display: none; // none by default, but block on "open" of the menu
48 | min-width: 160px;
49 | _width: 160px;
50 | padding: 4px 0;
51 | margin: 0; // override default ul
52 | list-style: none;
53 | background-color: @white;
54 | border-color: #ccc;
55 | border-color: rgba(0,0,0,.2);
56 | border-style: solid;
57 | border-width: 1px;
58 | .border-radius(0 0 5px 5px);
59 | .box-shadow(0 5px 10px rgba(0,0,0,.2));
60 | -webkit-background-clip: padding-box;
61 | -moz-background-clip: padding;
62 | background-clip: padding-box;
63 | *border-right-width: 2px;
64 | *border-bottom-width: 2px;
65 |
66 | // Allow for dropdowns to go bottom up (aka, dropup-menu)
67 | &.bottom-up {
68 | top: auto;
69 | bottom: 100%;
70 | margin-bottom: 2px;
71 | }
72 |
73 | // Dividers (basically an hr) within the dropdown
74 | .divider {
75 | height: 1px;
76 | margin: 5px 1px;
77 | overflow: hidden;
78 | background-color: #e5e5e5;
79 | border-bottom: 1px solid @white;
80 |
81 | // IE7 needs a set width since we gave a height. Restricting just
82 | // to IE7 to keep the 1px left/right space in other browsers.
83 | // It is unclear where IE is getting the extra space that we need
84 | // to negative-margin away, but so it goes.
85 | *width: 100%;
86 | *margin: -5px 0 5px;
87 | }
88 |
89 | // Links within the dropdown menu
90 | a {
91 | display: block;
92 | padding: 3px 15px;
93 | clear: both;
94 | font-weight: normal;
95 | line-height: @baseLineHeight;
96 | color: @gray;
97 | white-space: nowrap;
98 | }
99 | }
100 |
101 | // Hover state
102 | .dropdown-menu li > a:hover,
103 | .dropdown-menu .active > a,
104 | .dropdown-menu .active > a:hover {
105 | color: @white;
106 | text-decoration: none;
107 | background-color: @linkColor;
108 | }
109 |
110 | // Open state for the dropdown
111 | .dropdown.open {
112 | // IE7's z-index only goes to the nearest positioned ancestor, which would
113 | // make the menu appear below buttons that appeared later on the page
114 | *z-index: @zindexDropdown;
115 |
116 | .dropdown-toggle {
117 | color: @white;
118 | background: #ccc;
119 | background: rgba(0,0,0,.3);
120 | }
121 | .dropdown-menu {
122 | display: block;
123 | }
124 | }
125 |
126 | // Typeahead
127 | .typeahead {
128 | margin-top: 2px; // give it some space to breathe
129 | .border-radius(4px);
130 | }
131 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/bootstrap-tab.js:
--------------------------------------------------------------------------------
1 | /* ========================================================
2 | * bootstrap-tab.js v2.0.1
3 | * http://twitter.github.com/bootstrap/javascript.html#tabs
4 | * ========================================================
5 | * Copyright 2012 Twitter, Inc.
6 | *
7 | * Licensed under the Apache License, Version 2.0 (the "License");
8 | * you may not use this file except in compliance with the License.
9 | * You may obtain a copy of the License at
10 | *
11 | * http://www.apache.org/licenses/LICENSE-2.0
12 | *
13 | * Unless required by applicable law or agreed to in writing, software
14 | * distributed under the License is distributed on an "AS IS" BASIS,
15 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 | * See the License for the specific language governing permissions and
17 | * limitations under the License.
18 | * ======================================================== */
19 |
20 |
21 | !function( $ ){
22 |
23 | "use strict"
24 |
25 | /* TAB CLASS DEFINITION
26 | * ==================== */
27 |
28 | var Tab = function ( element ) {
29 | this.element = $(element)
30 | }
31 |
32 | Tab.prototype = {
33 |
34 | constructor: Tab
35 |
36 | , show: function () {
37 | var $this = this.element
38 | , $ul = $this.closest('ul:not(.dropdown-menu)')
39 | , selector = $this.attr('data-target')
40 | , previous
41 | , $target
42 |
43 | if (!selector) {
44 | selector = $this.attr('href')
45 | selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
46 | }
47 |
48 | if ( $this.parent('li').hasClass('active') ) return
49 |
50 | previous = $ul.find('.active a').last()[0]
51 |
52 | $this.trigger({
53 | type: 'show'
54 | , relatedTarget: previous
55 | })
56 |
57 | $target = $(selector)
58 |
59 | this.activate($this.parent('li'), $ul)
60 | this.activate($target, $target.parent(), function () {
61 | $this.trigger({
62 | type: 'shown'
63 | , relatedTarget: previous
64 | })
65 | })
66 | }
67 |
68 | , activate: function ( element, container, callback) {
69 | var $active = container.find('> .active')
70 | , transition = callback
71 | && $.support.transition
72 | && $active.hasClass('fade')
73 |
74 | function next() {
75 | $active
76 | .removeClass('active')
77 | .find('> .dropdown-menu > .active')
78 | .removeClass('active')
79 |
80 | element.addClass('active')
81 |
82 | if (transition) {
83 | element[0].offsetWidth // reflow for transition
84 | element.addClass('in')
85 | } else {
86 | element.removeClass('fade')
87 | }
88 |
89 | if ( element.parent('.dropdown-menu') ) {
90 | element.closest('li.dropdown').addClass('active')
91 | }
92 |
93 | callback && callback()
94 | }
95 |
96 | transition ?
97 | $active.one($.support.transition.end, next) :
98 | next()
99 |
100 | $active.removeClass('in')
101 | }
102 | }
103 |
104 |
105 | /* TAB PLUGIN DEFINITION
106 | * ===================== */
107 |
108 | $.fn.tab = function ( option ) {
109 | return this.each(function () {
110 | var $this = $(this)
111 | , data = $this.data('tab')
112 | if (!data) $this.data('tab', (data = new Tab(this)))
113 | if (typeof option == 'string') data[option]()
114 | })
115 | }
116 |
117 | $.fn.tab.Constructor = Tab
118 |
119 |
120 | /* TAB DATA-API
121 | * ============ */
122 |
123 | $(function () {
124 | $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
125 | e.preventDefault()
126 | $(this).tab('show')
127 | })
128 | })
129 |
130 | }( window.jQuery );
--------------------------------------------------------------------------------
/css/lib/tables.less:
--------------------------------------------------------------------------------
1 | //
2 | // Tables.less
3 | // Tables for, you guessed it, tabular data
4 | // ----------------------------------------
5 |
6 |
7 | // BASE TABLES
8 | // -----------------
9 |
10 | table {
11 | max-width: 100%;
12 | border-collapse: collapse;
13 | border-spacing: 0;
14 | }
15 |
16 | // BASELINE STYLES
17 | // ---------------
18 |
19 | .table {
20 | width: 100%;
21 | margin-bottom: @baseLineHeight;
22 | // Cells
23 | th,
24 | td {
25 | padding: 8px;
26 | line-height: @baseLineHeight;
27 | text-align: left;
28 | vertical-align: top;
29 | border-top: 1px solid #ddd;
30 | }
31 | th {
32 | font-weight: bold;
33 | }
34 | // Bottom align for column headings
35 | thead th {
36 | vertical-align: bottom;
37 | }
38 | // Remove top border from thead by default
39 | thead:first-child tr th,
40 | thead:first-child tr td {
41 | border-top: 0;
42 | }
43 | // Account for multiple tbody instances
44 | tbody + tbody {
45 | border-top: 2px solid #ddd;
46 | }
47 | }
48 |
49 |
50 |
51 | // CONDENSED TABLE W/ HALF PADDING
52 | // -------------------------------
53 |
54 | .table-condensed {
55 | th,
56 | td {
57 | padding: 4px 5px;
58 | }
59 | }
60 |
61 |
62 | // BORDERED VERSION
63 | // ----------------
64 |
65 | .table-bordered {
66 | border: 1px solid #ddd;
67 | border-collapse: separate; // Done so we can round those corners!
68 | *border-collapse: collapsed; // IE7 can't round corners anyway
69 | .border-radius(4px);
70 | th + th,
71 | td + td,
72 | th + td,
73 | td + th {
74 | border-left: 1px solid #ddd;
75 | }
76 | // Prevent a double border
77 | thead:first-child tr:first-child th,
78 | tbody:first-child tr:first-child th,
79 | tbody:first-child tr:first-child td {
80 | border-top: 0;
81 | }
82 | // For first th or td in the first row in the first thead or tbody
83 | thead:first-child tr:first-child th:first-child,
84 | tbody:first-child tr:first-child td:first-child {
85 | .border-radius(4px 0 0 0);
86 | }
87 | thead:first-child tr:first-child th:last-child,
88 | tbody:first-child tr:first-child td:last-child {
89 | .border-radius(0 4px 0 0);
90 | }
91 | // For first th or td in the first row in the first thead or tbody
92 | thead:last-child tr:last-child th:first-child,
93 | tbody:last-child tr:last-child td:first-child {
94 | .border-radius(0 0 0 4px);
95 | }
96 | thead:last-child tr:last-child th:last-child,
97 | tbody:last-child tr:last-child td:last-child {
98 | .border-radius(0 0 4px 0);
99 | }
100 | }
101 |
102 |
103 | // ZEBRA-STRIPING
104 | // --------------
105 |
106 | // Default zebra-stripe styles (alternating gray and transparent backgrounds)
107 | .table-striped {
108 | tbody {
109 | tr:nth-child(odd) td,
110 | tr:nth-child(odd) th {
111 | background-color: #f9f9f9;
112 | }
113 | }
114 | }
115 |
116 |
117 | // HOVER EFFECT
118 | // ------------
119 | // Placed here since it has to come after the potential zebra striping
120 | .table {
121 | tbody tr:hover td,
122 | tbody tr:hover th {
123 | background-color: #f5f5f5;
124 | }
125 | }
126 |
127 |
128 | // TABLE CELL SIZING
129 | // -----------------
130 |
131 | // Change the columns
132 | .tableColumns(@columnSpan: 1) {
133 | float: none;
134 | width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16;
135 | margin-left: 0;
136 | }
137 | table {
138 | .span1 { .tableColumns(1); }
139 | .span2 { .tableColumns(2); }
140 | .span3 { .tableColumns(3); }
141 | .span4 { .tableColumns(4); }
142 | .span5 { .tableColumns(5); }
143 | .span6 { .tableColumns(6); }
144 | .span7 { .tableColumns(7); }
145 | .span8 { .tableColumns(8); }
146 | .span9 { .tableColumns(9); }
147 | .span10 { .tableColumns(10); }
148 | .span11 { .tableColumns(11); }
149 | .span12 { .tableColumns(12); }
150 | }
151 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/bootstrap-scrollspy.js:
--------------------------------------------------------------------------------
1 | /* =============================================================
2 | * bootstrap-scrollspy.js v2.0.1
3 | * http://twitter.github.com/bootstrap/javascript.html#scrollspy
4 | * =============================================================
5 | * Copyright 2012 Twitter, Inc.
6 | *
7 | * Licensed under the Apache License, Version 2.0 (the "License");
8 | * you may not use this file except in compliance with the License.
9 | * You may obtain a copy of the License at
10 | *
11 | * http://www.apache.org/licenses/LICENSE-2.0
12 | *
13 | * Unless required by applicable law or agreed to in writing, software
14 | * distributed under the License is distributed on an "AS IS" BASIS,
15 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 | * See the License for the specific language governing permissions and
17 | * limitations under the License.
18 | * ============================================================== */
19 |
20 | !function ( $ ) {
21 |
22 | "use strict"
23 |
24 | /* SCROLLSPY CLASS DEFINITION
25 | * ========================== */
26 |
27 | function ScrollSpy( element, options) {
28 | var process = $.proxy(this.process, this)
29 | , $element = $(element).is('body') ? $(window) : $(element)
30 | , href
31 | this.options = $.extend({}, $.fn.scrollspy.defaults, options)
32 | this.$scrollElement = $element.on('scroll.scroll.data-api', process)
33 | this.selector = (this.options.target
34 | || ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
35 | || '') + ' .nav li > a'
36 | this.$body = $('body').on('click.scroll.data-api', this.selector, process)
37 | this.refresh()
38 | this.process()
39 | }
40 |
41 | ScrollSpy.prototype = {
42 |
43 | constructor: ScrollSpy
44 |
45 | , refresh: function () {
46 | this.targets = this.$body
47 | .find(this.selector)
48 | .map(function () {
49 | var href = $(this).attr('href')
50 | return /^#\w/.test(href) && $(href).length ? href : null
51 | })
52 |
53 | this.offsets = $.map(this.targets, function (id) {
54 | return $(id).position().top
55 | })
56 | }
57 |
58 | , process: function () {
59 | var scrollTop = this.$scrollElement.scrollTop() + this.options.offset
60 | , offsets = this.offsets
61 | , targets = this.targets
62 | , activeTarget = this.activeTarget
63 | , i
64 |
65 | for (i = offsets.length; i--;) {
66 | activeTarget != targets[i]
67 | && scrollTop >= offsets[i]
68 | && (!offsets[i + 1] || scrollTop <= offsets[i + 1])
69 | && this.activate( targets[i] )
70 | }
71 | }
72 |
73 | , activate: function (target) {
74 | var active
75 |
76 | this.activeTarget = target
77 |
78 | this.$body
79 | .find(this.selector).parent('.active')
80 | .removeClass('active')
81 |
82 | active = this.$body
83 | .find(this.selector + '[href="' + target + '"]')
84 | .parent('li')
85 | .addClass('active')
86 |
87 | if ( active.parent('.dropdown-menu') ) {
88 | active.closest('li.dropdown').addClass('active')
89 | }
90 | }
91 |
92 | }
93 |
94 |
95 | /* SCROLLSPY PLUGIN DEFINITION
96 | * =========================== */
97 |
98 | $.fn.scrollspy = function ( option ) {
99 | return this.each(function () {
100 | var $this = $(this)
101 | , data = $this.data('scrollspy')
102 | , options = typeof option == 'object' && option
103 | if (!data) $this.data('scrollspy', (data = new ScrollSpy(this, options)))
104 | if (typeof option == 'string') data[option]()
105 | })
106 | }
107 |
108 | $.fn.scrollspy.Constructor = ScrollSpy
109 |
110 | $.fn.scrollspy.defaults = {
111 | offset: 10
112 | }
113 |
114 |
115 | /* SCROLLSPY DATA-API
116 | * ================== */
117 |
118 | $(function () {
119 | $('[data-spy="scroll"]').each(function () {
120 | var $spy = $(this)
121 | $spy.scrollspy($spy.data())
122 | })
123 | })
124 |
125 | }( window.jQuery );
--------------------------------------------------------------------------------
/css/lib/button-groups.less:
--------------------------------------------------------------------------------
1 | // BUTTON GROUPS
2 | // -------------
3 |
4 |
5 | // Make the div behave like a button
6 | .btn-group {
7 | position: relative;
8 | .clearfix(); // clears the floated buttons
9 | .ie7-restore-left-whitespace();
10 | }
11 |
12 | // Space out series of button groups
13 | .btn-group + .btn-group {
14 | margin-left: 5px;
15 | }
16 |
17 | // Optional: Group multiple button groups together for a toolbar
18 | .btn-toolbar {
19 | margin-top: @baseLineHeight / 2;
20 | margin-bottom: @baseLineHeight / 2;
21 | .btn-group {
22 | display: inline-block;
23 | .ie7-inline-block();
24 | }
25 | }
26 |
27 | // Float them, remove border radius, then re-add to first and last elements
28 | .btn-group .btn {
29 | position: relative;
30 | float: left;
31 | margin-left: -1px;
32 | .border-radius(0);
33 | }
34 | // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
35 | .btn-group .btn:first-child {
36 | margin-left: 0;
37 | -webkit-border-top-left-radius: 4px;
38 | -moz-border-radius-topleft: 4px;
39 | border-top-left-radius: 4px;
40 | -webkit-border-bottom-left-radius: 4px;
41 | -moz-border-radius-bottomleft: 4px;
42 | border-bottom-left-radius: 4px;
43 | }
44 | .btn-group .btn:last-child,
45 | .btn-group .dropdown-toggle {
46 | -webkit-border-top-right-radius: 4px;
47 | -moz-border-radius-topright: 4px;
48 | border-top-right-radius: 4px;
49 | -webkit-border-bottom-right-radius: 4px;
50 | -moz-border-radius-bottomright: 4px;
51 | border-bottom-right-radius: 4px;
52 | }
53 | // Reset corners for large buttons
54 | .btn-group .btn.large:first-child {
55 | margin-left: 0;
56 | -webkit-border-top-left-radius: 6px;
57 | -moz-border-radius-topleft: 6px;
58 | border-top-left-radius: 6px;
59 | -webkit-border-bottom-left-radius: 6px;
60 | -moz-border-radius-bottomleft: 6px;
61 | border-bottom-left-radius: 6px;
62 | }
63 | .btn-group .btn.large:last-child,
64 | .btn-group .large.dropdown-toggle {
65 | -webkit-border-top-right-radius: 6px;
66 | -moz-border-radius-topright: 6px;
67 | border-top-right-radius: 6px;
68 | -webkit-border-bottom-right-radius: 6px;
69 | -moz-border-radius-bottomright: 6px;
70 | border-bottom-right-radius: 6px;
71 | }
72 |
73 | // On hover/focus/active, bring the proper btn to front
74 | .btn-group .btn:hover,
75 | .btn-group .btn:focus,
76 | .btn-group .btn:active,
77 | .btn-group .btn.active {
78 | z-index: 2;
79 | }
80 |
81 | // On active and open, don't show outline
82 | .btn-group .dropdown-toggle:active,
83 | .btn-group.open .dropdown-toggle {
84 | outline: 0;
85 | }
86 |
87 |
88 |
89 | // Split button dropdowns
90 | // ----------------------
91 |
92 | // Give the line between buttons some depth
93 | .btn-group .dropdown-toggle {
94 | padding-left: 8px;
95 | padding-right: 8px;
96 | @shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
97 | .box-shadow(@shadow);
98 | *padding-top: 5px;
99 | *padding-bottom: 5px;
100 | }
101 |
102 | .btn-group.open {
103 | // IE7's z-index only goes to the nearest positioned ancestor, which would
104 | // make the menu appear below buttons that appeared later on the page
105 | *z-index: @zindexDropdown;
106 |
107 | // Reposition menu on open and round all corners
108 | .dropdown-menu {
109 | display: block;
110 | margin-top: 1px;
111 | .border-radius(5px);
112 | }
113 |
114 | .dropdown-toggle {
115 | background-image: none;
116 | @shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
117 | .box-shadow(@shadow);
118 | }
119 | }
120 |
121 | // Reposition the caret
122 | .btn .caret {
123 | margin-top: 7px;
124 | margin-left: 0;
125 | }
126 | .btn:hover .caret,
127 | .open.btn-group .caret {
128 | .opacity(100);
129 | }
130 |
131 |
132 | // Account for other colors
133 | .btn-primary,
134 | .btn-danger,
135 | .btn-info,
136 | .btn-success,
137 | .btn-inverse {
138 | .caret {
139 | border-top-color: @white;
140 | .opacity(75);
141 | }
142 | }
143 |
144 | // Small button dropdowns
145 | .btn-small .caret {
146 | margin-top: 4px;
147 | }
148 |
149 |
--------------------------------------------------------------------------------
/css/lib/type.less:
--------------------------------------------------------------------------------
1 | // Typography.less
2 | // Headings, body text, lists, code, and more for a versatile and durable typography system
3 | // ----------------------------------------------------------------------------------------
4 |
5 |
6 | // BODY TEXT
7 | // ---------
8 |
9 | p {
10 | margin: 0 0 @baseLineHeight / 2;
11 | font-family: @baseFontFamily;
12 | font-size: @baseFontSize;
13 | line-height: @baseLineHeight;
14 | small {
15 | font-size: @baseFontSize - 2;
16 | color: @grayLight;
17 | }
18 | }
19 | .lead {
20 | margin-bottom: @baseLineHeight;
21 | font-size: 20px;
22 | font-weight: 200;
23 | line-height: @baseLineHeight * 1.5;
24 | }
25 |
26 | // HEADINGS
27 | // --------
28 |
29 | h1, h2, h3, h4, h5, h6 {
30 | margin: 0;
31 | font-weight: bold;
32 | color: @grayDark;
33 | text-rendering: optimizelegibility; // Fix the character spacing for headings
34 | small {
35 | font-weight: normal;
36 | color: @grayLight;
37 | }
38 | }
39 | h1 {
40 | font-size: 30px;
41 | line-height: @baseLineHeight * 2;
42 | small {
43 | font-size: 18px;
44 | }
45 | }
46 | h2 {
47 | font-size: 24px;
48 | line-height: @baseLineHeight * 2;
49 | small {
50 | font-size: 18px;
51 | }
52 | }
53 | h3 {
54 | line-height: @baseLineHeight * 1.5;
55 | font-size: 18px;
56 | small {
57 | font-size: 14px;
58 | }
59 | }
60 | h4, h5, h6 {
61 | line-height: @baseLineHeight;
62 | }
63 | h4 {
64 | font-size: 14px;
65 | small {
66 | font-size: 12px;
67 | }
68 | }
69 | h5 {
70 | font-size: 12px;
71 | }
72 | h6 {
73 | font-size: 11px;
74 | color: @grayLight;
75 | text-transform: uppercase;
76 | }
77 |
78 | // Page header
79 | .page-header {
80 | padding-bottom: @baseLineHeight - 1;
81 | margin: @baseLineHeight 0;
82 | border-bottom: 1px solid @grayLighter;
83 | }
84 | .page-header h1 {
85 | line-height: 1;
86 | }
87 |
88 |
89 |
90 | // LISTS
91 | // -----
92 |
93 | // Unordered and Ordered lists
94 | ul, ol {
95 | padding: 0;
96 | margin: 0 0 @baseLineHeight / 2 25px;
97 | }
98 | ul ul,
99 | ul ol,
100 | ol ol,
101 | ol ul {
102 | margin-bottom: 0;
103 | }
104 | ul {
105 | list-style: disc;
106 | }
107 | ol {
108 | list-style: decimal;
109 | }
110 | li {
111 | line-height: @baseLineHeight;
112 | }
113 | ul.unstyled,
114 | ol.unstyled {
115 | margin-left: 0;
116 | list-style: none;
117 | }
118 |
119 | // Description Lists
120 | dl {
121 | margin-bottom: @baseLineHeight;
122 | }
123 | dt,
124 | dd {
125 | line-height: @baseLineHeight;
126 | }
127 | dt {
128 | font-weight: bold;
129 | }
130 | dd {
131 | margin-left: @baseLineHeight / 2;
132 | }
133 |
134 | // MISC
135 | // ----
136 |
137 | // Horizontal rules
138 | hr {
139 | margin: @baseLineHeight 0;
140 | border: 0;
141 | border-top: 1px solid @hrBorder;
142 | border-bottom: 1px solid @white;
143 | }
144 |
145 | // Emphasis
146 | strong {
147 | font-weight: bold;
148 | }
149 | em {
150 | font-style: italic;
151 | }
152 | .muted {
153 | color: @grayLight;
154 | }
155 |
156 | // Abbreviations and acronyms
157 | abbr {
158 | font-size: 90%;
159 | text-transform: uppercase;
160 | border-bottom: 1px dotted #ddd;
161 | cursor: help;
162 | }
163 |
164 | // Blockquotes
165 | blockquote {
166 | padding: 0 0 0 15px;
167 | margin: 0 0 @baseLineHeight;
168 | border-left: 5px solid @grayLighter;
169 | p {
170 | margin-bottom: 0;
171 | #font > .shorthand(16px,300,@baseLineHeight * 1.25);
172 | }
173 | small {
174 | display: block;
175 | line-height: @baseLineHeight;
176 | color: @grayLight;
177 | &:before {
178 | content: '\2014 \00A0';
179 | }
180 | }
181 |
182 | // Float right with text-align: right
183 | &.pull-right {
184 | float: right;
185 | padding-left: 0;
186 | padding-right: 15px;
187 | border-left: 0;
188 | border-right: 5px solid @grayLighter;
189 | p,
190 | small {
191 | text-align: right;
192 | }
193 | }
194 | }
195 |
196 | // Quotes
197 | q:before,
198 | q:after,
199 | blockquote:before,
200 | blockquote:after {
201 | content: "";
202 | }
203 |
204 | // Addresses
205 | address {
206 | display: block;
207 | margin-bottom: @baseLineHeight;
208 | line-height: @baseLineHeight;
209 | font-style: normal;
210 | }
211 |
212 | // Misc
213 | small {
214 | font-size: 100%;
215 | }
216 | cite {
217 | font-style: normal;
218 | }
219 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/bootstrap-collapse.js:
--------------------------------------------------------------------------------
1 | /* =============================================================
2 | * bootstrap-collapse.js v2.0.1
3 | * http://twitter.github.com/bootstrap/javascript.html#collapse
4 | * =============================================================
5 | * Copyright 2012 Twitter, Inc.
6 | *
7 | * Licensed under the Apache License, Version 2.0 (the "License");
8 | * you may not use this file except in compliance with the License.
9 | * You may obtain a copy of the License at
10 | *
11 | * http://www.apache.org/licenses/LICENSE-2.0
12 | *
13 | * Unless required by applicable law or agreed to in writing, software
14 | * distributed under the License is distributed on an "AS IS" BASIS,
15 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 | * See the License for the specific language governing permissions and
17 | * limitations under the License.
18 | * ============================================================ */
19 |
20 | !function( $ ){
21 |
22 | "use strict"
23 |
24 | var Collapse = function ( element, options ) {
25 | this.$element = $(element)
26 | this.options = $.extend({}, $.fn.collapse.defaults, options)
27 |
28 | if (this.options["parent"]) {
29 | this.$parent = $(this.options["parent"])
30 | }
31 |
32 | this.options.toggle && this.toggle()
33 | }
34 |
35 | Collapse.prototype = {
36 |
37 | constructor: Collapse
38 |
39 | , dimension: function () {
40 | var hasWidth = this.$element.hasClass('width')
41 | return hasWidth ? 'width' : 'height'
42 | }
43 |
44 | , show: function () {
45 | var dimension = this.dimension()
46 | , scroll = $.camelCase(['scroll', dimension].join('-'))
47 | , actives = this.$parent && this.$parent.find('.in')
48 | , hasData
49 |
50 | if (actives && actives.length) {
51 | hasData = actives.data('collapse')
52 | actives.collapse('hide')
53 | hasData || actives.data('collapse', null)
54 | }
55 |
56 | this.$element[dimension](0)
57 | this.transition('addClass', 'show', 'shown')
58 | this.$element[dimension](this.$element[0][scroll])
59 |
60 | }
61 |
62 | , hide: function () {
63 | var dimension = this.dimension()
64 | this.reset(this.$element[dimension]())
65 | this.transition('removeClass', 'hide', 'hidden')
66 | this.$element[dimension](0)
67 | }
68 |
69 | , reset: function ( size ) {
70 | var dimension = this.dimension()
71 |
72 | this.$element
73 | .removeClass('collapse')
74 | [dimension](size || 'auto')
75 | [0].offsetWidth
76 |
77 | this.$element.addClass('collapse')
78 | }
79 |
80 | , transition: function ( method, startEvent, completeEvent ) {
81 | var that = this
82 | , complete = function () {
83 | if (startEvent == 'show') that.reset()
84 | that.$element.trigger(completeEvent)
85 | }
86 |
87 | this.$element
88 | .trigger(startEvent)
89 | [method]('in')
90 |
91 | $.support.transition && this.$element.hasClass('collapse') ?
92 | this.$element.one($.support.transition.end, complete) :
93 | complete()
94 | }
95 |
96 | , toggle: function () {
97 | this[this.$element.hasClass('in') ? 'hide' : 'show']()
98 | }
99 |
100 | }
101 |
102 | /* COLLAPSIBLE PLUGIN DEFINITION
103 | * ============================== */
104 |
105 | $.fn.collapse = function ( option ) {
106 | return this.each(function () {
107 | var $this = $(this)
108 | , data = $this.data('collapse')
109 | , options = typeof option == 'object' && option
110 | if (!data) $this.data('collapse', (data = new Collapse(this, options)))
111 | if (typeof option == 'string') data[option]()
112 | })
113 | }
114 |
115 | $.fn.collapse.defaults = {
116 | toggle: true
117 | }
118 |
119 | $.fn.collapse.Constructor = Collapse
120 |
121 |
122 | /* COLLAPSIBLE DATA-API
123 | * ==================== */
124 |
125 | $(function () {
126 | $('body').on('click.collapse.data-api', '[data-toggle=collapse]', function ( e ) {
127 | var $this = $(this), href
128 | , target = $this.attr('data-target')
129 | || e.preventDefault()
130 | || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
131 | , option = $(target).data('collapse') ? 'toggle' : $this.data()
132 | $(target).collapse(option)
133 | })
134 | })
135 |
136 | }( window.jQuery );
--------------------------------------------------------------------------------
/css/lib/buttons.less:
--------------------------------------------------------------------------------
1 | // BUTTON STYLES
2 | // -------------
3 |
4 |
5 | // Base styles
6 | // --------------------------------------------------
7 |
8 | // Core
9 | .btn {
10 | display: inline-block;
11 | padding: 4px 10px 4px;
12 | margin-bottom: 0; // For input.btn
13 | font-size: @baseFontSize;
14 | line-height: @baseLineHeight;
15 | color: @grayDark;
16 | text-align: center;
17 | text-shadow: 0 1px 1px rgba(255,255,255,.75);
18 | vertical-align: middle;
19 | .buttonBackground(@white, darken(@white, 10%));
20 | border: 1px solid #ccc;
21 | border-bottom-color: #bbb;
22 | .border-radius(4px);
23 | @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
24 | .box-shadow(@shadow);
25 | cursor: pointer;
26 |
27 | // Give IE7 some love
28 | .reset-filter();
29 | .ie7-restore-left-whitespace();
30 | }
31 |
32 | // Hover state
33 | .btn:hover {
34 | color: @grayDark;
35 | text-decoration: none;
36 | background-color: darken(@white, 10%);
37 | background-position: 0 -15px;
38 |
39 | // transition is only when going to hover, otherwise the background
40 | // behind the gradient (there for IE<=9 fallback) gets mismatched
41 | .transition(background-position .1s linear);
42 | }
43 |
44 | // Focus state for keyboard and accessibility
45 | .btn:focus {
46 | .tab-focus();
47 | }
48 |
49 | // Active state
50 | .btn.active,
51 | .btn:active {
52 | background-image: none;
53 | @shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
54 | .box-shadow(@shadow);
55 | background-color: darken(@white, 10%);
56 | background-color: darken(@white, 15%) e("\9");
57 | outline: 0;
58 | }
59 |
60 | // Disabled state
61 | .btn.disabled,
62 | .btn[disabled] {
63 | cursor: default;
64 | background-image: none;
65 | background-color: darken(@white, 10%);
66 | .opacity(65);
67 | .box-shadow(none);
68 | }
69 |
70 |
71 | // Button Sizes
72 | // --------------------------------------------------
73 |
74 | // Large
75 | .btn-large {
76 | padding: 9px 14px;
77 | font-size: @baseFontSize + 2px;
78 | line-height: normal;
79 | .border-radius(5px);
80 | }
81 | .btn-large [class^="icon-"] {
82 | margin-top: 1px;
83 | }
84 |
85 | // Small
86 | .btn-small {
87 | padding: 5px 9px;
88 | font-size: @baseFontSize - 2px;
89 | line-height: @baseLineHeight - 2px;
90 | }
91 | .btn-small [class^="icon-"] {
92 | margin-top: -1px;
93 | }
94 |
95 | // Mini
96 | .btn-mini {
97 | padding: 2px 6px;
98 | font-size: @baseFontSize - 2px;
99 | line-height: @baseLineHeight - 4px;
100 | }
101 |
102 |
103 | // Alternate buttons
104 | // --------------------------------------------------
105 |
106 | // Set text color
107 | // -------------------------
108 | .btn-primary,
109 | .btn-primary:hover,
110 | .btn-warning,
111 | .btn-warning:hover,
112 | .btn-danger,
113 | .btn-danger:hover,
114 | .btn-success,
115 | .btn-success:hover,
116 | .btn-info,
117 | .btn-info:hover,
118 | .btn-inverse,
119 | .btn-inverse:hover {
120 | text-shadow: 0 -1px 0 rgba(0,0,0,.25);
121 | color: @white;
122 | }
123 | // Provide *some* extra contrast for those who can get it
124 | .btn-primary.active,
125 | .btn-warning.active,
126 | .btn-danger.active,
127 | .btn-success.active,
128 | .btn-info.active,
129 | .btn-dark.active {
130 | color: rgba(255,255,255,.75);
131 | }
132 |
133 | // Set the backgrounds
134 | // -------------------------
135 | .btn-primary {
136 | .buttonBackground(@primaryButtonBackground, spin(@primaryButtonBackground, 20));
137 | }
138 | // Warning appears are orange
139 | .btn-warning {
140 | .buttonBackground(lighten(@orange, 15%), @orange);
141 | }
142 | // Danger and error appear as red
143 | .btn-danger {
144 | .buttonBackground(#ee5f5b, #bd362f);
145 | }
146 | // Success appears as green
147 | .btn-success {
148 | .buttonBackground(#62c462, #51a351);
149 | }
150 | // Info appears as a neutral blue
151 | .btn-info {
152 | .buttonBackground(#5bc0de, #2f96b4);
153 | }
154 | // Inverse appears as dark gray
155 | .btn-inverse {
156 | .buttonBackground(#454545, #262626);
157 | }
158 |
159 |
160 | // Cross-browser Jank
161 | // --------------------------------------------------
162 |
163 | button.btn,
164 | input[type="submit"].btn {
165 |
166 | // Firefox 3.6 only I believe
167 | &::-moz-focus-inner {
168 | padding: 0;
169 | border: 0;
170 | }
171 |
172 | // IE7 has some default padding on button controls
173 | *padding-top: 2px;
174 | *padding-bottom: 2px;
175 | &.large {
176 | *padding-top: 7px;
177 | *padding-bottom: 7px;
178 | }
179 | &.small {
180 | *padding-top: 3px;
181 | *padding-bottom: 3px;
182 | }
183 | }
184 |
--------------------------------------------------------------------------------
/js/lib/bootstrap/tests/unit/bootstrap-typeahead.js:
--------------------------------------------------------------------------------
1 | $(function () {
2 |
3 | module("bootstrap-typeahead")
4 |
5 | test("should be defined on jquery object", function () {
6 | ok($(document.body).typeahead, 'alert method is defined')
7 | })
8 |
9 | test("should return element", function () {
10 | ok($(document.body).typeahead()[0] == document.body, 'document.body returned')
11 | })
12 |
13 | test("should listen to an input", function () {
14 | var $input = $('
')
130 | .appendTo(document.body)
131 |
132 | if (this.options.backdrop != 'static') {
133 | this.$backdrop.click($.proxy(this.hide, this))
134 | }
135 |
136 | if (doAnimate) this.$backdrop[0].offsetWidth // force reflow
137 |
138 | this.$backdrop.addClass('in')
139 |
140 | doAnimate ?
141 | this.$backdrop.one($.support.transition.end, callback) :
142 | callback()
143 |
144 | } else if (!this.isShown && this.$backdrop) {
145 | this.$backdrop.removeClass('in')
146 |
147 | $.support.transition && this.$element.hasClass('fade')?
148 | this.$backdrop.one($.support.transition.end, $.proxy(removeBackdrop, this)) :
149 | removeBackdrop.call(this)
150 |
151 | } else if (callback) {
152 | callback()
153 | }
154 | }
155 |
156 | function removeBackdrop() {
157 | this.$backdrop.remove()
158 | this.$backdrop = null
159 | }
160 |
161 | function escape() {
162 | var that = this
163 | if (this.isShown && this.options.keyboard) {
164 | $(document).on('keyup.dismiss.modal', function ( e ) {
165 | e.which == 27 && that.hide()
166 | })
167 | } else if (!this.isShown) {
168 | $(document).off('keyup.dismiss.modal')
169 | }
170 | }
171 |
172 |
173 | /* MODAL PLUGIN DEFINITION
174 | * ======================= */
175 |
176 | $.fn.modal = function ( option ) {
177 | return this.each(function () {
178 | var $this = $(this)
179 | , data = $this.data('modal')
180 | , options = $.extend({}, $.fn.modal.defaults, $this.data(), typeof option == 'object' && option)
181 | if (!data) $this.data('modal', (data = new Modal(this, options)))
182 | if (typeof option == 'string') data[option]()
183 | else if (options.show) data.show()
184 | })
185 | }
186 |
187 | $.fn.modal.defaults = {
188 | backdrop: true
189 | , keyboard: true
190 | , show: true
191 | }
192 |
193 | $.fn.modal.Constructor = Modal
194 |
195 |
196 | /* MODAL DATA-API
197 | * ============== */
198 |
199 | $(function () {
200 | $('body').on('click.modal.data-api', '[data-toggle="modal"]', function ( e ) {
201 | var $this = $(this), href
202 | , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
203 | , option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data())
204 |
205 | e.preventDefault()
206 | $target.modal(option)
207 | })
208 | })
209 |
210 | }( window.jQuery );
--------------------------------------------------------------------------------
/css/lib/navbar.less:
--------------------------------------------------------------------------------
1 | // NAVBAR (FIXED AND STATIC)
2 | // -------------------------
3 |
4 |
5 | // COMMON STYLES
6 | // -------------
7 |
8 | .navbar {
9 | overflow: visible;
10 | margin-bottom: @baseLineHeight;
11 | }
12 |
13 | // Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
14 | .navbar-inner {
15 | padding-left: 20px;
16 | padding-right: 20px;
17 | #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
18 | .border-radius(4px);
19 | @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
20 | .box-shadow(@shadow);
21 | }
22 |
23 | // Navbar button for toggling navbar items in responsive layouts
24 | .btn-navbar {
25 | display: none;
26 | float: right;
27 | padding: 7px 10px;
28 | margin-left: 5px;
29 | margin-right: 5px;
30 | .buttonBackground(@navbarBackgroundHighlight, @navbarBackground);
31 | @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
32 | .box-shadow(@shadow);
33 | }
34 | .btn-navbar .icon-bar {
35 | display: block;
36 | width: 18px;
37 | height: 2px;
38 | background-color: #f5f5f5;
39 | .border-radius(1px);
40 | .box-shadow(0 1px 0 rgba(0,0,0,.25));
41 | }
42 | .btn-navbar .icon-bar + .icon-bar {
43 | margin-top: 3px;
44 | }
45 | // Override the default collapsed state
46 | .nav-collapse.collapse {
47 | height: auto;
48 | }
49 |
50 |
51 | // Brand, links, text, and buttons
52 | .navbar {
53 | // Hover and active states
54 | .brand:hover {
55 | text-decoration: none;
56 | }
57 | // Website or project name
58 | .brand {
59 | float: left;
60 | display: block;
61 | padding: 8px 20px 12px;
62 | margin-left: -20px; // negative indent to left-align the text down the page
63 | font-size: 20px;
64 | font-weight: 200;
65 | line-height: 1;
66 | color: @white;
67 | }
68 | // Plain text in topbar
69 | .navbar-text {
70 | margin-bottom: 0;
71 | line-height: 40px;
72 | color: @navbarText;
73 | a:hover {
74 | color: @white;
75 | background-color: transparent;
76 | }
77 | }
78 | // Buttons in navbar
79 | .btn,
80 | .btn-group {
81 | margin-top: 5px; // make buttons vertically centered in navbar
82 | }
83 | .btn-group .btn {
84 | margin-top: 0; // then undo the margin here so we don't accidentally double it
85 | }
86 | }
87 |
88 | // Navbar forms
89 | .navbar-form {
90 | margin-bottom: 0; // remove default bottom margin
91 | .clearfix();
92 | input,
93 | select {
94 | display: inline-block;
95 | margin-top: 5px;
96 | margin-bottom: 0;
97 | }
98 | .radio,
99 | .checkbox {
100 | margin-top: 5px;
101 | }
102 | input[type="image"],
103 | input[type="checkbox"],
104 | input[type="radio"] {
105 | margin-top: 3px;
106 | }
107 | .input-append,
108 | .input-prepend {
109 | margin-top: 6px;
110 | white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left
111 | input {
112 | margin-top: 0; // remove the margin on top since it's on the parent
113 | }
114 | }
115 | }
116 |
117 | // Navbar search
118 | .navbar-search {
119 | position: relative;
120 | float: left;
121 | margin-top: 6px;
122 | margin-bottom: 0;
123 | .search-query {
124 | padding: 4px 9px;
125 | #font > .sans-serif(13px, normal, 1);
126 | color: @white;
127 | color: rgba(255,255,255,.75);
128 | background: #666;
129 | background: rgba(255,255,255,.3);
130 | border: 1px solid #111;
131 | @shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.15);
132 | .box-shadow(@shadow);
133 | .transition(none);
134 |
135 | // Placeholder text gets special styles; can't be bundled together though for some reason
136 | .placeholder(@grayLighter);
137 |
138 | // Hover states
139 | &:hover {
140 | color: @white;
141 | background-color: @grayLight;
142 | background-color: rgba(255,255,255,.5);
143 | }
144 | // Focus states (we use .focused since IE7-8 and down doesn't support :focus)
145 | &:focus,
146 | &.focused {
147 | padding: 5px 10px;
148 | color: @grayDark;
149 | text-shadow: 0 1px 0 @white;
150 | background-color: @white;
151 | border: 0;
152 | .box-shadow(0 0 3px rgba(0,0,0,.15));
153 | outline: 0;
154 | }
155 | }
156 | }
157 |
158 |
159 | // FIXED NAVBAR
160 | // ------------
161 |
162 | .navbar-fixed-top {
163 | position: fixed;
164 | top: 0;
165 | right: 0;
166 | left: 0;
167 | z-index: @zindexFixedNavbar;
168 | }
169 | .navbar-fixed-top .navbar-inner {
170 | padding-left: 0;
171 | padding-right: 0;
172 | .border-radius(0);
173 | }
174 |
175 |
176 | // NAVIGATION
177 | // ----------
178 |
179 | .navbar .nav {
180 | position: relative;
181 | left: 0;
182 | display: block;
183 | float: left;
184 | margin: 0 10px 0 0;
185 | }
186 | .navbar .nav.pull-right {
187 | float: right; // redeclare due to specificity
188 | }
189 | .navbar .nav > li {
190 | display: block;
191 | float: left;
192 | }
193 |
194 | // Links
195 | .navbar .nav > li > a {
196 | float: none;
197 | padding: 10px 10px 11px;
198 | line-height: 19px;
199 | color: @navbarLinkColor;
200 | text-decoration: none;
201 | text-shadow: 0 -1px 0 rgba(0,0,0,.25);
202 | }
203 | // Hover
204 | .navbar .nav > li > a:hover {
205 | background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
206 | color: @navbarLinkColorHover;
207 | text-decoration: none;
208 | }
209 |
210 | // Active nav items
211 | .navbar .nav .active > a,
212 | .navbar .nav .active > a:hover {
213 | color: @navbarLinkColorHover;
214 | text-decoration: none;
215 | background-color: @navbarBackground;
216 | }
217 |
218 | // Dividers (basically a vertical hr)
219 | .navbar .divider-vertical {
220 | height: @navbarHeight;
221 | width: 1px;
222 | margin: 0 9px;
223 | overflow: hidden;
224 | background-color: @navbarBackground;
225 | border-right: 1px solid @navbarBackgroundHighlight;
226 | }
227 |
228 | // Secondary (floated right) nav in topbar
229 | .navbar .nav.pull-right {
230 | margin-left: 10px;
231 | margin-right: 0;
232 | }
233 |
234 |
235 |
236 | // Dropdown menus
237 | // --------------
238 |
239 | // Menu position and menu carets
240 | .navbar .dropdown-menu {
241 | margin-top: 1px;
242 | .border-radius(4px);
243 | &:before {
244 | content: '';
245 | display: inline-block;
246 | border-left: 7px solid transparent;
247 | border-right: 7px solid transparent;
248 | border-bottom: 7px solid #ccc;
249 | border-bottom-color: rgba(0,0,0,.2);
250 | position: absolute;
251 | top: -7px;
252 | left: 9px;
253 | }
254 | &:after {
255 | content: '';
256 | display: inline-block;
257 | border-left: 6px solid transparent;
258 | border-right: 6px solid transparent;
259 | border-bottom: 6px solid @white;
260 | position: absolute;
261 | top: -6px;
262 | left: 10px;
263 | }
264 | }
265 |
266 | // Dropdown toggle caret
267 | .navbar .nav .dropdown-toggle .caret,
268 | .navbar .nav .open.dropdown .caret {
269 | border-top-color: @white;
270 | }
271 | .navbar .nav .active .caret {
272 | .opacity(100);
273 | }
274 |
275 | // Remove background color from open dropdown
276 | .navbar .nav .open > .dropdown-toggle,
277 | .navbar .nav .active > .dropdown-toggle,
278 | .navbar .nav .open.active > .dropdown-toggle {
279 | background-color: transparent;
280 | }
281 |
282 | // Dropdown link on hover
283 | .navbar .nav .active > .dropdown-toggle:hover {
284 | color: @white;
285 | }
286 |
287 | // Right aligned menus need alt position
288 | .navbar .nav.pull-right .dropdown-menu {
289 | left: auto;
290 | right: 0;
291 | &:before {
292 | left: auto;
293 | right: 12px;
294 | }
295 | &:after {
296 | left: auto;
297 | right: 13px;
298 | }
299 | }
--------------------------------------------------------------------------------
/js/lib/bootstrap/bootstrap-typeahead.js:
--------------------------------------------------------------------------------
1 | /* =============================================================
2 | * bootstrap-typeahead.js v2.0.1
3 | * http://twitter.github.com/bootstrap/javascript.html#typeahead
4 | * =============================================================
5 | * Copyright 2012 Twitter, Inc.
6 | *
7 | * Licensed under the Apache License, Version 2.0 (the "License");
8 | * you may not use this file except in compliance with the License.
9 | * You may obtain a copy of the License at
10 | *
11 | * http://www.apache.org/licenses/LICENSE-2.0
12 | *
13 | * Unless required by applicable law or agreed to in writing, software
14 | * distributed under the License is distributed on an "AS IS" BASIS,
15 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 | * See the License for the specific language governing permissions and
17 | * limitations under the License.
18 | * ============================================================ */
19 |
20 | !function( $ ){
21 |
22 | "use strict"
23 |
24 | var Typeahead = function ( element, options ) {
25 | this.$element = $(element)
26 | this.options = $.extend({}, $.fn.typeahead.defaults, options)
27 | this.matcher = this.options.matcher || this.matcher
28 | this.sorter = this.options.sorter || this.sorter
29 | this.highlighter = this.options.highlighter || this.highlighter
30 | this.$menu = $(this.options.menu).appendTo('body')
31 | this.source = this.options.source
32 | this.shown = false
33 | this.listen()
34 | }
35 |
36 | Typeahead.prototype = {
37 |
38 | constructor: Typeahead
39 |
40 | , select: function () {
41 | var val = this.$menu.find('.active').attr('data-value')
42 | this.$element.val(val)
43 | return this.hide()
44 | }
45 |
46 | , show: function () {
47 | var pos = $.extend({}, this.$element.offset(), {
48 | height: this.$element[0].offsetHeight
49 | })
50 |
51 | this.$menu.css({
52 | top: pos.top + pos.height
53 | , left: pos.left
54 | })
55 |
56 | this.$menu.show()
57 | this.shown = true
58 | return this
59 | }
60 |
61 | , hide: function () {
62 | this.$menu.hide()
63 | this.shown = false
64 | return this
65 | }
66 |
67 | , lookup: function (event) {
68 | var that = this
69 | , items
70 | , q
71 |
72 | this.query = this.$element.val()
73 |
74 | if (!this.query) {
75 | return this.shown ? this.hide() : this
76 | }
77 |
78 | items = $.grep(this.source, function (item) {
79 | if (that.matcher(item)) return item
80 | })
81 |
82 | items = this.sorter(items)
83 |
84 | if (!items.length) {
85 | return this.shown ? this.hide() : this
86 | }
87 |
88 | return this.render(items.slice(0, this.options.items)).show()
89 | }
90 |
91 | , matcher: function (item) {
92 | return ~item.toLowerCase().indexOf(this.query.toLowerCase())
93 | }
94 |
95 | , sorter: function (items) {
96 | var beginswith = []
97 | , caseSensitive = []
98 | , caseInsensitive = []
99 | , item
100 |
101 | while (item = items.shift()) {
102 | if (!item.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(item)
103 | else if (~item.indexOf(this.query)) caseSensitive.push(item)
104 | else caseInsensitive.push(item)
105 | }
106 |
107 | return beginswith.concat(caseSensitive, caseInsensitive)
108 | }
109 |
110 | , highlighter: function (item) {
111 | return item.replace(new RegExp('(' + this.query + ')', 'ig'), function ($1, match) {
112 | return '' + match + ' '
113 | })
114 | }
115 |
116 | , render: function (items) {
117 | var that = this
118 |
119 | items = $(items).map(function (i, item) {
120 | i = $(that.options.item).attr('data-value', item)
121 | i.find('a').html(that.highlighter(item))
122 | return i[0]
123 | })
124 |
125 | items.first().addClass('active')
126 | this.$menu.html(items)
127 | return this
128 | }
129 |
130 | , next: function (event) {
131 | var active = this.$menu.find('.active').removeClass('active')
132 | , next = active.next()
133 |
134 | if (!next.length) {
135 | next = $(this.$menu.find('li')[0])
136 | }
137 |
138 | next.addClass('active')
139 | }
140 |
141 | , prev: function (event) {
142 | var active = this.$menu.find('.active').removeClass('active')
143 | , prev = active.prev()
144 |
145 | if (!prev.length) {
146 | prev = this.$menu.find('li').last()
147 | }
148 |
149 | prev.addClass('active')
150 | }
151 |
152 | , listen: function () {
153 | this.$element
154 | .on('blur', $.proxy(this.blur, this))
155 | .on('keypress', $.proxy(this.keypress, this))
156 | .on('keyup', $.proxy(this.keyup, this))
157 |
158 | if ($.browser.webkit || $.browser.msie) {
159 | this.$element.on('keydown', $.proxy(this.keypress, this))
160 | }
161 |
162 | this.$menu
163 | .on('click', $.proxy(this.click, this))
164 | .on('mouseenter', 'li', $.proxy(this.mouseenter, this))
165 | }
166 |
167 | , keyup: function (e) {
168 | e.stopPropagation()
169 | e.preventDefault()
170 |
171 | switch(e.keyCode) {
172 | case 40: // down arrow
173 | case 38: // up arrow
174 | break
175 |
176 | case 9: // tab
177 | case 13: // enter
178 | if (!this.shown) return
179 | this.select()
180 | break
181 |
182 | case 27: // escape
183 | this.hide()
184 | break
185 |
186 | default:
187 | this.lookup()
188 | }
189 |
190 | }
191 |
192 | , keypress: function (e) {
193 | e.stopPropagation()
194 | if (!this.shown) return
195 |
196 | switch(e.keyCode) {
197 | case 9: // tab
198 | case 13: // enter
199 | case 27: // escape
200 | e.preventDefault()
201 | break
202 |
203 | case 38: // up arrow
204 | e.preventDefault()
205 | this.prev()
206 | break
207 |
208 | case 40: // down arrow
209 | e.preventDefault()
210 | this.next()
211 | break
212 | }
213 | }
214 |
215 | , blur: function (e) {
216 | var that = this
217 | e.stopPropagation()
218 | e.preventDefault()
219 | setTimeout(function () { that.hide() }, 150)
220 | }
221 |
222 | , click: function (e) {
223 | e.stopPropagation()
224 | e.preventDefault()
225 | this.select()
226 | }
227 |
228 | , mouseenter: function (e) {
229 | this.$menu.find('.active').removeClass('active')
230 | $(e.currentTarget).addClass('active')
231 | }
232 |
233 | }
234 |
235 |
236 | /* TYPEAHEAD PLUGIN DEFINITION
237 | * =========================== */
238 |
239 | $.fn.typeahead = function ( option ) {
240 | return this.each(function () {
241 | var $this = $(this)
242 | , data = $this.data('typeahead')
243 | , options = typeof option == 'object' && option
244 | if (!data) $this.data('typeahead', (data = new Typeahead(this, options)))
245 | if (typeof option == 'string') data[option]()
246 | })
247 | }
248 |
249 | $.fn.typeahead.defaults = {
250 | source: []
251 | , items: 8
252 | , menu: ''
253 | , item: ' tag with a base class
10 | // of .i and are then given a unique class to add width, height,
11 | // and background-position. Your resulting HTML will look like
12 | // .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here
46 | }
47 | input,
48 | button,
49 | select,
50 | textarea {
51 | #font > #family > .sans-serif(); // And only set font-family here for those that need it (note the missing label element)
52 | }
53 |
54 | // Identify controls by their labels
55 | label {
56 | display: block;
57 | margin-bottom: 5px;
58 | color: @grayDark;
59 | }
60 |
61 | // Inputs, Textareas, Selects
62 | input,
63 | textarea,
64 | select,
65 | .uneditable-input {
66 | display: inline-block;
67 | width: 210px;
68 | height: @baseLineHeight;
69 | padding: 4px;
70 | margin-bottom: 9px;
71 | font-size: @baseFontSize;
72 | line-height: @baseLineHeight;
73 | color: @gray;
74 | border: 1px solid #ccc;
75 | .border-radius(3px);
76 | }
77 | .uneditable-textarea {
78 | width: auto;
79 | height: auto;
80 | }
81 |
82 | // Inputs within a label
83 | label input,
84 | label textarea,
85 | label select {
86 | display: block;
87 | }
88 |
89 | // Mini reset for unique input types
90 | input[type="image"],
91 | input[type="checkbox"],
92 | input[type="radio"] {
93 | width: auto;
94 | height: auto;
95 | padding: 0;
96 | margin: 3px 0;
97 | *margin-top: 0; /* IE7 */
98 | line-height: normal;
99 | cursor: pointer;
100 | .border-radius(0);
101 | border: 0 \9; /* IE9 and down */
102 | }
103 | input[type="image"] {
104 | border: 0;
105 | }
106 |
107 | // Reset the file input to browser defaults
108 | input[type="file"] {
109 | width: auto;
110 | padding: initial;
111 | line-height: initial;
112 | border: initial;
113 | background-color: @white;
114 | background-color: initial;
115 | .box-shadow(none);
116 | }
117 |
118 | // Help out input buttons
119 | input[type="button"],
120 | input[type="reset"],
121 | input[type="submit"] {
122 | width: auto;
123 | height: auto;
124 | }
125 |
126 | // Set the height of select and file controls to match text inputs
127 | select,
128 | input[type="file"] {
129 | height: 28px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
130 | *margin-top: 4px; /* For IE7, add top margin to align select with labels */
131 | line-height: 28px;
132 | }
133 |
134 | // Reset line-height for IE
135 | input[type="file"] {
136 | line-height: 18px \9;
137 | }
138 |
139 | // Chrome on Linux and Mobile Safari need background-color
140 | select {
141 | width: 220px; // default input width + 10px of padding that doesn't get applied
142 | background-color: @white;
143 | }
144 |
145 | // Make multiple select elements height not fixed
146 | select[multiple],
147 | select[size] {
148 | height: auto;
149 | }
150 |
151 | // Remove shadow from image inputs
152 | input[type="image"] {
153 | .box-shadow(none);
154 | }
155 |
156 | // Make textarea height behave
157 | textarea {
158 | height: auto;
159 | }
160 |
161 | // Hidden inputs
162 | input[type="hidden"] {
163 | display: none;
164 | }
165 |
166 |
167 |
168 | // CHECKBOXES & RADIOS
169 | // -------------------
170 |
171 | // Indent the labels to position radios/checkboxes as hanging
172 | .radio,
173 | .checkbox {
174 | padding-left: 18px;
175 | }
176 | .radio input[type="radio"],
177 | .checkbox input[type="checkbox"] {
178 | float: left;
179 | margin-left: -18px;
180 | }
181 |
182 | // Move the options list down to align with labels
183 | .controls > .radio:first-child,
184 | .controls > .checkbox:first-child {
185 | padding-top: 5px; // has to be padding because margin collaspes
186 | }
187 |
188 | // Radios and checkboxes on same line
189 | // TODO v3: Convert .inline to .control-inline
190 | .radio.inline,
191 | .checkbox.inline {
192 | display: inline-block;
193 | padding-top: 5px;
194 | margin-bottom: 0;
195 | vertical-align: middle;
196 | }
197 | .radio.inline + .radio.inline,
198 | .checkbox.inline + .checkbox.inline {
199 | margin-left: 10px; // space out consecutive inline controls
200 | }
201 |
202 |
203 |
204 | // FOCUS STATE
205 | // -----------
206 |
207 | input,
208 | textarea {
209 | .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
210 | @transition: border linear .2s, box-shadow linear .2s;
211 | .transition(@transition);
212 | }
213 | input:focus,
214 | textarea:focus {
215 | border-color: rgba(82,168,236,.8);
216 | @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
217 | .box-shadow(@shadow);
218 | outline: 0;
219 | outline: thin dotted \9; /* IE6-9 */
220 | }
221 | input[type="file"]:focus,
222 | input[type="radio"]:focus,
223 | input[type="checkbox"]:focus,
224 | select:focus {
225 | .box-shadow(none); // override for file inputs
226 | .tab-focus();
227 | }
228 |
229 |
230 |
231 | // INPUT SIZES
232 | // -----------
233 |
234 | // General classes for quick sizes
235 | .input-mini { width: 60px; }
236 | .input-small { width: 90px; }
237 | .input-medium { width: 150px; }
238 | .input-large { width: 210px; }
239 | .input-xlarge { width: 270px; }
240 | .input-xxlarge { width: 530px; }
241 |
242 | // Grid style input sizes
243 | input[class*="span"],
244 | select[class*="span"],
245 | textarea[class*="span"],
246 | .uneditable-input {
247 | float: none;
248 | margin-left: 0;
249 | }
250 |
251 |
252 |
253 | // GRID SIZING FOR INPUTS
254 | // ----------------------
255 |
256 | #inputGridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
257 |
258 |
259 |
260 |
261 | // DISABLED STATE
262 | // --------------
263 |
264 | // Disabled and read-only inputs
265 | input[disabled],
266 | select[disabled],
267 | textarea[disabled],
268 | input[readonly],
269 | select[readonly],
270 | textarea[readonly] {
271 | background-color: #f5f5f5;
272 | border-color: #ddd;
273 | cursor: not-allowed;
274 | }
275 |
276 |
277 |
278 |
279 | // FORM FIELD FEEDBACK STATES
280 | // --------------------------
281 |
282 | // Warning
283 | .control-group.warning {
284 | .formFieldState(@warningText, @warningText, @warningBackground);
285 | }
286 | // Error
287 | .control-group.error {
288 | .formFieldState(@errorText, @errorText, @errorBackground);
289 | }
290 | // Success
291 | .control-group.success {
292 | .formFieldState(@successText, @successText, @successBackground);
293 | }
294 |
295 | // HTML5 invalid states
296 | // Shares styles with the .control-group.error above
297 | input:focus:required:invalid,
298 | textarea:focus:required:invalid,
299 | select:focus:required:invalid {
300 | color: #b94a48;
301 | border-color: #ee5f5b;
302 | &:focus {
303 | border-color: darken(#ee5f5b, 10%);
304 | .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
305 | }
306 | }
307 |
308 |
309 |
310 | // FORM ACTIONS
311 | // ------------
312 |
313 | .form-actions {
314 | padding: (@baseLineHeight - 1) 20px @baseLineHeight;
315 | margin-top: @baseLineHeight;
316 | margin-bottom: @baseLineHeight;
317 | background-color: #f5f5f5;
318 | border-top: 1px solid #ddd;
319 | }
320 |
321 | // For text that needs to appear as an input but should not be an input
322 | .uneditable-input {
323 | display: block;
324 | background-color: @white;
325 | border-color: #eee;
326 | .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
327 | cursor: not-allowed;
328 | }
329 |
330 | // Placeholder text gets special styles; can't be bundled together though for some reason
331 | .placeholder(@grayLight);
332 |
333 |
334 |
335 | // HELP TEXT
336 | // ---------
337 |
338 | .help-block {
339 | display: block; // account for any element using help-block
340 | margin-top: 5px;
341 | margin-bottom: 0;
342 | color: @grayLight;
343 | }
344 |
345 | .help-inline {
346 | display: inline-block;
347 | .ie7-inline-block();
348 | margin-bottom: 9px;
349 | vertical-align: middle;
350 | padding-left: 5px;
351 | }
352 |
353 |
354 |
355 | // INPUT GROUPS
356 | // ------------
357 |
358 | // Allow us to put symbols and text within the input field for a cleaner look
359 | .input-prepend,
360 | .input-append {
361 | margin-bottom: 5px;
362 | .clearfix(); // Clear the float to prevent wrapping
363 | input,
364 | .uneditable-input {
365 | .border-radius(0 3px 3px 0);
366 | &:focus {
367 | position: relative;
368 | z-index: 2;
369 | }
370 | }
371 | .uneditable-input {
372 | border-left-color: #ccc;
373 | }
374 | .add-on {
375 | float: left;
376 | display: block;
377 | width: auto;
378 | min-width: 16px;
379 | height: @baseLineHeight;
380 | margin-right: -1px;
381 | padding: 4px 5px;
382 | font-weight: normal;
383 | line-height: @baseLineHeight;
384 | color: @grayLight;
385 | text-align: center;
386 | text-shadow: 0 1px 0 @white;
387 | background-color: #f5f5f5;
388 | border: 1px solid #ccc;
389 | .border-radius(3px 0 0 3px);
390 | }
391 | .active {
392 | background-color: lighten(@green, 30);
393 | border-color: @green;
394 | }
395 | }
396 | .input-prepend {
397 | .add-on {
398 | *margin-top: 1px; /* IE6-7 */
399 | }
400 | }
401 | .input-append {
402 | input,
403 | .uneditable-input {
404 | float: left;
405 | .border-radius(3px 0 0 3px);
406 | }
407 | .uneditable-input {
408 | border-left-color: #eee;
409 | border-right-color: #ccc;
410 | }
411 | .add-on {
412 | margin-right: 0;
413 | margin-left: -1px;
414 | .border-radius(0 3px 3px 0);
415 | }
416 | input:first-child {
417 | // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
418 | // inherit the sum of its ancestors' margins.
419 | *margin-left: -160px;
420 |
421 | &+.add-on {
422 | *margin-left: -21px;
423 | }
424 | }
425 | }
426 |
427 |
428 |
429 | // SEARCH FORM
430 | // -----------
431 |
432 | .search-query {
433 | padding-left: 14px;
434 | padding-right: 14px;
435 | margin-bottom: 0; // remove the default margin on all inputs
436 | .border-radius(14px);
437 | }
438 |
439 |
440 |
441 | // HORIZONTAL & VERTICAL FORMS
442 | // ---------------------------
443 |
444 | // Common properties
445 | // -----------------
446 |
447 | .form-search,
448 | .form-inline,
449 | .form-horizontal {
450 | input,
451 | textarea,
452 | select,
453 | .help-inline,
454 | .uneditable-input {
455 | display: inline-block;
456 | margin-bottom: 0;
457 | }
458 | // Re-hide hidden elements due to specifity
459 | .hide {
460 | display: none;
461 | }
462 | }
463 | .form-search label,
464 | .form-inline label,
465 | .form-search .input-append,
466 | .form-inline .input-append,
467 | .form-search .input-prepend,
468 | .form-inline .input-prepend {
469 | display: inline-block;
470 | }
471 | // Make the prepend and append add-on vertical-align: middle;
472 | .form-search .input-append .add-on,
473 | .form-inline .input-prepend .add-on,
474 | .form-search .input-append .add-on,
475 | .form-inline .input-prepend .add-on {
476 | vertical-align: middle;
477 | }
478 | // Inline checkbox/radio labels
479 | .form-search .radio,
480 | .form-inline .radio,
481 | .form-search .checkbox,
482 | .form-inline .checkbox {
483 | margin-bottom: 0;
484 | vertical-align: middle;
485 | }
486 |
487 | // Margin to space out fieldsets
488 | .control-group {
489 | margin-bottom: @baseLineHeight / 2;
490 | }
491 |
492 | // Legend collapses margin, so next element is responsible for spacing
493 | legend + .control-group {
494 | margin-top: @baseLineHeight;
495 | -webkit-margin-top-collapse: separate;
496 | }
497 |
498 | // Horizontal-specific styles
499 | // --------------------------
500 |
501 | .form-horizontal {
502 | // Increase spacing between groups
503 | .control-group {
504 | margin-bottom: @baseLineHeight;
505 | .clearfix();
506 | }
507 | // Float the labels left
508 | .control-label {
509 | float: left;
510 | width: 140px;
511 | padding-top: 5px;
512 | text-align: right;
513 | }
514 | // Move over all input controls and content
515 | .controls {
516 | margin-left: 160px;
517 | }
518 | // Move over buttons in .form-actions to align with .controls
519 | .form-actions {
520 | padding-left: 160px;
521 | }
522 | }
523 |
--------------------------------------------------------------------------------