diff --git a/CHANGELOG.md b/CHANGELOG.md index 62723666..0494a534 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,14 @@ # Changelog +## 2.0.2 +* [#86] Updated to Bootstrap 2.0.2 +Things of note: static navbars now have full width. (to be fixed in 2.0.3) `.navbar-inner > .container { width:940px; }` seems to work in the meanwhile +* [#62] Fixed asset compilation taking a *very* long time. +* [#69, #79, #80] (Hopefully) clarified README. Now with less cat humour. +* [#91] Removed doubled up Sass extensions for Rails. +* [#63, #73] Allow for overriding of image-path +* [[SO](http://stackoverflow.com/a/9909626/241212)] Added makeFluidColumn mixin for defining fluid columns. Fluid rows must use `@extend .row-fluid`, and any column inside it can use `@include makeFluidColumn(num)`, where `num` is the number of columns. Unfortunately, there is a rather major limitation to this: margins on first-child elements must be overriden. See the attached Stack Overflow answer for more information. + ## 2.0.1 * Updated to Bootstrap 2.0.1 * Modified `@mixin opacity()` to take an argument `0...1` rather than `0...100` to be consistent with Compass. diff --git a/README.md b/README.md index e2913fbc..3f87c64e 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -# Bootstrap for SASS +# Bootstrap for Sass -`bootstrap-sass` is an SASS-powered version of [Twitter's Bootstrap](http://github.com/twitter/bootstrap), ready to drop right into your SASS powered applications. +`bootstrap-sass` is an Sass-powered version of [Twitter's Bootstrap](http://github.com/twitter/bootstrap), ready to drop right into your Sass powered applications. Enjoy. @@ -14,24 +14,24 @@ Updating your application to a new version of `bootstrap-sass`? See [our changel In your Gemfile: gem 'sass-rails', '~> 3.1' - gem 'bootstrap-sass', '~> 2.0.1' - -**Note**: previous versions of bootstrap-sass automatically required sass-rails. This is no longer the case, and you will *need* to require it in your Gemfile. + gem 'bootstrap-sass', '~> 2.0.2' #### CSS -Import "bootstrap" in your SCSS file of choice to get all of Bootstrap's styles, mixins and variables! Don't use Sproket's `//= require` directives for SASS files, because they're horrible and will kill your cat. +Import "bootstrap" in your SCSS file of choice to get all of Bootstrap's styles, mixins and variables! We recommend against using `//= require` directives, since none of your other stylesheets will be [able to use](https://github.com/thomas-mcdonald/bootstrap-sass/issues/79#issuecomment-4428595) the awesome mixins that Bootstrap has defined. @import "bootstrap"; -Need to configure a variable or two? Simple define the value of the variable you want to change *before* importing Bootstrap. SASS will be awesome and respect your existing definition rather than overwriting it with the Bootstrap defaults. A list of customisable variables can be found in the [Bootstrap documentation](http://twitter.github.com/bootstrap/less.html#variables). +Need to configure a variable or two? Simple define the value of the variable you want to change *before* importing Bootstrap. Sass will respect your existing definition rather than overwriting it with the Bootstrap defaults. A list of customisable variables can be found in the [Bootstrap documentation](http://twitter.github.com/bootstrap/less.html#variables). $primaryButtonBackground: #f00; @import "bootstrap"; +**Note**: It's important that the file you are importing is not named `bootstrap`, since this will cause an import loop. As a general rule, errors are something you should try to avoid. + #### Javascripts -You can include the Bootstrap javascripts through two methods. In this case, Sproket's `//= require` directives are useful and will not cause feline death. +You can include the Bootstrap javascripts through two methods. In this case, Sprocket's `//= require` directives are useful, since there is no better alternative. We have a helper that includes all available javascripts: diff --git a/bootstrap-sass.gemspec b/bootstrap-sass.gemspec index ae4ad7bd..abd98f30 100644 --- a/bootstrap-sass.gemspec +++ b/bootstrap-sass.gemspec @@ -1,9 +1,9 @@ Gem::Specification.new do |s| s.name = "bootstrap-sass" - s.version = '2.0.1' + s.version = '2.0.2' s.authors = ["Thomas McDonald"] s.email = 'tom@conceptcoding.co.uk' - s.summary = "Twitter's Bootstrap, converted to SASS and ready to drop into Rails or Compass" + s.summary = "Twitter's Bootstrap, converted to Sass and ready to drop into Rails or Compass" s.homepage = "http://github.com/thomas-mcdonald/bootstrap-sass" s.add_development_dependency 'compass' diff --git a/lib/bootstrap-sass.rb b/lib/bootstrap-sass.rb index af202329..05da7051 100644 --- a/lib/bootstrap-sass.rb +++ b/lib/bootstrap-sass.rb @@ -6,8 +6,10 @@ module Bootstrap if rails? require 'sass-rails' # See: https://github.com/thomas-mcdonald/bootstrap-sass/pull/4 require 'bootstrap-sass/engine' + require 'bootstrap-sass/config/sass_extentions' elsif compass? require 'bootstrap-sass/compass_extensions' + require 'bootstrap-sass/config/sass_extentions' base = File.join(File.dirname(__FILE__), '..') styles = File.join(base, 'vendor', 'assets', 'stylesheets') templates = File.join(base, 'templates') diff --git a/lib/bootstrap-sass/config/sass-ie_hex_str.rb b/lib/bootstrap-sass/config/sass-ie_hex_str.rb deleted file mode 100644 index 51bb904f..00000000 --- a/lib/bootstrap-sass/config/sass-ie_hex_str.rb +++ /dev/null @@ -1,14 +0,0 @@ -require 'sass' - -module Sass::Script::Functions - # LARS: Snatched from compass - 2011-11-29 - used for gradients in IE6-9 - # returns an IE hex string for a color with an alpha channel - # suitable for passing to IE filters. - def ie_hex_str(color) - assert_type color, :Color - alpha = (color.alpha * 255).round - alphastr = alpha.to_s(16).rjust(2, '0') - Sass::Script::String.new("##{alphastr}#{color.send(:hex_str)[1..-1]}".upcase) - end - declare :ie_hex_str, [:color] -end \ No newline at end of file diff --git a/lib/bootstrap-sass/engine.rb b/lib/bootstrap-sass/engine.rb index 27c3e92e..4a9e9705 100644 --- a/lib/bootstrap-sass/engine.rb +++ b/lib/bootstrap-sass/engine.rb @@ -3,7 +3,7 @@ module Bootstrap class Engine < ::Rails::Engine # Rails, will you please look in our vendor? kthx # also add our initializer. - paths["config/initializers"] << 'lib/bootstrap-sass/config' + # paths["config/initializers"] << 'lib/bootstrap-sass/config' end end end \ No newline at end of file diff --git a/templates/project/manifest.rb b/templates/project/manifest.rb index 32095d8b..c9e47931 100644 --- a/templates/project/manifest.rb +++ b/templates/project/manifest.rb @@ -1,4 +1,4 @@ -description "Bootstrap for SASS" +description "Bootstrap for Sass" # Stylesheet importing bootstrap stylesheet 'styles.scss' diff --git a/vendor/assets/javascripts/bootstrap-alert.js b/vendor/assets/javascripts/bootstrap-alert.js index 2242dddc..d17f44e1 100644 --- a/vendor/assets/javascripts/bootstrap-alert.js +++ b/vendor/assets/javascripts/bootstrap-alert.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-button.js b/vendor/assets/javascripts/bootstrap-button.js index a0e05354..6b36753d 100644 --- a/vendor/assets/javascripts/bootstrap-button.js +++ b/vendor/assets/javascripts/bootstrap-button.js @@ -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. @@ -91,7 +91,9 @@ $(function () { $('body').on('click.button.data-api', '[data-toggle^=button]', function ( e ) { - $(e.currentTarget).button('toggle') + var $btn = $(e.target) + if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') + $btn.button('toggle') }) }) diff --git a/vendor/assets/javascripts/bootstrap-carousel.js b/vendor/assets/javascripts/bootstrap-carousel.js index 810256e8..8c0723d2 100644 --- a/vendor/assets/javascripts/bootstrap-carousel.js +++ b/vendor/assets/javascripts/bootstrap-carousel.js @@ -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 diff --git a/vendor/assets/javascripts/bootstrap-collapse.js b/vendor/assets/javascripts/bootstrap-collapse.js index d195efc7..9a364468 100644 --- a/vendor/assets/javascripts/bootstrap-collapse.js +++ b/vendor/assets/javascripts/bootstrap-collapse.js @@ -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 ) { diff --git a/vendor/assets/javascripts/bootstrap-dropdown.js b/vendor/assets/javascripts/bootstrap-dropdown.js index f1f6c33f..54b61c5e 100644 --- a/vendor/assets/javascripts/bootstrap-dropdown.js +++ b/vendor/assets/javascripts/bootstrap-dropdown.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-modal.js b/vendor/assets/javascripts/bootstrap-modal.js index bceb3035..e9297062 100644 --- a/vendor/assets/javascripts/bootstrap-modal.js +++ b/vendor/assets/javascripts/bootstrap-modal.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-popover.js b/vendor/assets/javascripts/bootstrap-popover.js index 924844e8..e1aa5ac3 100644 --- a/vendor/assets/javascripts/bootstrap-popover.js +++ b/vendor/assets/javascripts/bootstrap-popover.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-scrollspy.js b/vendor/assets/javascripts/bootstrap-scrollspy.js index 5f09cfe8..ea29f2f8 100644 --- a/vendor/assets/javascripts/bootstrap-scrollspy.js +++ b/vendor/assets/javascripts/bootstrap-scrollspy.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-tab.js b/vendor/assets/javascripts/bootstrap-tab.js index 26c9ece7..b3938f67 100644 --- a/vendor/assets/javascripts/bootstrap-tab.js +++ b/vendor/assets/javascripts/bootstrap-tab.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-tooltip.js b/vendor/assets/javascripts/bootstrap-tooltip.js index d76e51e8..49b5f728 100644 --- a/vendor/assets/javascripts/bootstrap-tooltip.js +++ b/vendor/assets/javascripts/bootstrap-tooltip.js @@ -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 } diff --git a/vendor/assets/javascripts/bootstrap-transition.js b/vendor/assets/javascripts/bootstrap-transition.js index 52196c40..f5226f96 100644 --- a/vendor/assets/javascripts/bootstrap-transition.js +++ b/vendor/assets/javascripts/bootstrap-transition.js @@ -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. diff --git a/vendor/assets/javascripts/bootstrap-typeahead.js b/vendor/assets/javascripts/bootstrap-typeahead.js index 50315595..dc2f8822 100644 --- a/vendor/assets/javascripts/bootstrap-typeahead.js +++ b/vendor/assets/javascripts/bootstrap-typeahead.js @@ -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) } diff --git a/vendor/assets/stylesheets/_bootstrap-responsive.scss b/vendor/assets/stylesheets/_bootstrap-responsive.scss index 8d7aa9cf..c7e64099 100644 --- a/vendor/assets/stylesheets/_bootstrap-responsive.scss +++ b/vendor/assets/stylesheets/_bootstrap-responsive.scss @@ -1,14 +1,3 @@ -/*! - * Bootstrap Responsive v2.0.1 - * - * Copyright 2012 Twitter, Inc - * Licensed under the Apache License v2.0 - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Converted to SASS by Thomas McDonald - */ - // Responsive.css.scss // For phone and tablet devices // ------------------------------------------------------------- @@ -32,7 +21,36 @@ 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 // --------------------- @@ -50,22 +68,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; - } - // Update checkboxes for iOS input[type="checkbox"], input[type="radio"] { border: 1px solid #ccc; @@ -120,12 +122,22 @@ // -------------------------------------------------- @media (max-width: 767px) { + + // Padding to set content in a bit + body { + padding-left: 20px; + padding-right: 20px; + } + .navbar-fixed-top { + margin-left: -20px; + margin-right: -20px; + } + // GRID & CONTAINERS // ----------------- // Remove width from containers .container { width: auto; - padding: 0 20px; } // Fluid rows .row-fluid { @@ -142,6 +154,23 @@ width: auto; margin: 0; } + + // THUMBNAILS + // ---------- + .thumbnails [class*="span"] { + width: auto; + } + + // FORM FIELDS + // ----------- + // Make span* classes full width + input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input { + @include input-block-level(); + } + // But don't let it screw up prepend/append inputs + .input-prepend input[class*="span"], .input-append input[class*="span"] { + width: auto; + } } @@ -152,13 +181,13 @@ @media (min-width: 768px) and (max-width: 979px) { // Fixed grid - @include gridSystemGenerate(12, 42px, 20px); + @include gridCore(42px, 20px); // Fluid grid - @include fluidGridSystemGenerate(12, 5.801104972%, 2.762430939%); + @include gridFluid(5.801104972%, 2.762430939%); // Input grid - @include inputGridSystemGenerate(12, 42px, 20px); + @include gridInput(42px, 20px); } @@ -288,6 +317,7 @@ @media (min-width: 980px) { .nav-collapse.collapse { height: auto !important; + overflow: visible !important; } } @@ -299,13 +329,13 @@ @media (min-width: 1200px) { // Fixed grid - @include gridSystemGenerate(12, 70px, 30px); + @include gridCore(70px, 30px); // Fluid grid - @include fluidGridSystemGenerate(12, 5.982905983%, 2.564102564%); + @include gridFluid(5.982905983%, 2.564102564%); // Input grid - @include inputGridSystemGenerate(12, 70px, 30px); + @include gridInput(70px, 30px); // Thumbnails .thumbnails { diff --git a/vendor/assets/stylesheets/_bootstrap.scss b/vendor/assets/stylesheets/_bootstrap.scss index e3b60c6b..b754748b 100644 --- a/vendor/assets/stylesheets/_bootstrap.scss +++ b/vendor/assets/stylesheets/_bootstrap.scss @@ -1,14 +1,3 @@ -/*! - * Bootstrap 2.0.1 - * - * Copyright 2012 Twitter, Inc - * Licensed under the Apache License v2.0 - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Converted to SASS by Thomas McDonald - */ - // Core variables and mixins @import "bootstrap/variables"; // Modify this for custom colors, font-sizes, etc @import "bootstrap/mixins"; @@ -54,6 +43,7 @@ // Components: Misc @import "bootstrap/thumbnails"; @import "bootstrap/labels"; +@import "bootstrap/badges"; @import "bootstrap/progress-bars"; @import "bootstrap/accordion"; @import "bootstrap/carousel"; diff --git a/vendor/assets/stylesheets/bootstrap/_alerts.scss b/vendor/assets/stylesheets/bootstrap/_alerts.scss index a219ab9a..ac8caa36 100644 --- a/vendor/assets/stylesheets/bootstrap/_alerts.scss +++ b/vendor/assets/stylesheets/bootstrap/_alerts.scss @@ -9,10 +9,11 @@ background-color: $warningBackground; border: 1px solid $warningBorder; @include border-radius(4px); -} -.alert, .alert-heading { color: $warningText; } +.alert-heading { + color: inherit; +} // Adjust close link position .alert .close { @@ -28,26 +29,19 @@ .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 { diff --git a/vendor/assets/stylesheets/bootstrap/_badges.scss b/vendor/assets/stylesheets/bootstrap/_badges.scss new file mode 100644 index 00000000..936c7570 --- /dev/null +++ b/vendor/assets/stylesheets/bootstrap/_badges.scss @@ -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; + @include 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%); } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss b/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss index 2effdeb6..a9c21177 100644 --- a/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss +++ b/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss @@ -4,12 +4,14 @@ .breadcrumb { padding: 7px 14px; margin: 0 0 $baseLineHeight; + list-style: none; @include gradient-vertical($white, #f5f5f5); border: 1px solid #ddd; @include border-radius(3px); @include box-shadow(inset 0 1px 0 $white); li { display: inline-block; + @include ie7-inline-block(); text-shadow: 0 1px 0 $white; } .divider { diff --git a/vendor/assets/stylesheets/bootstrap/_button-groups.scss b/vendor/assets/stylesheets/bootstrap/_button-groups.scss index 771d54df..f3ecb7fc 100644 --- a/vendor/assets/stylesheets/bootstrap/_button-groups.scss +++ b/vendor/assets/stylesheets/bootstrap/_button-groups.scss @@ -89,8 +89,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); @include 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 { @@ -120,17 +134,25 @@ .btn:hover .caret, .open.btn-group .caret { @include opacity(1); } - +// 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-danger, .btn-info, .btn-success, .btn-inverse { +.btn-primary, .btn-warning, .btn-danger, .btn-info, .btn-success, .btn-inverse { .caret { border-top-color: $white; + border-bottom-color: $white; @include opacity(0.75); } -} - -// Small button dropdowns -.btn-small .caret { - margin-top: 4px; -} +} \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_buttons.scss b/vendor/assets/stylesheets/bootstrap/_buttons.scss index da51df9e..b771cd61 100644 --- a/vendor/assets/stylesheets/bootstrap/_buttons.scss +++ b/vendor/assets/stylesheets/bootstrap/_buttons.scss @@ -8,6 +8,7 @@ // Core .btn { display: inline-block; + @include 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; - @include buttonBackground($white, darken($white, 10%)); - border: 1px solid #ccc; - border-bottom-color: #bbb; + @include buttonBackground($btnBackground, $btnBackgroundHighlight); + border: 1px solid $btnBorder; + border-bottom-color: darken($btnBorder, 10%); @include border-radius(4px); $shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05); @include box-shadow($shadow); cursor: pointer; // Give IE7 some love - @include reset-filter(); @include ie7-restore-left-whitespace(); } @@ -115,26 +115,26 @@ // Set the backgrounds // ------------------------- .btn-primary { - @include buttonBackground($primaryButtonBackground, adjust-hue($primaryButtonBackground, 20)); + @include buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight); } // Warning appears are orange .btn-warning { - @include buttonBackground(lighten($orange, 15%), $orange); + @include buttonBackground($btnWarningBackground, $btnWarningBackgroundHighlight); } // Danger and error appear as red .btn-danger { - @include buttonBackground(#ee5f5b, #bd362f); + @include buttonBackground($btnDangerBackground, $btnDangerBackgroundHighlight); } // Success appears as green .btn-success { - @include buttonBackground(#62c462, #51a351); + @include buttonBackground($btnSuccessBackground, $btnSuccessBackgroundHighlight); } // Info appears as a neutral blue .btn-info { - @include buttonBackground(#5bc0de, #2f96b4); + @include buttonBackground($btnInfoBackground, $btnInfoBackgroundHighlight); } .btn-inverse { - @include buttonBackground(#454545, #262626); + @include buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight); } @@ -152,12 +152,16 @@ button.btn, 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; + } } diff --git a/vendor/assets/stylesheets/bootstrap/_code.scss b/vendor/assets/stylesheets/bootstrap/_code.scss index 482040ec..d6ca6ea2 100644 --- a/vendor/assets/stylesheets/bootstrap/_code.scss +++ b/vendor/assets/stylesheets/bootstrap/_code.scss @@ -13,7 +13,7 @@ code, pre { // Inline code code { - padding: 3px 4px; + padding: 2px 4px; color: #d14; background-color: #f7f7f9; border: 1px solid #e1e1e8; @@ -24,7 +24,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 diff --git a/vendor/assets/stylesheets/bootstrap/_component-animations.scss b/vendor/assets/stylesheets/bootstrap/_component-animations.scss index 186f121d..d573a013 100644 --- a/vendor/assets/stylesheets/bootstrap/_component-animations.scss +++ b/vendor/assets/stylesheets/bootstrap/_component-animations.scss @@ -14,5 +14,7 @@ position:relative; overflow:hidden; height: 0; - &.in { height: auto; } + &.in { + height: auto; + } } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_dropdowns.scss b/vendor/assets/stylesheets/bootstrap/_dropdowns.scss index 085b5c3f..18d101ba 100644 --- a/vendor/assets/stylesheets/bootstrap/_dropdowns.scss +++ b/vendor/assets/stylesheets/bootstrap/_dropdowns.scss @@ -12,22 +12,22 @@ .dropdown-toggle:active, .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; @include opacity(0.3); - content: "\2193"; + content: ""; } + +// Place the caret .dropdown .caret { margin-top: 8px; margin-left: 2px; @@ -35,7 +35,9 @@ .dropdown:hover .caret, .open.dropdown .caret { @include opacity(1); } + // The dropdown menu (ul) +// ---------------------- .dropdown-menu { position: absolute; top: 100%; @@ -44,11 +46,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; @@ -61,27 +62,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; + @include nav-divider(); } // Links within the dropdown menu @@ -91,19 +80,21 @@ 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 @@ -119,7 +110,33 @@ } } +// 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 @include border-radius(4px); diff --git a/vendor/assets/stylesheets/bootstrap/_forms.scss b/vendor/assets/stylesheets/bootstrap/_forms.scss index 8c7aa423..bf1f31e9 100644 --- a/vendor/assets/stylesheets/bootstrap/_forms.scss +++ b/vendor/assets/stylesheets/bootstrap/_forms.scss @@ -42,7 +42,7 @@ label, input, button, select, textarea { } input, button, select, textarea { - @include 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 @@ -62,7 +62,7 @@ input, textarea, select, .uneditable-input { font-size: $baseFontSize; line-height: $baseLineHeight; color: $gray; - border: 1px solid #ccc; + border: 1px solid $inputBorder; @include border-radius(3px); } .uneditable-textarea { @@ -97,7 +97,7 @@ input[type="file"] { padding: initial; line-height: initial; border: initial; - background-color: $white; + background-color: $inputBackground; background-color: initial; @include box-shadow(none); } @@ -123,7 +123,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 @@ -223,7 +223,7 @@ input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditabl // GRID SIZING FOR INPUTS // ---------------------- -@include inputGridSystemGenerate($gridColumns, $gridColumnWidth, $gridGutterWidth); +@include gridInput($gridColumnWidth, $gridGutterWidth); @@ -233,7 +233,7 @@ input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditabl // Disabled and read-only inputs input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] { - background-color: #f5f5f5; + background-color: $inputDisabledBackground; border-color: #ddd; cursor: not-allowed; } @@ -277,14 +277,15 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ padding: ($baseLineHeight - 1) 20px $baseLineHeight; margin-top: $baseLineHeight; margin-bottom: $baseLineHeight; - background-color: #f5f5f5; + background-color: $grayLighter; border-top: 1px solid #ddd; + @include 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; @include box-shadow(inset 0 1px 2px rgba(0,0,0,.025)); cursor: not-allowed; @@ -298,17 +299,18 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ // HELP TEXT // --------- +.help-block, .help-inline { + color: $gray; // lighten the text for some 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; @include ie7-inline-block(); - margin-bottom: 9px; vertical-align: middle; padding-left: 5px; } @@ -321,8 +323,8 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ // Allow us to put symbols and text within the input field for a cleaner look .input-prepend, .input-append { margin-bottom: 5px; - @include clearfix(); // Clear the float to prevent wrapping - input, .uneditable-input { + input, select, .uneditable-input { + *margin-left: 0; @include border-radius(0 3px 3px 0); &:focus { position: relative; @@ -334,20 +336,20 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ border-right-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 { @include border-radius(3px 0 0 3px); } .active { @@ -356,31 +358,34 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ } } .input-prepend { - .add-on { - *margin-top: 1px; /* IE6-7 */ + .add-on, .btn { + margin-right: -1px; } } .input-append { - input, .uneditable-input { - float: left; + input, select, .uneditable-input { @include border-radius(3px 0 0 3px); } .uneditable-input { border-right-color: #ccc; } - .add-on { - margin-right: 0; + .add-on, .btn { margin-left: -1px; @include 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 { + @include border-radius(0); + } + .add-on:first-child, .btn:first-child { + margin-right: -1px; + @include border-radius(3px 0 0 3px); + } + .add-on:last-child, .btn:last-child { + margin-left: -1px; + @include border-radius(0 3px 3px 0); } } @@ -405,25 +410,34 @@ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:requ // ----------------- .form-search, .form-inline, .form-horizontal { - input, textarea, select, .help-inline, .uneditable-input { + input, textarea, select, .help-inline, .uneditable-input, .input-prepend, .input-append { display: inline-block; margin-bottom: 0; } // Re-hide elemnts due to specifity .hide { display: none; } } -.form-search label, .form-inline label, .form-search .input-append, .form-inline .input-append, .form-search .input-prepend, .form-inline .input-prepend { +.form-search label, .form-inline label { 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; +// Remove margin for input-prepend/-append +.form-search .input-append, .form-inline .input-append, .form-search .input-prepend, .form-inline .input-prepend { + margin-bottom: 0; } -// Inline checkbox/radio labels -.form-search .radio, .form-inline .radio, .form-search .checkbox, .form-inline .checkbox { +// Inline checkbox/radio labels (remove padding on left) +.form-search .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 { @@ -455,6 +469,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 { diff --git a/vendor/assets/stylesheets/bootstrap/_grid.scss b/vendor/assets/stylesheets/bootstrap/_grid.scss index d29b7aa5..49cd48fc 100644 --- a/vendor/assets/stylesheets/bootstrap/_grid.scss +++ b/vendor/assets/stylesheets/bootstrap/_grid.scss @@ -1,8 +1,5 @@ -// GRID SYSTEM -// ----------- - // Fixed (940px) -@include gridSystemGenerate($gridColumns, $gridColumnWidth, $gridGutterWidth); +@include gridCore($gridColumnWidth, $gridGutterWidth); // Fluid (940px) -@include fluidGridSystemGenerate($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth); \ No newline at end of file +@include gridFluid($fluidGridColumnWidth, $fluidGridGutterWidth); \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_hero-unit.scss b/vendor/assets/stylesheets/bootstrap/_hero-unit.scss index 7184ffb1..d2690a30 100644 --- a/vendor/assets/stylesheets/bootstrap/_hero-unit.scss +++ b/vendor/assets/stylesheets/bootstrap/_hero-unit.scss @@ -4,17 +4,19 @@ .hero-unit { padding: 60px; margin-bottom: 30px; - background-color: #f5f5f5; + background-color: $heroUnitBackground; @include 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; } } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_labels.scss b/vendor/assets/stylesheets/bootstrap/_labels.scss index 6e4c22db..721a3c78 100644 --- a/vendor/assets/stylesheets/bootstrap/_labels.scss +++ b/vendor/assets/stylesheets/bootstrap/_labels.scss @@ -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; @include border-radius(3px); @@ -29,4 +32,7 @@ .label-success:hover { background-color: darken($successText, 10%); } .label-info { background-color: $infoText; } -.label-info:hover { background-color: darken($infoText, 10%); } \ No newline at end of file +.label-info:hover { background-color: darken($infoText, 10%); } + +.label-inverse { background-color: $grayDark; } +.label-inverse:hover { background-color: darken($grayDark, 10%); } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_mixins.scss b/vendor/assets/stylesheets/bootstrap/_mixins.scss index 1731051a..50869d2a 100644 --- a/vendor/assets/stylesheets/bootstrap/_mixins.scss +++ b/vendor/assets/stylesheets/bootstrap/_mixins.scss @@ -98,6 +98,15 @@ white-space: nowrap; } +// New image replacement +// ------------------------- +// Source: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/ +@mixin hide-text() { + overflow: hidden; + text-indent: 100%; + white-space: nowrap; +} + // FONTS // -------------------------------------------------- @@ -130,114 +139,17 @@ -// GRID SYSTEM +// FORMS // -------------------------------------------------- -// Site container -// ------------------------- -@mixin container-fixed() { - width: $gridRowWidth; - margin-left: auto; - margin-right: auto; - @include clearfix(); +@mixin 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 */ + @include box-sizing(border-box); } -// Le grid system -// ------------------------- - -// Setup the mixins to be used -@mixin gridSystemColumns($gridGutterWidth, $gridColumnWidth, $gridRowWidth, $columns) { - width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)); -} -@mixin gridSystemOffset($gridColumnWidth, $gridGutterWidth, $columns) { - margin-left: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)) + ($gridGutterWidth * 2); -} -@mixin gridSystemGridColumn($gridGutterWidth) { - float: left; - margin-left: $gridGutterWidth; -} -// Take these values and mixins, and make 'em do their thang -@mixin gridSystemGenerate($gridColumns, $gridColumnWidth, $gridGutterWidth) { - // Row surrounds the columns - .row { - margin-left: $gridGutterWidth * -1; - @include 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"] { - @include gridSystemGridColumn($gridGutterWidth); - } - // Default columns - @for $i from 1 through $gridColumns { - .span#{$i} { @include gridSystemColumns($gridGutterWidth, $gridColumnWidth, $gridRowWidth, $i) } - } - .container { @include gridSystemColumns($gridGutterWidth, $gridColumnWidth, $gridRowWidth, $gridColumns) } - - // Offset column options - @for $i from 1 through $gridColumns - 1 { - .offset#{$i} { @include gridSystemOffset($gridColumnWidth, $gridGutterWidth, $i) } - } -} - -// Fluid grid system -// ------------------------- -@mixin fluidGridSystemColumns($fluidGridGutterWidth, $fluidGridColumnWidth, $columns) { - width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)); -} -@mixin fluidGridSystemGridColumn($fluidGridGutterWidth) { - float: left; - margin-left: $fluidGridGutterWidth; -} -// Take these values and mixins, and make 'em do their thang -@mixin fluidGridSystemGenerate($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth) { - // Row surrounds the columns - .row-fluid { - width: 100%; - @include 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"] { - @include fluidGridSystemGridColumn($fluidGridGutterWidth); - } - > [class*="span"]:first-child { - margin-left: 0; - } - // Default columns - @for $i from 1 through $gridColumns { - > .span#{$i} { @include fluidGridSystemColumns($fluidGridGutterWidth, $fluidGridColumnWidth, $i); } - } - } -} - -// Input grid system -// ------------------------- -@mixin inputGridSystemInputColumns($gridGutterWidth, $gridColumnWidth, $gridRowWidth, $columns) { - width: (($gridColumnWidth) * $columns) + ($gridGutterWidth * ($columns - 1)) - 10; -} -@mixin inputGridSystemGenerate($gridColumns, $gridColumnWidth, $gridGutterWidth) { - input, textarea, .uneditable-input { - @for $i from 1 through $gridColumns { - &.span#{$i} { @include inputGridSystemInputColumns($gridGutterWidth, $gridColumnWidth, $gridRowWidth, $i); } - } - } -} - -// Make a grid -// ------------------------- -// Use makeRow() and makeColumn() to assign semantic layouts grid system behaviour -@mixin makeRow() { - margin-left: $gridGutterWidth * -1; - @include clearfix(); -} -@mixin makeColumn($columns: 1) { - float: left; - margin-left: $gridGutterWidth; - width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)); -} - - -// Form field states (used in forms.less) -// -------------------------------------------------- // Mixin for form field states @mixin formFieldState($textColor: #555, $borderColor: #ccc, $backgroundColor: #f5f5f5) { @@ -349,6 +261,7 @@ @mixin box-sizing($boxmodel) { -webkit-box-sizing: $boxmodel; -moz-box-sizing: $boxmodel; + -ms-box-sizing: $boxmodel; box-sizing: $boxmodel; } @@ -453,8 +366,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 } @mixin gradient-striped($color, $angle: -45deg) { background-color: $color; @@ -471,8 +384,29 @@ } -// Mixin for generating button backgrounds -// --------------------------------------- +// COMPONENT MIXINS +// -------------------------------------------------- + +// Horizontal dividers +// ------------------- +// Dividers (basically an hr) within dropdowns and nav lists +@mixin 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 +// ------------------ @mixin buttonBackground($startColor, $endColor) { // gradientBar will set the background to a pleasing blend of these, to support IE<=9 @include gradientBar($startColor, $endColor); @@ -489,42 +423,150 @@ } } +// 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. +@mixin navbarVerticalAlign($elementHeight) { + margin-top: ($navbarHeight - $elementHeight) / 2; +} -// COMPONENT MIXINS -// -------------------------------------------------- - -// POPOVER ARROWS +// Popover arrows // ------------------------- // For tipsies and popovers -@mixin popoverArrowTop($arrowWidth: 5px) { +@mixin popoverArrowTop($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; } -@mixin popoverArrowLeft($arrowWidth: 5px) { +@mixin popoverArrowLeft($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; } -@mixin popoverArrowBottom($arrowWidth: 5px) { +@mixin popoverArrowBottom($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; } -@mixin popoverArrowRight($arrowWidth: 5px) { +@mixin popoverArrowRight($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 +@mixin container-fixed() { + margin-left: auto; + margin-right: auto; + @include clearfix(); +} + +// Table columns +@mixin 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 +@mixin makeRow() { + margin-left: $gridGutterWidth * -1; + @include clearfix(); +} +@mixin makeColumn($columns: 1) { + float: left; + margin-left: $gridGutterWidth; + width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)); +} + +// The Grid +@mixin gridCore($gridColumnWidth, $gridGutterWidth) { + [class*="span"] { + float: left; + margin-left: $gridGutterWidth; + } + + @for $i from 1 through $gridColumns { + .span#{$i} { @include gridCoreSpan($i, $gridColumnWidth, $gridGutterWidth) } + } + + @for $i from 1 through $gridColumns { + .offset#{$i} { @include gridCoreOffset($i, $gridColumnWidth, $gridGutterWidth) } + } + + .row { + margin-left: $gridGutterWidth * -1; + @include clearfix(); + } + + .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { + @include gridCoreSpan($gridColumns, $gridColumnWidth, $gridGutterWidth); + } +} + +@mixin gridCoreSpan($columns, $gridColumnWidth, $gridGutterWidth) { + width: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)); +} + +@mixin gridCoreOffset($columns, $gridColumnWidth, $gridGutterWidth) { + margin-left: ($gridColumnWidth * $columns) + ($gridGutterWidth * ($columns - 1)) + ($gridGutterWidth * 2); +} + +@mixin gridFluid($fluidGridColumnWidth, $fluidGridGutterWidth) { + .row-fluid { + width: 100%; + @include clearfix(); + > [class*="span"] { + float: left; + margin-left: $fluidGridGutterWidth; + } + > [class*="span"]:first-child { + margin-left: 0; + } + @for $i from 1 through $gridColumns { + > .span#{$i} { @include gridFluidSpan($i, $fluidGridColumnWidth, $fluidGridGutterWidth); } + } + } +} + +@mixin gridFluidSpan($columns, $fluidGridColumnWidth, $fluidGridGutterWidth) { + width: ($fluidGridColumnWidth * $columns) + ($fluidGridGutterWidth * ($columns - 1)); +} + +@mixin gridInput($gridColumnWidth, $gridGutterWidth) { + @for $i from 1 through $gridColumns { + input.span#{$i}, textarea.span#{$i}, .uneditable-input.span#{$i} { @include gridInputSpan($i, $gridColumnWidth, $gridGutterWidth); } + } + + input, textarea, .uneditable-input { + margin-left: 0; // override margin-left from core grid system + } +} + +@mixin gridInputSpan($columns, $gridColumWidth, $gridGutterWidth) { + width: (($gridColumnWidth) * $columns) + ($gridGutterWidth * ($columns - 1)) - 10; +} + +@mixin makeFluidColumn($columns) { + // This isn't perfect, but it's better than nothing. + float: left; + margin-left: $fluidGridGutterWidth; + @include gridFluidSpan($columns, $fluidGridColumnWidth, $fluidGridGutterWidth); +} \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_modals.scss b/vendor/assets/stylesheets/bootstrap/_modals.scss index 0e80951b..2ad15856 100644 --- a/vendor/assets/stylesheets/bootstrap/_modals.scss +++ b/vendor/assets/stylesheets/bootstrap/_modals.scss @@ -32,7 +32,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 resides) .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; @include border-radius(0 0 6px 6px); @include box-shadow(inset 0 1px 0 $white); - @include clearfix(); - .btn { - float: right; + @include 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; + } } diff --git a/vendor/assets/stylesheets/bootstrap/_navbar.scss b/vendor/assets/stylesheets/bootstrap/_navbar.scss index 305dbd9a..0de839e7 100644 --- a/vendor/assets/stylesheets/bootstrap/_navbar.scss +++ b/vendor/assets/stylesheets/bootstrap/_navbar.scss @@ -6,6 +6,10 @@ // ------------- .navbar { + // Fix for IE7's bad 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 @@ @include 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,16 +79,11 @@ // 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 + @include navbarVerticalAlign(30px); // Vertically center in navbar } .btn-group .btn { margin-top: 0; // then undo the margin here so we don't accidentally double it @@ -88,14 +94,13 @@ .navbar-form { margin-bottom: 0; // remove default bottom margin @include clearfix(); + input, select, .radio, .checkbox { + @include 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"] { margin-top: 3px; } @@ -112,35 +117,32 @@ .navbar-search { position: relative; float: left; - margin-top: 6px; + @include navbarVerticalAlign(28px); // Vertically center in navbar margin-bottom: 0; .search-query { padding: 4px 9px; @include 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); @include box-shadow($shadow); @include transition(none); - // Placeholder text gets special styles; can't be bundled together though for some reason - @include 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; @include box-shadow(0 0 3px rgba(0,0,0,.15)); outline: 0; @@ -152,19 +154,28 @@ // 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 navbars } -.navbar-fixed-top .navbar-inner { +.navbar-fixed-top .navbar-inner, .navbar-fixed-bottom .navbar-inner { padding-left: 0; padding-right: 0; @include border-radius(0); } +.navbar-fixed-top .container, .navbar-fixed-bottom .container { + @include gridCoreSpan($gridColumns, $gridColumnWidth, $gridGutterWidth); +} + +// Fixed to top +.navbar-fixed-top { top: 0; } +.navbar-fixed-bottom { bottom: 0; } + // NAVIGATION // ---------- @@ -202,9 +213,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) @@ -238,7 +249,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: $dropdownBackground; position: absolute; top: -7px; left: 9px; @@ -255,9 +266,27 @@ } } +// 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 { @include opacity(1); @@ -274,7 +303,8 @@ } // 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 { diff --git a/vendor/assets/stylesheets/bootstrap/_navs.scss b/vendor/assets/stylesheets/bootstrap/_navs.scss index 27623aa5..05493463 100644 --- a/vendor/assets/stylesheets/bootstrap/_navs.scss +++ b/vendor/assets/stylesheets/bootstrap/_navs.scss @@ -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, .nav-list .nav-header { @@ -54,7 +54,7 @@ .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; @@ -62,6 +62,10 @@ .nav-list [class^="icon-"] { margin-right: 2px; } +// Dividers (basically an hr) within the dropdown +.nav-list .divider { + @include nav-divider(); +} @@ -97,8 +101,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; @include border-radius(4px 4px 0 0); &:hover { @@ -191,16 +196,19 @@ // Make carets use linkColor to start .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 // ------------------------- .nav-tabs .active .dropdown-toggle .caret, .nav-pills .active .dropdown-toggle .caret { border-top-color: $grayDark; + border-bottom-color: $grayDark; } // Active:hover dropdown links @@ -219,6 +227,7 @@ } .nav .open .caret, .nav .open.active .caret, .nav .open a:hover .caret { border-top-color: $white; + border-bottom-color: $white; @include opacity(1); } @@ -241,7 +250,8 @@ @include 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 diff --git a/vendor/assets/stylesheets/bootstrap/_pager.scss b/vendor/assets/stylesheets/bootstrap/_pager.scss index ee6afefb..3258eb99 100644 --- a/vendor/assets/stylesheets/bootstrap/_pager.scss +++ b/vendor/assets/stylesheets/bootstrap/_pager.scss @@ -27,4 +27,9 @@ } .pager .previous a { float: left; +} +.pager .disabled a, .pager .disabled a:hover { + color: $grayLight; + background-color: #fff; + cursor: default; } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_pagination.scss b/vendor/assets/stylesheets/bootstrap/_pagination.scss index 105c710c..8e739d44 100644 --- a/vendor/assets/stylesheets/bootstrap/_pagination.scss +++ b/vendor/assets/stylesheets/bootstrap/_pagination.scss @@ -31,7 +31,7 @@ color: $grayLight; cursor: default; } -.pagination .disabled a, .pagination .disabled a:hover { +.pagination .disabled span, .pagination .disabled a, .pagination .disabled a:hover { color: $grayLight; background-color: transparent; cursor: default; diff --git a/vendor/assets/stylesheets/bootstrap/_progress-bars.scss b/vendor/assets/stylesheets/bootstrap/_progress-bars.scss index 567a1a59..a6f74c3d 100644 --- a/vendor/assets/stylesheets/bootstrap/_progress-bars.scss +++ b/vendor/assets/stylesheets/bootstrap/_progress-bars.scss @@ -17,6 +17,11 @@ to { background-position: 40px 0; } } +@-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 +59,7 @@ // Striped bars .progress-striped .bar { - @include gradient-striped(#62c462); + @include gradient-striped(#149bdf); @include background-size(40px 40px); } @@ -92,4 +97,13 @@ } .progress-info.progress-striped .bar { @include gradient-striped(#5bc0de); +} + +// Warning (orange) +.progress-warning .bar { + @include gradient-vertical(lighten($orange, 15%), $orange); +} + +.progress-warning.progress-striped .bar { + @include gradient-striped(lighten($orange, 15%)); } \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_reset.scss b/vendor/assets/stylesheets/bootstrap/_reset.scss index baefdeb5..b1d9157a 100644 --- a/vendor/assets/stylesheets/bootstrap/_reset.scss +++ b/vendor/assets/stylesheets/bootstrap/_reset.scss @@ -62,10 +62,10 @@ sub { // ------------------------- img { - max-width: 100%; height: auto; border: 0; -ms-interpolation-mode: bicubic; + vertical-align: middle; } // Forms diff --git a/vendor/assets/stylesheets/bootstrap/_scaffolding.scss b/vendor/assets/stylesheets/bootstrap/_scaffolding.scss index a4ce99e2..ec716131 100644 --- a/vendor/assets/stylesheets/bootstrap/_scaffolding.scss +++ b/vendor/assets/stylesheets/bootstrap/_scaffolding.scss @@ -3,7 +3,7 @@ // ------------------------------------------------------------------------------------------- -// STRUCTURAL LAYOUT +// Body reset // ----------------- body { @@ -12,11 +12,11 @@ body { font-size: $baseFontSize; line-height: $baseLineHeight; color: $textColor; - background-color: $white; + background-color: $bodyBackground; } -// LINKS +// Links // ----- a { diff --git a/vendor/assets/stylesheets/bootstrap/_sprites.scss b/vendor/assets/stylesheets/bootstrap/_sprites.scss index 04a28d2f..a26b15f9 100644 --- a/vendor/assets/stylesheets/bootstrap/_sprites.scss +++ b/vendor/assets/stylesheets/bootstrap/_sprites.scss @@ -11,7 +11,7 @@ // and background-position. Your resulting HTML will look like // . -// For the white version of the icons, just add the .icon-white class: +// For the white version of the icons, just add the .icon-white class: // [class^="icon-"], [class*=" icon-"] { @@ -20,14 +20,14 @@ height: 14px; line-height: 14px; vertical-align: text-top; - background-image: asset-url("glyphicons-halflings.png", image); + background-image: $iconSpritePath; background-position: 14px 14px; background-repeat: no-repeat; @include ie7-restore-right-whitespace(); } .icon-white { - background-image: asset-url("glyphicons-halflings-white.png", image); + background-image: $iconWhiteSpritePath; } .icon-glass { background-position: 0 0; } diff --git a/vendor/assets/stylesheets/bootstrap/_tables.scss b/vendor/assets/stylesheets/bootstrap/_tables.scss index 4e74b53b..a1ca4a17 100644 --- a/vendor/assets/stylesheets/bootstrap/_tables.scss +++ b/vendor/assets/stylesheets/bootstrap/_tables.scss @@ -11,6 +11,7 @@ table { max-width: 100%; border-collapse: collapse; border-spacing: 0; + background-color: $tableBackground; } // BASELINE STYLES @@ -25,7 +26,7 @@ table { line-height: $baseLineHeight; text-align: left; vertical-align: top; - border-top: 1px solid #ddd; + border-top: 1px solid $tableBorder; } th { font-weight: bold; @@ -35,12 +36,13 @@ table { vertical-align: bottom; } // Remove top border from thead by default - thead:first-child tr th, thead:first-child tr td { + colgroup + thead tr:first-child th, colgroup + thead tr:first-child td, + thead:first-child tr:first-child th, thead:first-child tr:first-child td { border-top: 0; } // Account for multiple tbody instances tbody + tbody { - border-top: 2px solid #ddd; + border-top: 2px solid $tableBorder; } } @@ -60,12 +62,13 @@ table { // ---------------- .table-bordered { - border: 1px solid #ddd; + border: 1px solid $tableBorder; + border-left: 0; border-collapse: separate; // Done so we can round those corners! *border-collapse: collapsed; // IE7 can't round corners anyway @include border-radius(4px); - th + th, td + td, th + td, td + th { - border-left: 1px solid #ddd; + th, td { + border-left: 1px solid $tableBorder; } // Prevent a double border thead:first-child tr:first-child th, tbody:first-child tr:first-child th, tbody:first-child tr:first-child td { @@ -95,7 +98,7 @@ table { .table-striped { tbody { tr:nth-child(odd) td, tr:nth-child(odd) th { - background-color: #f9f9f9; + background-color: $tableBackgroundAccent; } } } @@ -106,19 +109,12 @@ table { // Placed here since it has to come after the potential zebra striping .table { tbody tr:hover td, tbody tr:hover th { - background-color: #f5f5f5; + background-color: $tableBackgroundHover; } } // TABLE CELL SIZING // ----------------- - -// Change the columns -@mixin tableColumns($columnSpan: 1) { - float: none; - width: (($gridColumnWidth) * $columnSpan) + ($gridGutterWidth * ($columnSpan - 1)) - 16; - margin-left: 0; -} table { @for $i from 1 through $gridColumns { .span#{$i} { @include tableColumns($i); } diff --git a/vendor/assets/stylesheets/bootstrap/_type.scss b/vendor/assets/stylesheets/bootstrap/_type.scss index 5670b49f..3dae535b 100644 --- a/vendor/assets/stylesheets/bootstrap/_type.scss +++ b/vendor/assets/stylesheets/bootstrap/_type.scss @@ -28,8 +28,9 @@ p { h1, h2, h3, h4, h5, h6 { margin: 0; - font-weight: bold; - color: $grayDark; + font-family: $headingsFontFamily; + font-weight: $headingsFontWeight; + color: $headingsColor; text-rendering: optimizelegibility; // Fix the character spacing for headings small { font-weight: normal; @@ -121,10 +122,23 @@ dt, dd { } dt { font-weight: bold; + line-height: $baseLineHeight - 1; // fix jank Helvetica Neue font bug } dd { margin-left: $baseLineHeight / 2; } +// Horizontal layout (like forms) +.dl-horizontal { + dt { + float: left; + clear: left; + width: 120px; + text-align: right; + } + dd { + margin-left: 130px; + } +} // MISC // ---- @@ -149,13 +163,16 @@ em { } // Abbreviations and acronyms -abbr { - font-size: 90%; - text-transform: uppercase; +abbr[title] { border-bottom: 1px dotted #ddd; cursor: help; } +abbr.initialism { + font-size: 90%; + text-transform: uppercase; +} + // Blockquotes blockquote { padding: 0 0 0 15px; diff --git a/vendor/assets/stylesheets/bootstrap/_variables.scss b/vendor/assets/stylesheets/bootstrap/_variables.scss index 3e4faf55..024cb78c 100644 --- a/vendor/assets/stylesheets/bootstrap/_variables.scss +++ b/vendor/assets/stylesheets/bootstrap/_variables.scss @@ -7,11 +7,8 @@ // GLOBAL VALUES // -------------------------------------------------- -// Links -$linkColor: #08c !default; -$linkColorHover: darken($linkColor, 15%) !default; - // Grays +// ------------------------- $black: #000 !default; $grayDarker: #222 !default; $grayDark: #333 !default; @@ -20,7 +17,9 @@ $grayLight: #999 !default; $grayLighter: #eee !default; $white: #fff !default; + // Accent colors +// ---------------------------- $blue: #049cdb !default; $blueDark: #0064cd !default; $green: #46a546 !default; @@ -30,47 +29,133 @@ $orange: #f89406 !default; $pink: #c3325f !default; $purple: #7a43b6 !default; +// Scaffolding +// ------------------------- +$bodyBackground: $white !default; +$textColor: $grayDark !default; + +// Links +// ------------------------- +$linkColor: #08c !default; +$linkColorHover: darken($linkColor, 15%) !default; + // Typography +// ------------------------- $baseFontSize: 13px !default; $baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif !default; $baseLineHeight: 18px !default; -$textColor: $grayDark !default; +$altFontFamily: Georgia, "Times New Roman", Times, serif !default; + +$headingsFontFamily: inherit !default; // empty to use BS default, @baseFontFamily +$headingsFontWeight: bold !default; // instead of browser default, bold +$headingsColor: inherit !default; // empty to use BS default, @textColor + +// Tables +// ------------------------- +$tableBackground: transparent !default; // overall background-color +$tableBackgroundAccent: #f9f9f9 !default; // for striping +$tableBackgroundHover: #f5f5f5 !default; // for hover +$tableBorder: #ddd !default; // table and cell border // Buttons -$primaryButtonBackground: $linkColor !default; +// ------------------------- +$btnBackground: $white !default; +$btnBackgroundHighlight: darken($white, 10%) !default; +$btnBorder: darken($white, 20%) !default; +$btnPrimaryBackground: $linkColor !default; +$btnPrimaryBackgroundHighlight: adjust-hue($btnPrimaryBackground, 15%) !default; + +$btnInfoBackground: #5bc0de !default; +$btnInfoBackgroundHighlight: #2f96b4 !default; + +$btnSuccessBackground: #62c462 !default; +$btnSuccessBackgroundHighlight: #51a351 !default; + +$btnWarningBackground: lighten($orange, 15%) !default; +$btnWarningBackgroundHighlight: $orange !default; + +$btnDangerBackground: #ee5f5b !default; +$btnDangerBackgroundHighlight: #bd362f !default; + +$btnInverseBackground: $gray !default; +$btnInverseBackgroundHighlight: $grayDarker !default; + +// Forms +// ------------------------- +$inputBackground: $white !default; +$inputBorder: #ccc !default; +$inputDisabledBackground: $grayLighter !default; + + +// Dropdowns +// ------------------------- +$dropdownBackground: $white !default; +$dropdownBorder: rgba(0,0,0,.2) !default; +$dropdownLinkColor: $grayDark !default; +$dropdownLinkColorHover: $white !default; +$dropdownLinkBackgroundHover: $linkColor !default; // COMPONENT VARIABLES // -------------------------------------------------- // Z-index master list +// ------------------------- // Used for a bird's eye view of components dependent on the z-axis // Try to avoid customizing these :) -$zindexDropdown: 1000; -$zindexPopover: 1010; -$zindexTooltip: 1020; -$zindexFixedNavbar: 1030; -$zindexModalBackdrop: 1040; -$zindexModal: 1050; +$zindexDropdown: 1000; +$zindexPopover: 1010; +$zindexTooltip: 1020; +$zindexFixedNavbar: 1030; +$zindexModalBackdrop: 1040; +$zindexModal: 1050; + + +// Sprite icons path +// ------------------------- +$iconSpritePath: asset-url("glyphicons-halflings.png", image) !default; +$iconWhiteSpritePath: asset-url("glyphicons-halflings-white.png", image) !default; + // Input placeholder text color +// ------------------------- $placeholderText: $grayLight !default; -// HR border color + +// Hr border color +// ------------------------- $hrBorder: $grayLighter !default; + // Navbar +// ------------------------- $navbarHeight: 40px !default; $navbarBackground: $grayDarker !default; $navbarBackgroundHighlight: $grayDark !default; -$navbarLinkBackgroundHover: transparent !default; $navbarText: $grayLight !default; $navbarLinkColor: $grayLight !default; $navbarLinkColorHover: $white !default; +$navbarLinkColorActive: $navbarLinkColorHover !default; +$navbarLinkBackgroundHover: transparent !default; +$navbarLinkBackgroundActive: $navbarBackground !default; + +$navbarSearchBackground: lighten($navbarBackground, 25%) !default; +$navbarSearchBackgroundFocus: $white !default; +$navbarSearchBorder: darken($navbarSearchBackground, 30%) !default; +$navbarSearchPlaceholderColor: #ccc !default; + + +// Hero unit +// ------------------------- +$heroUnitBackground: $grayLighter !default; +$heroUnitHeadingColor: inherit !default; +$heroUnitLeadColor: inherit !default; + // Form states and alerts +// ------------------------- $warningText: #c09853 !default; $warningBackground: #fcf8e3 !default; $warningBorder: darken(adjust-hue($warningBackground, -10), 3%) !default; @@ -93,11 +178,14 @@ $infoBorder: darken(adjust-hue($infoBackground, -10), 7%) !default; // -------------------------------------------------- // Default 940px grid +// ------------------------- $gridColumns: 12 !default; $gridColumnWidth: 60px !default; $gridGutterWidth: 20px !default; $gridRowWidth: ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1)) !default; + // Fluid grid +// ------------------------- $fluidGridColumnWidth: 6.382978723% !default; $fluidGridGutterWidth: 2.127659574% !default; \ No newline at end of file diff --git a/vendor/assets/stylesheets/bootstrap/_wells.scss b/vendor/assets/stylesheets/bootstrap/_wells.scss index 4347b89b..21889b83 100644 --- a/vendor/assets/stylesheets/bootstrap/_wells.scss +++ b/vendor/assets/stylesheets/bootstrap/_wells.scss @@ -14,4 +14,14 @@ border-color: #ddd; border-color: rgba(0,0,0,.15); } +} + +// Sizes +.well-large { + padding:24px; + @include border-radius(6px); +} +.well-small { + padding: 9px; + @include border-radius(3px); } \ No newline at end of file