Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

updated twitter-bootstrap to v2.0.2

  • Loading branch information...
commit 90a9ca9a522d15e022ece47db2fd566b11b59f18 1 parent 96490ac
James Pinto thejamespinto authored
Showing with 873 additions and 476 deletions.
  1. +1 −0  README.md
  2. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js
  3. +57 −57 vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js
  4. +7 −3 vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js
  5. +4 −2 vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js
  6. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js
  7. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js
  8. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js
  9. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js
  10. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js
  11. +2 −2 vendor/assets/javascripts/twitter/bootstrap/bootstrap-tooltip.js
  12. +1 −1  vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js
  13. +7 −7 vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js
  14. +2 −14 vendor/toolkit/twitter/bootstrap/alerts.less
  15. +36 −0 vendor/toolkit/twitter/bootstrap/badges.less
  16. +2 −1  vendor/toolkit/twitter/bootstrap/bootstrap.less
  17. +2 −0  vendor/toolkit/twitter/bootstrap/breadcrumbs.less
  18. +31 −7 vendor/toolkit/twitter/bootstrap/button-groups.less
  19. +17 −13 vendor/toolkit/twitter/bootstrap/buttons.less
  20. +2 −2 vendor/toolkit/twitter/bootstrap/code.less
  21. +4 −2 vendor/toolkit/twitter/bootstrap/component-animations.less
  22. +45 −27 vendor/toolkit/twitter/bootstrap/dropdowns.less
  23. +78 −45 vendor/toolkit/twitter/bootstrap/forms.less
  24. +2 −5 vendor/toolkit/twitter/bootstrap/grid.less
  25. +3 −1 vendor/toolkit/twitter/bootstrap/hero-unit.less
  26. +8 −2 vendor/toolkit/twitter/bootstrap/labels.less
  27. +190 −166 vendor/toolkit/twitter/bootstrap/mixins.less
  28. +12 −5 vendor/toolkit/twitter/bootstrap/modals.less
  29. +77 −35 vendor/toolkit/twitter/bootstrap/navbar.less
  30. +19 −9 vendor/toolkit/twitter/bootstrap/navs.less
  31. +6 −0 vendor/toolkit/twitter/bootstrap/pager.less
  32. +1 −0  vendor/toolkit/twitter/bootstrap/pagination.less
  33. +15 −1 vendor/toolkit/twitter/bootstrap/progress-bars.less
  34. +1 −1  vendor/toolkit/twitter/bootstrap/reset.less
  35. +72 −28 vendor/toolkit/twitter/bootstrap/responsive.less
  36. +4 −4 vendor/toolkit/twitter/bootstrap/scaffolding.less
  37. +1 −1  vendor/toolkit/twitter/bootstrap/sprites.less
  38. +26 −17 vendor/toolkit/twitter/bootstrap/tables.less
  39. +22 −6 vendor/toolkit/twitter/bootstrap/type.less
  40. +100 −6 vendor/toolkit/twitter/bootstrap/variables.less
  41. +10 −0 vendor/toolkit/twitter/bootstrap/wells.less
1  README.md
View
@@ -176,6 +176,7 @@ twitter-bootstrap-rails has seperate branch (w/o Less) that just serves latest s
<li>Masakuni Kato</li>
<li>Gudleik Rasch</li>
<li>Thomas Volkmar Worm</li>
+ <li>Thiago Almeida</li>
</ul>
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js
View
@@ -1,5 +1,5 @@
/* ==========================================================
- * bootstrap-alert.js v2.0.1
+ * bootstrap-alert.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#alerts
* ==========================================================
* Copyright 2012 Twitter, Inc.
114 vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js
View
@@ -1,5 +1,5 @@
/* ============================================================
- * bootstrap-button.js v2.0.1
+ * bootstrap-button.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#buttons
* ============================================================
* Copyright 2012 Twitter, Inc.
@@ -19,82 +19,82 @@
!function( $ ){
- "use strict"
+ "use strict"
- /* BUTTON PUBLIC CLASS DEFINITION
- * ============================== */
+ /* BUTTON PUBLIC CLASS DEFINITION
+ * ============================== */
- var Button = function ( element, options ) {
- this.$element = $(element)
- this.options = $.extend({}, $.fn.button.defaults, options)
- }
+ var Button = function ( element, options ) {
+ this.$element = $(element)
+ this.options = $.extend({}, $.fn.button.defaults, options)
+ }
- Button.prototype = {
+ Button.prototype = {
- constructor: Button
+ constructor: Button
- , setState: function ( state ) {
- var d = 'disabled'
- , $el = this.$element
- , data = $el.data()
- , val = $el.is('input') ? 'val' : 'html'
+ , setState: function ( state ) {
+ var d = 'disabled'
+ , $el = this.$element
+ , data = $el.data()
+ , val = $el.is('input') ? 'val' : 'html'
- state = state + 'Text'
- data.resetText || $el.data('resetText', $el[val]())
+ state = state + 'Text'
+ data.resetText || $el.data('resetText', $el[val]())
- $el[val](data[state] || this.options[state])
+ $el[val](data[state] || this.options[state])
- // push to event loop to allow forms to submit
- setTimeout(function () {
- state == 'loadingText' ?
- $el.addClass(d).attr(d, d) :
- $el.removeClass(d).removeAttr(d)
- }, 0)
- }
+ // push to event loop to allow forms to submit
+ setTimeout(function () {
+ state == 'loadingText' ?
+ $el.addClass(d).attr(d, d) :
+ $el.removeClass(d).removeAttr(d)
+ }, 0)
+ }
- , toggle: function () {
- var $parent = this.$element.parent('[data-toggle="buttons-radio"]')
+ , toggle: function () {
+ var $parent = this.$element.parent('[data-toggle="buttons-radio"]')
- $parent && $parent
- .find('.active')
- .removeClass('active')
+ $parent && $parent
+ .find('.active')
+ .removeClass('active')
- this.$element.toggleClass('active')
- }
+ this.$element.toggleClass('active')
+ }
- }
+ }
- /* BUTTON PLUGIN DEFINITION
- * ======================== */
+ /* BUTTON PLUGIN DEFINITION
+ * ======================== */
- $.fn.button = function ( option ) {
- return this.each(function () {
- var $this = $(this)
- , data = $this.data('button')
- , options = typeof option == 'object' && option
- if (!data) $this.data('button', (data = new Button(this, options)))
- if (option == 'toggle') data.toggle()
- else if (option) data.setState(option)
- })
- }
+ $.fn.button = function ( option ) {
+ return this.each(function () {
+ var $this = $(this)
+ , data = $this.data('button')
+ , options = typeof option == 'object' && option
+ if (!data) $this.data('button', (data = new Button(this, options)))
+ if (option == 'toggle') data.toggle()
+ else if (option) data.setState(option)
+ })
+ }
- $.fn.button.defaults = {
- loadingText: 'loading...'
- }
+ $.fn.button.defaults = {
+ loadingText: 'loading...'
+ }
- $.fn.button.Constructor = Button
+ $.fn.button.Constructor = Button
- /* BUTTON DATA-API
- * =============== */
+ /* BUTTON DATA-API
+ * =============== */
- $(function () {
- $('body').on('click.button.data-api', '[data-toggle^=button]', function ( e ) {
- var $btn = $(e.target)
- if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
- $btn.button('toggle')
- })
+ $(function () {
+ $('body').on('click.button.data-api', '[data-toggle^=button]', function ( e ) {
+ var $btn = $(e.target)
+ if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
+ $btn.button('toggle')
})
+ })
}( window.jQuery );
10 vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js
View
@@ -1,5 +1,5 @@
/* ==========================================================
- * bootstrap-carousel.js v2.0.1
+ * bootstrap-carousel.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#carousel
* ==========================================================
* Copyright 2012 Twitter, Inc.
@@ -29,6 +29,9 @@
this.$element = $(element)
this.options = $.extend({}, $.fn.carousel.defaults, options)
this.options.slide && this.slide(this.options.slide)
+ this.options.pause == 'hover' && this.$element
+ .on('mouseenter', $.proxy(this.pause, this))
+ .on('mouseleave', $.proxy(this.cycle, this))
}
Carousel.prototype = {
@@ -83,14 +86,14 @@
, fallback = type == 'next' ? 'first' : 'last'
, that = this
- if (!$next.length) return
-
this.sliding = true
isCycling && this.pause()
$next = $next.length ? $next : this.$element.find('.item')[fallback]()
+ if ($next.hasClass('active')) return
+
if (!$.support.transition && this.$element.hasClass('slide')) {
this.$element.trigger('slide')
$active.removeClass('active')
@@ -136,6 +139,7 @@
$.fn.carousel.defaults = {
interval: 5000
+ , pause: 'hover'
}
$.fn.carousel.Constructor = Carousel
6 vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js
View
@@ -1,5 +1,5 @@
/* =============================================================
- * bootstrap-collapse.js v2.0.1
+ * bootstrap-collapse.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#collapse
* =============================================================
* Copyright 2012 Twitter, Inc.
@@ -74,7 +74,9 @@
[dimension](size || 'auto')
[0].offsetWidth
- this.$element.addClass('collapse')
+ this.$element[size ? 'addClass' : 'removeClass']('collapse')
+
+ return this
}
, transition: function ( method, startEvent, completeEvent ) {
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js
View
@@ -1,5 +1,5 @@
/* ============================================================
- * bootstrap-dropdown.js v2.0.1
+ * bootstrap-dropdown.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#dropdowns
* ============================================================
* Copyright 2012 Twitter, Inc.
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js
View
@@ -1,5 +1,5 @@
/* =========================================================
- * bootstrap-modal.js v2.0.1
+ * bootstrap-modal.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#modals
* =========================================================
* Copyright 2012 Twitter, Inc.
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js
View
@@ -1,5 +1,5 @@
/* ===========================================================
- * bootstrap-popover.js v2.0.1
+ * bootstrap-popover.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#popovers
* ===========================================================
* Copyright 2012 Twitter, Inc.
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js
View
@@ -1,5 +1,5 @@
/* =============================================================
- * bootstrap-scrollspy.js v2.0.1
+ * bootstrap-scrollspy.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#scrollspy
* =============================================================
* Copyright 2012 Twitter, Inc.
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js
View
@@ -1,5 +1,5 @@
/* ========================================================
- * bootstrap-tab.js v2.0.1
+ * bootstrap-tab.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#tabs
* ========================================================
* Copyright 2012 Twitter, Inc.
4 vendor/assets/javascripts/twitter/bootstrap/bootstrap-tooltip.js
View
@@ -1,5 +1,5 @@
/* ===========================================================
- * bootstrap-tooltip.js v2.0.1
+ * bootstrap-tooltip.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#tooltips
* Inspired by the original jQuery.tipsy by Jason Frame
* ===========================================================
@@ -206,7 +206,7 @@
title = $e.attr('data-original-title')
|| (typeof o.title == 'function' ? o.title.call($e[0]) : o.title)
- title = title.toString().replace(/(^\s*|\s*$)/, "")
+ title = (title || '').toString().replace(/(^\s*|\s*$)/, "")
return title
}
2  vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js
View
@@ -1,5 +1,5 @@
/* ===================================================
- * bootstrap-transition.js v2.0.1
+ * bootstrap-transition.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#transitions
* ===================================================
* Copyright 2012 Twitter, Inc.
14 vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js
View
@@ -1,5 +1,5 @@
/* =============================================================
- * bootstrap-typeahead.js v2.0.1
+ * bootstrap-typeahead.js v2.0.2
* http://twitter.github.com/bootstrap/javascript.html#typeahead
* =============================================================
* Copyright 2012 Twitter, Inc.
@@ -40,6 +40,7 @@
, select: function () {
var val = this.$menu.find('.active').attr('data-value')
this.$element.val(val)
+ this.$element.change();
return this.hide()
}
@@ -165,9 +166,6 @@
}
, keyup: function (e) {
- e.stopPropagation()
- e.preventDefault()
-
switch(e.keyCode) {
case 40: // down arrow
case 38: // up arrow
@@ -180,6 +178,7 @@
break
case 27: // escape
+ if (!this.shown) return
this.hide()
break
@@ -187,10 +186,11 @@
this.lookup()
}
+ e.stopPropagation()
+ e.preventDefault()
}
, keypress: function (e) {
- e.stopPropagation()
if (!this.shown) return
switch(e.keyCode) {
@@ -210,12 +210,12 @@
this.next()
break
}
+
+ e.stopPropagation()
}
, blur: function (e) {
var that = this
- e.stopPropagation()
- e.preventDefault()
setTimeout(function () { that.hide() }, 150)
}
16 vendor/toolkit/twitter/bootstrap/alerts.less
View
@@ -9,10 +9,10 @@
background-color: @warningBackground;
border: 1px solid @warningBorder;
.border-radius(4px);
+ color: @warningText;
}
-.alert,
.alert-heading {
- color: @warningText;
+ color: inherit;
}
// Adjust close link position
@@ -29,32 +29,20 @@
.alert-success {
background-color: @successBackground;
border-color: @successBorder;
-}
-.alert-success,
-.alert-success .alert-heading {
color: @successText;
}
.alert-danger,
.alert-error {
background-color: @errorBackground;
border-color: @errorBorder;
-}
-.alert-danger,
-.alert-error,
-.alert-danger .alert-heading,
-.alert-error .alert-heading {
color: @errorText;
}
.alert-info {
background-color: @infoBackground;
border-color: @infoBorder;
-}
-.alert-info,
-.alert-info .alert-heading {
color: @infoText;
}
-
// Block alerts
// ------------------------
.alert-block {
36 vendor/toolkit/twitter/bootstrap/badges.less
View
@@ -0,0 +1,36 @@
+// BADGES
+// ------
+
+// Base
+.badge {
+ padding: 1px 9px 2px;
+ font-size: @baseFontSize * .925;
+ font-weight: bold;
+ white-space: nowrap;
+ color: @white;
+ background-color: @grayLight;
+ .border-radius(9px);
+}
+
+// Hover state
+.badge:hover {
+ color: @white;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+// Colors
+.badge-error { background-color: @errorText; }
+.badge-error:hover { background-color: darken(@errorText, 10%); }
+
+.badge-warning { background-color: @orange; }
+.badge-warning:hover { background-color: darken(@orange, 10%); }
+
+.badge-success { background-color: @successText; }
+.badge-success:hover { background-color: darken(@successText, 10%); }
+
+.badge-info { background-color: @infoText; }
+.badge-info:hover { background-color: darken(@infoText, 10%); }
+
+.badge-inverse { background-color: @grayDark; }
+.badge-inverse:hover { background-color: darken(@grayDark, 10%); }
3  vendor/toolkit/twitter/bootstrap/bootstrap.less
View
@@ -1,5 +1,5 @@
/*!
- * Bootstrap v2.0.1
+ * Bootstrap v2.0.2
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
@@ -53,6 +53,7 @@
// Components: Misc
@import "thumbnails.less";
@import "labels.less";
+@import "badges.less";
@import "progress-bars.less";
@import "accordion.less";
@import "carousel.less";
2  vendor/toolkit/twitter/bootstrap/breadcrumbs.less
View
@@ -4,12 +4,14 @@
.breadcrumb {
padding: 7px 14px;
margin: 0 0 @baseLineHeight;
+ list-style: none;
#gradient > .vertical(@white, #f5f5f5);
border: 1px solid #ddd;
.border-radius(3px);
.box-shadow(inset 0 1px 0 @white);
li {
display: inline-block;
+ .ie7-inline-block();
text-shadow: 0 1px 0 @white;
}
.divider {
38 vendor/toolkit/twitter/bootstrap/button-groups.less
View
@@ -95,8 +95,22 @@
padding-right: 8px;
@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);
.box-shadow(@shadow);
- *padding-top: 5px;
- *padding-bottom: 5px;
+ *padding-top: 3px;
+ *padding-bottom: 3px;
+}
+.btn-group .btn-mini.dropdown-toggle {
+ padding-left: 5px;
+ padding-right: 5px;
+ *padding-top: 1px;
+ *padding-bottom: 1px;
+}
+.btn-group .btn-small.dropdown-toggle {
+ *padding-top: 4px;
+ *padding-bottom: 4px;
+}
+.btn-group .btn-large.dropdown-toggle {
+ padding-left: 12px;
+ padding-right: 12px;
}
.btn-group.open {
@@ -127,22 +141,32 @@
.open.btn-group .caret {
.opacity(100);
}
+// Carets in other button sizes
+.btn-mini .caret {
+ margin-top: 5px;
+}
+.btn-small .caret {
+ margin-top: 6px;
+}
+.btn-large .caret {
+ margin-top: 6px;
+ border-left: 5px solid transparent;
+ border-right: 5px solid transparent;
+ border-top: 5px solid @black;
+}
// Account for other colors
.btn-primary,
+.btn-warning,
.btn-danger,
.btn-info,
.btn-success,
.btn-inverse {
.caret {
border-top-color: @white;
+ border-bottom-color: @white;
.opacity(75);
}
}
-// Small button dropdowns
-.btn-small .caret {
- margin-top: 4px;
-}
-
30 vendor/toolkit/twitter/bootstrap/buttons.less
View
@@ -8,6 +8,7 @@
// Core
.btn {
display: inline-block;
+ .ie7-inline-block();
padding: 4px 10px 4px;
margin-bottom: 0; // For input.btn
font-size: @baseFontSize;
@@ -16,16 +17,15 @@
text-align: center;
text-shadow: 0 1px 1px rgba(255,255,255,.75);
vertical-align: middle;
- .buttonBackground(@white, darken(@white, 10%));
- border: 1px solid #ccc;
- border-bottom-color: #bbb;
+ .buttonBackground(@btnBackground, @btnBackgroundHighlight);
+ border: 1px solid @btnBorder;
+ border-bottom-color: darken(@btnBorder, 10%);
.border-radius(4px);
@shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
cursor: pointer;
// Give IE7 some love
- .reset-filter();
.ie7-restore-left-whitespace();
}
@@ -126,34 +126,34 @@
.btn-danger.active,
.btn-success.active,
.btn-info.active,
-.btn-dark.active {
+.btn-inverse.active {
color: rgba(255,255,255,.75);
}
// Set the backgrounds
// -------------------------
.btn-primary {
- .buttonBackground(@primaryButtonBackground, spin(@primaryButtonBackground, 20));
+ .buttonBackground(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight);
}
// Warning appears are orange
.btn-warning {
- .buttonBackground(lighten(@orange, 15%), @orange);
+ .buttonBackground(@btnWarningBackground, @btnWarningBackgroundHighlight);
}
// Danger and error appear as red
.btn-danger {
- .buttonBackground(#ee5f5b, #bd362f);
+ .buttonBackground(@btnDangerBackground, @btnDangerBackgroundHighlight);
}
// Success appears as green
.btn-success {
- .buttonBackground(#62c462, #51a351);
+ .buttonBackground(@btnSuccessBackground, @btnSuccessBackgroundHighlight);
}
// Info appears as a neutral blue
.btn-info {
- .buttonBackground(#5bc0de, #2f96b4);
+ .buttonBackground(@btnInfoBackground, @btnInfoBackgroundHighlight);
}
// Inverse appears as dark gray
.btn-inverse {
- .buttonBackground(#454545, #262626);
+ .buttonBackground(@btnInverseBackground, @btnInverseBackgroundHighlight);
}
@@ -172,12 +172,16 @@ input[type="submit"].btn {
// IE7 has some default padding on button controls
*padding-top: 2px;
*padding-bottom: 2px;
- &.large {
+ &.btn-large {
*padding-top: 7px;
*padding-bottom: 7px;
}
- &.small {
+ &.btn-small {
*padding-top: 3px;
*padding-bottom: 3px;
}
+ &.btn-mini {
+ *padding-top: 1px;
+ *padding-bottom: 1px;
+ }
}
4 vendor/toolkit/twitter/bootstrap/code.less
View
@@ -14,7 +14,7 @@ pre {
// Inline code
code {
- padding: 3px 4px;
+ padding: 2px 4px;
color: #d14;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
@@ -25,7 +25,7 @@ pre {
display: block;
padding: (@baseLineHeight - 1) / 2;
margin: 0 0 @baseLineHeight / 2;
- font-size: 12px;
+ font-size: @baseFontSize * .925; // 13px to 12px
line-height: @baseLineHeight;
background-color: #f5f5f5;
border: 1px solid #ccc; // fallback for IE7-8
6 vendor/toolkit/twitter/bootstrap/component-animations.less
View
@@ -14,5 +14,7 @@
position:relative;
overflow:hidden;
height: 0;
- &.in { height: auto; }
-}
+ &.in {
+ height: auto;
+ }
+}
72 vendor/toolkit/twitter/bootstrap/dropdowns.less
View
@@ -13,22 +13,22 @@
.open .dropdown-toggle {
outline: 0;
}
+
// Dropdown arrow/caret
+// --------------------
.caret {
display: inline-block;
width: 0;
height: 0;
- text-indent: -99999px;
- // IE7 won't do the border trick if there's a text indent, but it doesn't
- // do the content that text-indent is hiding, either, so we're ok.
- *text-indent: 0;
vertical-align: top;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid @black;
.opacity(30);
- content: "\2193";
+ content: "";
}
+
+// Place the caret
.dropdown .caret {
margin-top: 8px;
margin-left: 2px;
@@ -37,7 +37,9 @@
.open.dropdown .caret {
.opacity(100);
}
+
// The dropdown menu (ul)
+// ----------------------
.dropdown-menu {
position: absolute;
top: 100%;
@@ -46,11 +48,10 @@
float: left;
display: none; // none by default, but block on "open" of the menu
min-width: 160px;
- _width: 160px;
padding: 4px 0;
margin: 0; // override default ul
list-style: none;
- background-color: @white;
+ background-color: @dropdownBackground;
border-color: #ccc;
border-color: rgba(0,0,0,.2);
border-style: solid;
@@ -63,27 +64,15 @@
*border-right-width: 2px;
*border-bottom-width: 2px;
- // Allow for dropdowns to go bottom up (aka, dropup-menu)
- &.bottom-up {
- top: auto;
- bottom: 100%;
- margin-bottom: 2px;
+ // Aligns the dropdown menu to right
+ &.pull-right {
+ right: 0;
+ left: auto;
}
// Dividers (basically an hr) within the dropdown
.divider {
- height: 1px;
- margin: 5px 1px;
- overflow: hidden;
- background-color: #e5e5e5;
- border-bottom: 1px solid @white;
-
- // IE7 needs a set width since we gave a height. Restricting just
- // to IE7 to keep the 1px left/right space in other browsers.
- // It is unclear where IE is getting the extra space that we need
- // to negative-margin away, but so it goes.
- *width: 100%;
- *margin: -5px 0 5px;
+ .nav-divider();
}
// Links within the dropdown menu
@@ -93,21 +82,23 @@
clear: both;
font-weight: normal;
line-height: @baseLineHeight;
- color: @gray;
+ color: @dropdownLinkColor;
white-space: nowrap;
}
}
// Hover state
+// -----------
.dropdown-menu li > a:hover,
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover {
- color: @white;
+ color: @dropdownLinkColorHover;
text-decoration: none;
- background-color: @linkColor;
+ background-color: @dropdownLinkBackgroundHover;
}
// Open state for the dropdown
+// ---------------------------
.dropdown.open {
// IE7's z-index only goes to the nearest positioned ancestor, which would
// make the menu appear below buttons that appeared later on the page
@@ -123,7 +114,34 @@
}
}
+// Right aligned dropdowns
+.pull-right .dropdown-menu {
+ left: auto;
+ right: 0;
+}
+
+// Allow for dropdowns to go bottom up (aka, dropup-menu)
+// ------------------------------------------------------
+// Just add .dropup after the standard .dropdown class and you're set, bro.
+// TODO: abstract this so that the navbar fixed styles are not placed here?
+.dropup,
+.navbar-fixed-bottom .dropdown {
+ // Reverse the caret
+ .caret {
+ border-top: 0;
+ border-bottom: 4px solid @black;
+ content: "\2191";
+ }
+ // Different positioning for bottom up menu
+ .dropdown-menu {
+ top: auto;
+ bottom: 100%;
+ margin-bottom: 1px;
+ }
+}
+
// Typeahead
+// ---------
.typeahead {
margin-top: 2px; // give it some space to breathe
.border-radius(4px);
123 vendor/toolkit/twitter/bootstrap/forms.less
View
@@ -48,7 +48,7 @@ input,
button,
select,
textarea {
- #font > #family > .sans-serif(); // And only set font-family here for those that need it (note the missing label element)
+ font-family: @baseFontFamily; // And only set font-family here for those that need it (note the missing label element)
}
// Identify controls by their labels
@@ -71,7 +71,7 @@ select,
font-size: @baseFontSize;
line-height: @baseLineHeight;
color: @gray;
- border: 1px solid #ccc;
+ border: 1px solid @inputBorder;
.border-radius(3px);
}
.uneditable-textarea {
@@ -110,7 +110,7 @@ input[type="file"] {
padding: initial;
line-height: initial;
border: initial;
- background-color: @white;
+ background-color: @inputBackground;
background-color: initial;
.box-shadow(none);
}
@@ -139,7 +139,7 @@ input[type="file"] {
// Chrome on Linux and Mobile Safari need background-color
select {
width: 220px; // default input width + 10px of padding that doesn't get applied
- background-color: @white;
+ background-color: @inputBackground;
}
// Make multiple select elements height not fixed
@@ -253,7 +253,7 @@ textarea[class*="span"],
// GRID SIZING FOR INPUTS
// ----------------------
-#inputGridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
+#grid > .input (@gridColumnWidth, @gridGutterWidth);
@@ -268,7 +268,7 @@ textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
- background-color: #f5f5f5;
+ background-color: @inputDisabledBackground;
border-color: #ddd;
cursor: not-allowed;
}
@@ -301,7 +301,7 @@ select:focus:required:invalid {
border-color: #ee5f5b;
&:focus {
border-color: darken(#ee5f5b, 10%);
- .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
+ .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
}
}
@@ -314,14 +314,15 @@ select:focus:required:invalid {
padding: (@baseLineHeight - 1) 20px @baseLineHeight;
margin-top: @baseLineHeight;
margin-bottom: @baseLineHeight;
- background-color: #f5f5f5;
+ background-color: @grayLighter;
border-top: 1px solid #ddd;
+ .clearfix(); // Adding clearfix to allow for .pull-right button containers
}
// For text that needs to appear as an input but should not be an input
.uneditable-input {
display: block;
- background-color: @white;
+ background-color: @inputBackground;
border-color: #eee;
.box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
cursor: not-allowed;
@@ -335,17 +336,19 @@ select:focus:required:invalid {
// HELP TEXT
// ---------
+.help-block,
+.help-inline {
+ color: @gray; // lighten the text some for contrast
+}
+
.help-block {
display: block; // account for any element using help-block
- margin-top: 5px;
- margin-bottom: 0;
- color: @grayLight;
+ margin-bottom: @baseLineHeight / 2;
}
.help-inline {
display: inline-block;
.ie7-inline-block();
- margin-bottom: 9px;
vertical-align: middle;
padding-left: 5px;
}
@@ -359,9 +362,10 @@ select:focus:required:invalid {
.input-prepend,
.input-append {
margin-bottom: 5px;
- .clearfix(); // Clear the float to prevent wrapping
input,
+ select,
.uneditable-input {
+ *margin-left: 0;
.border-radius(0 3px 3px 0);
&:focus {
position: relative;
@@ -372,20 +376,21 @@ select:focus:required:invalid {
border-left-color: #ccc;
}
.add-on {
- float: left;
- display: block;
+ display: inline-block;
width: auto;
min-width: 16px;
height: @baseLineHeight;
- margin-right: -1px;
padding: 4px 5px;
font-weight: normal;
line-height: @baseLineHeight;
- color: @grayLight;
text-align: center;
text-shadow: 0 1px 0 @white;
- background-color: #f5f5f5;
+ vertical-align: middle;
+ background-color: @grayLighter;
border: 1px solid #ccc;
+ }
+ .add-on,
+ .btn {
.border-radius(3px 0 0 3px);
}
.active {
@@ -394,33 +399,43 @@ select:focus:required:invalid {
}
}
.input-prepend {
- .add-on {
- *margin-top: 1px; /* IE6-7 */
+ .add-on,
+ .btn {
+ margin-right: -1px;
}
}
.input-append {
input,
+ select
.uneditable-input {
- float: left;
.border-radius(3px 0 0 3px);
}
.uneditable-input {
border-left-color: #eee;
- border-right-color: #ccc;
+ border-right-color: #ccc;
}
- .add-on {
- margin-right: 0;
+ .add-on,
+ .btn {
margin-left: -1px;
.border-radius(0 3px 3px 0);
}
- input:first-child {
- // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
- // inherit the sum of its ancestors' margins.
- *margin-left: -160px;
-
- &+.add-on {
- *margin-left: -21px;
- }
+}
+// Remove all border-radius for inputs with both prepend and append
+.input-prepend.input-append {
+ input,
+ select,
+ .uneditable-input {
+ .border-radius(0);
+ }
+ .add-on:first-child,
+ .btn:first-child {
+ margin-right: -1px;
+ .border-radius(3px 0 0 3px);
+ }
+ .add-on:last-child,
+ .btn:last-child {
+ margin-left: -1px;
+ .border-radius(0 3px 3px 0);
}
}
@@ -451,7 +466,9 @@ select:focus:required:invalid {
textarea,
select,
.help-inline,
- .uneditable-input {
+ .uneditable-input,
+ .input-prepend,
+ .input-append {
display: inline-block;
margin-bottom: 0;
}
@@ -461,28 +478,35 @@ select:focus:required:invalid {
}
}
.form-search label,
-.form-inline label,
+.form-inline label {
+ display: inline-block;
+}
+// Remove margin for input-prepend/-append
.form-search .input-append,
.form-inline .input-append,
.form-search .input-prepend,
.form-inline .input-prepend {
- display: inline-block;
-}
-// Make the prepend and append add-on vertical-align: middle;
-.form-search .input-append .add-on,
-.form-inline .input-prepend .add-on,
-.form-search .input-append .add-on,
-.form-inline .input-prepend .add-on {
- vertical-align: middle;
+ margin-bottom: 0;
}
-// Inline checkbox/radio labels
+// Inline checkbox/radio labels (remove padding on left)
.form-search .radio,
-.form-inline .radio,
.form-search .checkbox,
+.form-inline .radio,
.form-inline .checkbox {
+ padding-left: 0;
margin-bottom: 0;
vertical-align: middle;
}
+// Remove float and margin, set to inline-block
+.form-search .radio input[type="radio"],
+.form-search .checkbox input[type="checkbox"],
+.form-inline .radio input[type="radio"],
+.form-inline .checkbox input[type="checkbox"] {
+ float: left;
+ margin-left: 0;
+ margin-right: 3px;
+}
+
// Margin to space out fieldsets
.control-group {
@@ -514,6 +538,15 @@ legend + .control-group {
// Move over all input controls and content
.controls {
margin-left: 160px;
+ /* Super jank IE7 fix to ensure the inputs in .input-append and input-prepend don't inherit the margin of the parent, in this case .controls */
+ *display: inline-block;
+ *margin-left: 0;
+ *padding-left: 20px;
+ }
+ // Remove bottom margin on block level help text since that's accounted for on .control-group
+ .help-block {
+ margin-top: @baseLineHeight / 2;
+ margin-bottom: 0;
}
// Move over buttons in .form-actions to align with .controls
.form-actions {
7 vendor/toolkit/twitter/bootstrap/grid.less
View
@@ -1,8 +1,5 @@
-// GRID SYSTEM
-// -----------
-
// Fixed (940px)
-#gridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
+#grid > .core(@gridColumnWidth, @gridGutterWidth);
// Fluid (940px)
-#fluidGridSystem > .generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth);
+#grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth);
4 vendor/toolkit/twitter/bootstrap/hero-unit.less
View
@@ -4,17 +4,19 @@
.hero-unit {
padding: 60px;
margin-bottom: 30px;
- background-color: #f5f5f5;
+ background-color: @heroUnitBackground;
.border-radius(6px);
h1 {
margin-bottom: 0;
font-size: 60px;
line-height: 1;
+ color: @heroUnitHeadingColor;
letter-spacing: -1px;
}
p {
font-size: 18px;
font-weight: 200;
line-height: @baseLineHeight * 1.5;
+ color: @heroUnitLeadColor;
}
}
10 vendor/toolkit/twitter/bootstrap/labels.less
View
@@ -3,10 +3,13 @@
// Base
.label {
- padding: 2px 4px 3px;
- font-size: @baseFontSize * .85;
+ padding: 1px 4px 2px;
+ font-size: @baseFontSize * .846;
font-weight: bold;
+ line-height: 13px; // ensure proper line-height if floated
color: @white;
+ vertical-align: middle;
+ white-space: nowrap;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
background-color: @grayLight;
.border-radius(3px);
@@ -30,3 +33,6 @@
.label-info { background-color: @infoText; }
.label-info:hover { background-color: darken(@infoText, 10%); }
+
+.label-inverse { background-color: @grayDark; }
+.label-inverse:hover { background-color: darken(@grayDark, 10%); }
356 vendor/toolkit/twitter/bootstrap/mixins.less
View
@@ -98,6 +98,14 @@
white-space: nowrap;
}
+// New image replacement
+// -------------------------
+// Source: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/
+.hide-text {
+ overflow: hidden;
+ text-indent: 100%;
+ white-space: nowrap;
+}
// FONTS
@@ -135,159 +143,19 @@
}
-
-// GRID SYSTEM
+// FORMS
// --------------------------------------------------
-// Site container
-// -------------------------
-.container-fixed() {
- width: @gridRowWidth;
- margin-left: auto;
- margin-right: auto;
- .clearfix();
-}
-
-// Le grid system
-// -------------------------
-#gridSystem {
- // Setup the mixins to be used
- .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, @columns) {
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
- }
- .offset(@gridColumnWidth, @gridGutterWidth, @columns) {
- margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
- }
- .gridColumn(@gridGutterWidth) {
- float: left;
- margin-left: @gridGutterWidth;
- }
- // Take these values and mixins, and make 'em do their thang
- .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth) {
- // Row surrounds the columns
- .row {
- margin-left: @gridGutterWidth * -1;
- .clearfix();
- }
- // Find all .span# classes within .row and give them the necessary properties for grid columns (supported by all browsers back to IE7, thanks @dhg)
- [class*="span"] {
- #gridSystem > .gridColumn(@gridGutterWidth);
- }
- // Default columns
- .span1 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 1); }
- .span2 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 2); }
- .span3 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 3); }
- .span4 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 4); }
- .span5 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 5); }
- .span6 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 6); }
- .span7 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 7); }
- .span8 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 8); }
- .span9 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 9); }
- .span10 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 10); }
- .span11 { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 11); }
- .span12,
- .container { #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 12); }
- // Offset column options
- .offset1 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 1); }
- .offset2 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 2); }
- .offset3 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 3); }
- .offset4 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 4); }
- .offset5 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 5); }
- .offset6 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 6); }
- .offset7 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 7); }
- .offset8 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 8); }
- .offset9 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 9); }
- .offset10 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 10); }
- .offset11 { #gridSystem > .offset(@gridColumnWidth, @gridGutterWidth, 11); }
- }
-}
-
-// Fluid grid system
-// -------------------------
-#fluidGridSystem {
- // Setup the mixins to be used
- .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, @columns) {
- width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
- }
- .gridColumn(@fluidGridGutterWidth) {
- float: left;
- margin-left: @fluidGridGutterWidth;
- }
- // Take these values and mixins, and make 'em do their thang
- .generate(@gridColumns, @fluidGridColumnWidth, @fluidGridGutterWidth) {
- // Row surrounds the columns
- .row-fluid {
- width: 100%;
- .clearfix();
-
- // Find all .span# classes within .row and give them the necessary properties for grid columns (supported by all browsers back to IE7, thanks @dhg)
- > [class*="span"] {
- #fluidGridSystem > .gridColumn(@fluidGridGutterWidth);
- }
- > [class*="span"]:first-child {
- margin-left: 0;
- }
- // Default columns
- > .span1 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 1); }
- > .span2 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 2); }
- > .span3 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 3); }
- > .span4 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 4); }
- > .span5 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 5); }
- > .span6 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 6); }
- > .span7 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 7); }
- > .span8 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 8); }
- > .span9 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 9); }
- > .span10 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 10); }
- > .span11 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 11); }
- > .span12 { #fluidGridSystem > .columns(@fluidGridGutterWidth, @fluidGridColumnWidth, 12); }
- }
- }
-}
-
-// Input grid system
-// -------------------------
-#inputGridSystem {
- .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, @columns) {
- width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
- }
- .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth) {
- input,
- textarea,
- .uneditable-input {
- &.span1 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 1); }
- &.span2 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 2); }
- &.span3 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 3); }
- &.span4 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 4); }
- &.span5 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 5); }
- &.span6 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 6); }
- &.span7 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 7); }
- &.span8 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 8); }
- &.span9 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 9); }
- &.span10 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 10); }
- &.span11 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 11); }
- &.span12 { #inputGridSystem > .inputColumns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, 12); }
- }
- }
-}
-
-// Make a Grid
-// -------------------------
-// Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
-.makeRow() {
- margin-left: @gridGutterWidth * -1;
- .clearfix();
-}
-.makeColumn(@columns: 1) {
- float: left;
- margin-left: @gridGutterWidth;
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
+// Block level inputs
+.input-block-level {
+ display: block;
+ width: 100%;
+ min-height: 28px; /* Make inputs at least the height of their button counterpart */
+ /* Makes inputs behave like true block-level elements */
+ .box-sizing(border-box);
}
-
-// Form field states (used in forms.less)
-// --------------------------------------------------
-
// Mixin for form field states
.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
// Set the text color
@@ -402,6 +270,7 @@
.box-sizing(@boxmodel) {
-webkit-box-sizing: @boxmodel;
-moz-box-sizing: @boxmodel;
+ -ms-box-sizing: @boxmodel;
box-sizing: @boxmodel;
}
@@ -433,7 +302,7 @@
// Opacity
.opacity(@opacity: 100) {
opacity: @opacity / 100;
- filter: e(%("alpha(opacity=%d)", @opacity));
+ filter: ~"alpha(opacity=@{opacity})";
}
@@ -509,8 +378,8 @@
background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
background-image: -ms-radial-gradient(circle, @innerColor, @outerColor);
+ background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
background-repeat: no-repeat;
- // Opera cannot do radial gradients yet
}
.striped(@color, @angle: -45deg) {
background-color: @color;
@@ -519,17 +388,39 @@
background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: -ms-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
- background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, rgba(255,255,255,0) 25%, rgba(255,255,255,0) 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, rgba(255,255,255,0) 75%, rgba(255,255,255,0));
+ background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
}
// Reset filters for IE
.reset-filter() {
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
-// Mixin for generating button backgrounds
-// ---------------------------------------
+
+// COMPONENT MIXINS
+// --------------------------------------------------
+
+// Horizontal dividers
+// -------------------------
+// Dividers (basically an hr) within dropdowns and nav lists
+.nav-divider() {
+ height: 1px;
+ margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px
+ overflow: hidden;
+ background-color: #e5e5e5;
+ border-bottom: 1px solid @white;
+
+ // IE7 needs a set width since we gave a height. Restricting just
+ // to IE7 to keep the 1px left/right space in other browsers.
+ // It is unclear where IE is getting the extra space that we need
+ // to negative-margin away, but so it goes.
+ *width: 100%;
+ *margin: -5px 0 5px;
+}
+
+// Button backgrounds
+// ------------------
.buttonBackground(@startColor, @endColor) {
// gradientBar will set the background to a pleasing blend of these, to support IE<=9
.gradientBar(@startColor, @endColor);
@@ -547,44 +438,177 @@
}
}
+// Navbar vertical align
+// -------------------------
+// Vertically center elements in the navbar.
+// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
+.navbarVerticalAlign(@elementHeight) {
+ margin-top: (@navbarHeight - @elementHeight) / 2;
+}
-// COMPONENT MIXINS
-// --------------------------------------------------
-
-// POPOVER ARROWS
+// Popover arrows
// -------------------------
// For tipsies and popovers
#popoverArrow {
- .top(@arrowWidth: 5px) {
+ .top(@arrowWidth: 5px, @color: @black) {
bottom: 0;
left: 50%;
margin-left: -@arrowWidth;
border-left: @arrowWidth solid transparent;
border-right: @arrowWidth solid transparent;
- border-top: @arrowWidth solid @black;
+ border-top: @arrowWidth solid @color;
}
- .left(@arrowWidth: 5px) {
+ .left(@arrowWidth: 5px, @color: @black) {
top: 50%;
right: 0;
margin-top: -@arrowWidth;
border-top: @arrowWidth solid transparent;
border-bottom: @arrowWidth solid transparent;
- border-left: @arrowWidth solid @black;
+ border-left: @arrowWidth solid @color;
}
- .bottom(@arrowWidth: 5px) {
+ .bottom(@arrowWidth: 5px, @color: @black) {
top: 0;
left: 50%;
margin-left: -@arrowWidth;
border-left: @arrowWidth solid transparent;
border-right: @arrowWidth solid transparent;
- border-bottom: @arrowWidth solid @black;
+ border-bottom: @arrowWidth solid @color;
}
- .right(@arrowWidth: 5px) {
+ .right(@arrowWidth: 5px, @color: @black) {
top: 50%;
left: 0;
margin-top: -@arrowWidth;
border-top: @arrowWidth solid transparent;
border-bottom: @arrowWidth solid transparent;
- border-right: @arrowWidth solid @black;
+ border-right: @arrowWidth solid @color;
}
}
+
+// Grid System
+// -----------
+
+// Centered container element
+.container-fixed() {
+ margin-left: auto;
+ margin-right: auto;
+ .clearfix();
+}
+
+// Table columns
+.tableColumns(@columnSpan: 1) {
+ float: none; // undo default grid column styles
+ width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
+ margin-left: 0; // undo default grid column styles
+}
+
+// Make a Grid
+// Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
+.makeRow() {
+ margin-left: @gridGutterWidth * -1;
+ .clearfix();
+}
+.makeColumn(@columns: 1) {
+ float: left;
+ margin-left: @gridGutterWidth;
+ width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
+}
+
+// The Grid
+#grid {
+
+ .core (@gridColumnWidth, @gridGutterWidth) {
+
+ .spanX (@index) when (@index > 0) {
+ (~".span@{index}") { .span(@index); }
+ .spanX(@index - 1);
+ }
+ .spanX (0) {}
+
+ .offsetX (@index) when (@index > 0) {
+ (~".offset@{index}") { .offset(@index); }
+ .offsetX(@index - 1);
+ }
+ .offsetX (0) {}
+
+ .offset (@columns) {
+ margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
+ }
+
+ .span (@columns) {
+ width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
+ }
+
+ .row {
+ margin-left: @gridGutterWidth * -1;
+ .clearfix();
+ }
+
+ [class*="span"] {
+ float: left;
+ margin-left: @gridGutterWidth;
+ }
+
+ // Set the container width, and override it for fixed navbars in media queries
+ .container,
+ .navbar-fixed-top .container,
+ .navbar-fixed-bottom .container { .span(@gridColumns); }
+
+ // generate .spanX and .offsetX
+ .spanX (@gridColumns);
+ .offsetX (@gridColumns);
+
+ }
+
+ .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
+
+ .spanX (@index) when (@index > 0) {
+ (~"> .span@{index}") { .span(@index); }
+ .spanX(@index - 1);
+ }
+ .spanX (0) {}
+
+ .span (@columns) {
+ width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
+ }
+
+ .row-fluid {
+ width: 100%;
+ .clearfix();
+ > [class*="span"] {
+ float: left;
+ margin-left: @fluidGridGutterWidth;
+ }
+ > [class*="span"]:first-child {
+ margin-left: 0;
+ }
+
+ // generate .spanX
+ .spanX (@gridColumns);
+ }
+
+ }
+
+ .input(@gridColumnWidth, @gridGutterWidth) {
+
+ .spanX (@index) when (@index > 0) {
+ (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
+ .spanX(@index - 1);
+ }
+ .spanX (0) {}
+
+ .span(@columns) {
+ width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
+ }
+
+ input,
+ textarea,
+ .uneditable-input {
+ margin-left: 0; // override margin-left from core grid system
+ }
+
+ // generate .spanX
+ .spanX (@gridColumns);
+
+ }
+
+}
17 vendor/toolkit/twitter/bootstrap/modals.less
View
@@ -33,7 +33,6 @@
top: 50%;
left: 50%;
z-index: @zindexModal;
- max-height: 500px;
overflow: auto;
width: 560px;
margin: -250px 0 0 -280px;
@@ -59,10 +58,12 @@
// Body (where all modal content resises)
.modal-body {
+ overflow-y: auto;
+ max-height: 400px;
padding: 15px;
}
// Remove bottom margin if need be
-.modal-body .modal-form {
+.modal-form {
margin-bottom: 0;
}
@@ -70,14 +71,20 @@
.modal-footer {
padding: 14px 15px 15px;
margin-bottom: 0;
+ text-align: right; // right align buttons
background-color: #f5f5f5;
border-top: 1px solid #ddd;
.border-radius(0 0 6px 6px);
.box-shadow(inset 0 1px 0 @white);
- .clearfix();
- .btn {
- float: right;
+ .clearfix(); // clear it in case folks use .pull-* classes on buttons
+
+ // Properly space out buttons
+ .btn + .btn {
margin-left: 5px;
margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
}
+ // but override that for button groups
+ .btn-group .btn + .btn {
+ margin-left: -1px;
+ }
}
112 vendor/toolkit/twitter/bootstrap/navbar.less
View
@@ -6,6 +6,10 @@
// -------------
.navbar {
+ // Fix for IE7's bad z-indexing so dropdowns don't appear below content that follows the navbar
+ *position: relative;
+ *z-index: 2;
+
overflow: visible;
margin-bottom: @baseLineHeight;
}
@@ -20,6 +24,12 @@
.box-shadow(@shadow);
}
+// Set width to auto for default container
+// We then reset it for fixed navbars in the #gridSystem mixin
+.navbar .container {
+ width: auto;
+}
+
// Navbar button for toggling navbar items in responsive layouts
.btn-navbar {
display: none;
@@ -50,6 +60,7 @@
// Brand, links, text, and buttons
.navbar {
+ color: @navbarText;
// Hover and active states
.brand:hover {
text-decoration: none;
@@ -68,17 +79,12 @@
// Plain text in topbar
.navbar-text {
margin-bottom: 0;
- line-height: 40px;
- color: @navbarText;
- a:hover {
- color: @white;
- background-color: transparent;
- }
+ line-height: @navbarHeight;
}
// Buttons in navbar
.btn,
.btn-group {
- margin-top: 5px; // make buttons vertically centered in navbar
+ .navbarVerticalAlign(30px); // Vertically center in navbar
}
.btn-group .btn {
margin-top: 0; // then undo the margin here so we don't accidentally double it
@@ -90,15 +96,16 @@
margin-bottom: 0; // remove default bottom margin
.clearfix();
input,
+ select,
+ .radio,
+ .checkbox {
+ .navbarVerticalAlign(30px); // Vertically center in navbar
+ }
+ input,
select {
display: inline-block;
- margin-top: 5px;
margin-bottom: 0;
}
- .radio,
- .checkbox {
- margin-top: 5px;
- }
input[type="image"],
input[type="checkbox"],
input[type="radio"] {
@@ -118,36 +125,33 @@
.navbar-search {
position: relative;
float: left;
- margin-top: 6px;
+ .navbarVerticalAlign(28px); // Vertically center in navbar
margin-bottom: 0;
.search-query {
padding: 4px 9px;
#font > .sans-serif(13px, normal, 1);
color: @white;
- color: rgba(255,255,255,.75);
- background: #666;
- background: rgba(255,255,255,.3);
- border: 1px solid #111;
+ background-color: @navbarSearchBackground;
+ border: 1px solid @navbarSearchBorder;
@shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.15);
.box-shadow(@shadow);
.transition(none);
- // Placeholder text gets special styles; can't be bundled together though for some reason
- .placeholder(@grayLighter);
-
- // Hover states
- &:hover {
- color: @white;
- background-color: @grayLight;
- background-color: rgba(255,255,255,.5);
+ // Placeholder text gets special styles; can't be a grouped selector
+ &:-moz-placeholder {
+ color: @navbarSearchPlaceholderColor;
+ }
+ &::-webkit-input-placeholder {
+ color: @navbarSearchPlaceholderColor;
}
+
// Focus states (we use .focused since IE7-8 and down doesn't support :focus)
&:focus,
&.focused {
padding: 5px 10px;
color: @grayDark;
text-shadow: 0 1px 0 @white;
- background-color: @white;
+ background-color: @navbarSearchBackgroundFocus;
border: 0;
.box-shadow(0 0 3px rgba(0,0,0,.15));
outline: 0;
@@ -156,22 +160,42 @@
}
+
// FIXED NAVBAR
// ------------
-.navbar-fixed-top {
+// Shared (top/bottom) styles
+.navbar-fixed-top,
+.navbar-fixed-bottom {
position: fixed;
- top: 0;
right: 0;
left: 0;
z-index: @zindexFixedNavbar;
+ margin-bottom: 0; // remove 18px margin for static navbar
}
-.navbar-fixed-top .navbar-inner {
+.navbar-fixed-top .navbar-inner,
+.navbar-fixed-bottom .navbar-inner {
padding-left: 0;
padding-right: 0;
.border-radius(0);
}
+.navbar-fixed-top .container,
+.navbar-fixed-bottom .container {
+ #grid > .core > .span(@gridColumns);
+}
+
+// Fixed to top
+.navbar-fixed-top {
+ top: 0;
+}
+
+// Fixed to bottom
+.navbar-fixed-bottom {
+ bottom: 0;
+}
+
+
// NAVIGATION
// ----------
@@ -210,9 +234,9 @@
// Active nav items
.navbar .nav .active > a,
.navbar .nav .active > a:hover {
- color: @navbarLinkColorHover;
+ color: @navbarLinkColorActive;
text-decoration: none;
- background-color: @navbarBackground;
+ background-color: @navbarLinkBackgroundActive;
}
// Dividers (basically a vertical hr)
@@ -246,7 +270,7 @@
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #ccc;
- border-bottom-color: rgba(0,0,0,.2);
+ border-bottom-color: @dropdownBorder;
position: absolute;
top: -7px;
left: 9px;
@@ -256,17 +280,33 @@
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
- border-bottom: 6px solid @white;
+ border-bottom: 6px solid @dropdownBackground;
position: absolute;
top: -6px;
left: 10px;
}
}
-
+// Menu position and menu caret support for dropups via extra dropup class
+.navbar-fixed-bottom .dropdown-menu {
+ &:before {
+ border-top: 7px solid #ccc;
+ border-top-color: @dropdownBorder;
+ border-bottom: 0;
+ bottom: -7px;
+ top: auto;
+ }
+ &:after {
+ border-top: 6px solid @dropdownBackground;
+ border-bottom: 0;
+ bottom: -6px;
+ top: auto;
+ }
+}
// Dropdown toggle caret
.navbar .nav .dropdown-toggle .caret,
.navbar .nav .open.dropdown .caret {
border-top-color: @white;
+ border-bottom-color: @white;
}
.navbar .nav .active .caret {
.opacity(100);
@@ -285,7 +325,9 @@
}
// Right aligned menus need alt position
-.navbar .nav.pull-right .dropdown-menu {
+// TODO: rejigger this at some point to simplify the selectors
+.navbar .nav.pull-right .dropdown-menu,
+.navbar .nav .dropdown-menu.pull-right {
left: auto;
right: 0;
&:before {
28 vendor/toolkit/twitter/bootstrap/navs.less
View
@@ -42,8 +42,8 @@
// --------
.nav-list {
- padding-left: 14px;
- padding-right: 14px;
+ padding-left: 15px;
+ padding-right: 15px;
margin-bottom: 0;
}
.nav-list > li > a,
@@ -55,8 +55,8 @@
.nav-list > li > a {
padding: 3px 15px;
}
-.nav-list .active > a,
-.nav-list .active > a:hover {
+.nav-list > .active > a,
+.nav-list > .active > a:hover {
color: @white;
text-shadow: 0 -1px 0 rgba(0,0,0,.2);
background-color: @linkColor;
@@ -64,6 +64,10 @@
.nav-list [class^="icon-"] {
margin-right: 2px;
}
+// Dividers (basically an hr) within the dropdown
+.nav-list .divider {
+ .nav-divider();
+}
@@ -102,8 +106,9 @@
// Actual tabs (as links)
.nav-tabs > li > a {
- padding-top: 9px;
- padding-bottom: 9px;
+ padding-top: 8px;
+ padding-bottom: 8px;
+ line-height: @baseLineHeight;
border: 1px solid transparent;
.border-radius(4px 4px 0 0);
&:hover {
@@ -133,8 +138,8 @@
}
// Active state
-.nav-pills .active > a,
-.nav-pills .active > a:hover {
+.nav-pills > .active > a,
+.nav-pills > .active > a:hover {
color: @white;
background-color: @linkColor;
}
@@ -200,11 +205,13 @@
.nav-tabs .dropdown-toggle .caret,
.nav-pills .dropdown-toggle .caret {
border-top-color: @linkColor;
+ border-bottom-color: @linkColor;
margin-top: 6px;
}
.nav-tabs .dropdown-toggle:hover .caret,
.nav-pills .dropdown-toggle:hover .caret {
border-top-color: @linkColorHover;
+ border-bottom-color: @linkColorHover;
}
// Active dropdown links
@@ -212,6 +219,7 @@
.nav-tabs .active .dropdown-toggle .caret,
.nav-pills .active .dropdown-toggle .caret {
border-top-color: @grayDark;
+ border-bottom-color: @grayDark;
}
// Active:hover dropdown links
@@ -234,6 +242,7 @@
.nav .open.active .caret,
.nav .open a:hover .caret {
border-top-color: @white;
+ border-bottom-color: @white;
.opacity(100);
}
@@ -256,7 +265,8 @@
.clearfix();
}
.tab-content {
- overflow: hidden; // prevent content from running below tabs
+ display: table; // prevent content from running below tabs
+ width: 100%;
}
// Remove border on bottom, left, right
6 vendor/toolkit/twitter/bootstrap/pager.less
View
@@ -28,3 +28,9 @@
.pager .previous a {
float: left;
}
+.pager .disabled a,
+.pager .disabled a:hover {
+ color: @grayLight;
+ background-color: #fff;
+ cursor: default;
+}
1  vendor/toolkit/twitter/bootstrap/pagination.less
View
@@ -32,6 +32,7 @@
color: @grayLight;
cursor: default;
}
+.pagination .disabled span,
.pagination .disabled a,
.pagination .disabled a:hover {
color: @grayLight;
16 vendor/toolkit/twitter/bootstrap/progress-bars.less
View
@@ -17,6 +17,12 @@
to { background-position: 40px 0; }
}
+// IE9
+@-ms-keyframes progress-bar-stripes {
+ from { background-position: 0 0; }
+ to { background-position: 40px 0; }
+}
+
// Spec
@keyframes progress-bar-stripes {
from { background-position: 0 0; }
@@ -54,7 +60,7 @@
// Striped bars
.progress-striped .bar {
- #gradient > .striped(#62c462);
+ #gradient > .striped(#149bdf);
.background-size(40px 40px);
}
@@ -93,3 +99,11 @@
.progress-info.progress-striped .bar {
#gradient > .striped(#5bc0de);
}
+
+// Warning (orange)
+.progress-warning .bar {
+ #gradient > .vertical(lighten(@orange, 15%), @orange);
+}
+.progress-warning.progress-striped .bar {
+ #gradient > .striped(lighten(@orange, 15%));
+}
2  vendor/toolkit/twitter/bootstrap/reset.less
View
@@ -75,10 +75,10 @@ sub {
// -------------------------
img {
- max-width: 100%;
height: auto;
border: 0;
-ms-interpolation-mode: bicubic;
+ vertical-align: middle;
}
// Forms
100 vendor/toolkit/twitter/bootstrap/responsive.less
View
@@ -1,5 +1,5 @@
/*!
- * Bootstrap Responsive v2.0.1
+ * Bootstrap Responsive v2.0.2
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
@@ -31,6 +31,37 @@
visibility: hidden;
}
+// Visibility utilities
+
+// For desktops
+.visible-phone { display: none; }
+.visible-tablet { display: none; }
+.visible-desktop { display: block; }
+.hidden-phone { display: block; }
+.hidden-tablet { display: block; }
+.hidden-desktop { display: none; }
+
+// Phones only
+@media (max-width: 767px) {
+ // Show
+ .visible-phone { display: block; }
+ // Hide
+ .hidden-phone { display: none; }
+ // Hide everything else
+ .hidden-desktop { display: block; }
+ .visible-desktop { display: none; }
+}
+
+// Tablets & small desktops only
+@media (min-width: 768px) and (max-width: 979px) {
+ // Show
+ .visible-tablet { display: block; }
+ // Hide
+ .hidden-tablet { display: none; }
+ // Hide everything else
+ .hidden-desktop { display: block; }
+ .visible-desktop { display: none; }
+}
// UP TO LANDSCAPE PHONE
@@ -49,26 +80,6 @@
line-height: @baseLineHeight;
}
- // Make span* classes full width
- input[class*="span"],
- select[class*="span"],
- textarea[class*="span"],
- .uneditable-input {
- display: block;
- width: 100%;
- min-height: 28px; /* Make inputs at least the height of their button counterpart */
- /* Makes inputs behave like true block-level elements */
- -webkit-box-sizing: border-box; /* Older Webkit */
- -moz-box-sizing: border-box; /* Older FF */
- -ms-box-sizing: border-box; /* IE8 */
- box-sizing: border-box; /* CSS3 spec*/
- }
- // But don't let it screw up prepend/append inputs
- .input-prepend input[class*="span"],
- .input-append input[class*="span"] {
- width: auto;
- }