Tying up some loose ends before bed

- Adding Bootstrap 3 override files (untested) - Incorporate various UX feedback from my neighbor chef guy - Expanded on the product card toolbar vision - Added alert notifying user some some features are not ready yet - Added ideal sample data into the menu bar and muted most text - Popovers added but may need to reorder BS scripts for them to work - Started but didn't finish passing query into template (left TODO) - Cleaned up the config-coffee some for bower and bootstrap 3
7 years ago · 6be6192f68
--- a/app/views/beer-view.coffee
+++ b/app/views/beer-view.coffee
@ -7,6 +7,7 @@ module.exports = class BeerView extends View
  events:
    'click [data-toggle="collapse"]': '_trackAccordionClick'
    'click [data-toggle="collapse"]': '_toggleIcon'
    'click [data-name="suggest"]'   : '_suggest'

  initialize: ->
    @$el.on('show.bs.collapse', (evt) ->
@ -27,4 +28,13 @@ module.exports = class BeerView extends View
    if $icon.hasClass('glyphicon-plus-sign')
      $icon.removeClass('glyphicon-plus-sign').addClass('glyphicon-minus-sign')
    else
      $icon.removeClass('glyphicon-minus-sign').addClass('glyphicon-plus-sign')
      $icon.removeClass('glyphicon-minus-sign').addClass('glyphicon-plus-sign')

  _suggest: (evt) ->
    return unless evt.target
    $button = $(evt.target).closest('button')
    if $button
      beerId = $button.attr('data-value')
      $button.prop('disabled', true)
      @$('.alert').removeClass('hidden')

--- a/app/views/header-view.coffee
+++ b/app/views/header-view.coffee
@ -6,8 +6,9 @@ module.exports = class HeaderView extends View
  id: 'header'
  template: require './templates/header'
  events:
    'submit form': '_submit'
    'submit form'   : '_submit'
    'keypress input': '_hide'
    'click button'  : '_validateInput'

  _submit: (evt) ->
    evt.preventDefault()
@ -19,4 +20,12 @@ module.exports = class HeaderView extends View
  _hide: (evt) ->
    code = evt.keyCode || evt.which;
    if code is 13
      @$('.navbar-collapse').collapse('hide')
      @$('.navbar-collapse').collapse('hide')

  _validateInput: (evt) ->
    $input = $(evt.target).closest('button').prev().find('input')
    return unless $input
    if $input.val()
      @_submit evt
    else
      $input.focus()
--- a/app/views/site-view.coffee
+++ b/app/views/site-view.coffee
@ -1,5 +1,4 @@
 View = require 'views/base/view'
 template = require 'views/templates/site'

 # Site view is a top-level view which is bound to body.
 module.exports = class SiteView extends View
@ -9,7 +8,7 @@ module.exports = class SiteView extends View
    'header' : 'nav[role="navigation"]'
    'main'   : '#content'
    'sidebar': '#sidebar'
  template: template
  template: require './templates/site'

  events:
    'click [data-toggle="offcanvas"]': '_toggleSidebar'
--- a/app/views/styles/beer.styl
+++ b/app/views/styles/beer.styl
@ -13,4 +13,6 @@
      margin: 0 0 0.5rem 1rem
  .panel-body
    .dl-horizontal
      overflow: hidden
      overflow: hidden
      dd
        margin-bottom 0.5rem
--- a/app/views/templates/beer-sidebar.hbs
+++ b/app/views/templates/beer-sidebar.hbs
@ -1,33 +1,35 @@
 <div class="well sidebar-nav text-muted">
  <ul class="nav">
    <li><i class="glyphicon glyphicon-star"></i> Starred</li>
    <li><i class="glyphicon glyphicon-thumbs-up"></i> Suggested</li>
    <li>
      <ul class="nav">
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#" class="text-muted">1000 IBU</a></li>
        <li><a href="#" class="text-muted">Breakfast Stout</a></li>
        <li><a href="#" class="text-muted">Darklord</a></li>
        <li><a href="#" class="text-muted">Zombie Dust</a></li>
      </ul>
    </li>
    <li style="margin-top:1rem"><i class="glyphicon glyphicon-time"></i> Searched</li>
    <li style="margin-top:1rem"><i class="glyphicon glyphicon-search"></i> Searches</li>
    <li>
      <ul class="nav">
        <li class="active"><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li class="active"><a href="#" class="text-muted">Goose Island Brewing</a></li>
        <li><a href="#" class="text-muted">Double Imperial Stout</a></li>
        <li><a href="#" class="text-muted">Maibock</a></li>
        <li><a href="#" class="text-muted">Founders Doom</a></li>
      </ul>
    </li>
  </ul>
 </div>

 <div class="list-group">
  <a href="#" class="list-group-item">
    <h4 class="list-group-item-heading"><i class="glyphicon glyphicon-star"></i> Manage Starred</h4>
    <p class="list-group-item-text text-muted">View and edit starred items.</p>
  {{!-- FIXME: Poper doesn't open --}}
  <a href="#" class="list-group-item" data-toggle="popover" data-content="Pardon the dust. This feature isn't quite ready yet." data-container="body">
    <h4 class="list-group-item-heading"><i class="glyphicon glyphicon-thumbs-up"></i> Suggestions</h4>
    <p class="list-group-item-text text-muted">Manage suggested items.</p>
  </a>
  <a href="#" class="list-group-item">
    <h4 class="list-group-item-heading"><i class="glyphicon glyphicon-search"></i> Search History</h4>
    <p class="list-group-item-text text-muted">View and reset search history.</p>
  {{!-- FIXME: Poper doesn't open --}}
  <a href="#" class="list-group-item" data-toggle="popover" data-content="Pardon the dust. This feature isn't quite ready yet." data-container="body">
    <h4 class="list-group-item-heading"><i class="glyphicon glyphicon-search"></i> Searches</h4>
    <p class="list-group-item-text text-muted">Manage search history.</p>
  </a>
 </div>
--- a/app/views/templates/beer.hbs
+++ b/app/views/templates/beer.hbs
@ -39,9 +39,26 @@
    <hr>
    
    {{!-- Toolbar --}}
    <button type="button" class="btn btn-default btn-md pull-right" disabled>
      <span class="glyphicon glyphicon-star"></span> Star
    </button>
    <div class="alert alert-info alert-dismissable hidden">
      <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
      <strong>One sec!</strong> Toolbar features aren't quite ready yet.
    </div>
    <div class="btn-toolbar pull-right">
      <div class="btn-group">
        <button type="button" class="btn btn-default btn-md" data-name="suggest" data-value="{{beer.bid}}">
          <span class="glyphicon glyphicon-star"></span> Star
        </button>
      </div>
      <div class="btn-group">
        <button type="button" class="btn btn-default btn-md" data-name="suggest" data-value="{{beer.bid}}">
          <span class="glyphicon glyphicon-thumbs-up"></span>
        </button>
        <button type="button" class="btn btn-default btn-md" data-name="suggest" data-value="{{beer.bid}}">
          <span class="glyphicon glyphicon-thumbs-down"></span>
        </button>
      </div>
    </div>
    

  </div>
 </div>
--- a/app/views/templates/header.hbs
+++ b/app/views/templates/header.hbs
@ -11,13 +11,13 @@
  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="/">Home</a>
      <li><a href="https://github.com/jhabdas/hopstop">Fork</a>
      <li><a href="https://github.com/jhabdas/hopstop">About</a>
    </ul>
    <form class="navbar-form navbar-right" role="search">
      <div class="form-group">
        <input type="text" class="form-control" placeholder="Beer search" autofocus pattern="\w{2,}(?.+)$" title="Search for a beer by keywords consisting of two or more characters.">
        <input type="text" class="form-control" placeholder="Search for a beer" autofocus pattern="\w{2,}(?.+)$" title="Enter delightful things here.">
      </div>
      <button type="submit" class="btn btn-default">Go!</button>
      <button type="submit" class="btn btn-default" title="Search"><i class="glyphicon glyphicon-search"></i></button>
    </form>
    {{!-- <p class="navbar-text pull-right">Last search: <a href="#" class="navbar-link">Zombie</a></p> --}}
  </div>
--- a/app/views/templates/site.hbs
+++ b/app/views/templates/site.hbs
@ -3,7 +3,11 @@
 <div class="container">
  <div class="row">
    <p class="col-xs-12 visible-xs container">
      <button type="button" class="btn btn-primary btn-xs pull-right" data-toggle="offcanvas">Toolbar</button>
      {{!-- TODO: Pass `search` into template --}}
      {{#if search}}
        Viewing: {{search}}
      {{/if}}
      <button type="button" class="btn btn-primary btn-xs pull-right" data-toggle="offcanvas">Menu</button>
    </p>
  </div>
  <div class="row row-offcanvas row-offcanvas-right">
--- a/config.coffee
+++ b/config.coffee
@ -6,27 +6,18 @@ exports.config =
    javascripts:
      joinTo:
        'javascripts/app.js': /^app/
        'javascripts/vendor.js': /^(bower_components|vendor)/
        'test/javascripts/test.js': /^test[\\/](?!(bower_components|vendor))/
        'test/javascripts/test-vendor.js': /^test[\\/](?=(bower_components|vendor))/
      order:
        # Files in `vendor` directories are compiled before other files
        # even if they aren't specified in order.before.
        before: [
          'vendor/scripts/console-polyfill.js',
          'vendor/scripts/jquery-1.9.1.js',
          'vendor/scripts/lodash-1.2.0.js',
          'vendor/scripts/backbone-1.0.0.js'
        ]
        after: [
          'test/vendor/scripts/test-helper.js'
        ]
        'javascripts/vendor.js': /^(vendor|bower_components)/
        'test/javascripts/test.js': /^test[\\/](?!(vendor|bower_components))/
        'test/javascripts/test-vendor.js': /^test[\\/](?=(vendor|bower_components))/

    stylesheets:
      joinTo:
        'stylesheets/app.css': /^(app|bower_components|vendor)/
        'stylesheets/app.css': /^(app|vendor|bower_components)/
        'test/stylesheets/test.css': /^test/
      order:
        before: [
          'vendor/styles/bootstrap/normalize.less'
        ]
        after: [
          'vendor/styles/helpers.css'
        ]
--- a/vendor/styles/bootstrap/mixins.less
+++ b/vendor/styles/bootstrap/mixins.less
@ -0,0 +1,723 @@
 //
 // Mixins
 // --------------------------------------------------


 // Utilities
 // -------------------------

 // Clearfix
 // Source: http://nicolasgallagher.com/micro-clearfix-hack/
 //
 // For modern browsers
 // 1. The space content is one way to avoid an Opera bug when the
 //    contenteditable attribute is included anywhere else in the document.
 //    Otherwise it causes space to appear at the top and bottom of elements
 //    that are clearfixed.
 // 2. The use of `table` rather than `block` is only necessary if using
 //    `:before` to contain the top-margins of child elements.
 .clearfix() {
  &:before,
  &:after {
    content: " "; /* 1 */
    display: table; /* 2 */
  }
  &:after {
    clear: both;
  }
 }

 // Webkit-style focus
 .tab-focus() {
  // Default
  outline: thin dotted #333;
  // Webkit
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
 }

 // Center-align a block level element
 .center-block() {
  display: block;
  margin-left: auto;
  margin-right: auto;
 }

 // Sizing shortcuts
 .size(@width; @height) {
  width: @width;
  height: @height;
 }
 .square(@size) {
  .size(@size; @size);
 }

 // Placeholder text
 .placeholder(@color: @input-color-placeholder) {
  &:-moz-placeholder            { color: @color; } // Firefox 4-18
  &::-moz-placeholder           { color: @color; } // Firefox 19+
  &:-ms-input-placeholder       { color: @color; } // Internet Explorer 10+
  &::-webkit-input-placeholder  { color: @color; } // Safari and Chrome
 }

 // Text overflow
 // Requires inline-block or block for proper styling
 .text-overflow() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 // CSS image replacement
 // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
 .hide-text() {
  font: ~"0/0" a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
 }



 // CSS3 PROPERTIES
 // --------------------------------------------------

 // Single side border-radius
 .border-top-radius(@radius) {
  border-top-right-radius: @radius;
   border-top-left-radius: @radius;
 }
 .border-right-radius(@radius) {
  border-bottom-right-radius: @radius;
     border-top-right-radius: @radius;
 }
 .border-bottom-radius(@radius) {
  border-bottom-right-radius: @radius;
   border-bottom-left-radius: @radius;
 }
 .border-left-radius(@radius) {
  border-bottom-left-radius: @radius;
     border-top-left-radius: @radius;
 }

 // Drop shadows
 .box-shadow(@shadow) {
  -webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
          box-shadow: @shadow;
 }

 // Transitions
 .transition(@transition) {
  -webkit-transition: @transition;
          transition: @transition;
 }
 .transition-delay(@transition-delay) {
  -webkit-transition-delay: @transition-delay;
          transition-delay: @transition-delay;
 }
 .transition-duration(@transition-duration) {
  -webkit-transition-duration: @transition-duration;
          transition-duration: @transition-duration;
 }
 .transition-transform(@transition) {
  -webkit-transition: -webkit-transform @transition;
     -moz-transition: -moz-transform @transition;
       -o-transition: -o-transform @transition;
          transition: transform @transition;
 }

 // Transformations
 .rotate(@degrees) {
  -webkit-transform: rotate(@degrees);
      -ms-transform: rotate(@degrees); // IE9+
          transform: rotate(@degrees);
 }
 .scale(@ratio) {
  -webkit-transform: scale(@ratio);
      -ms-transform: scale(@ratio); // IE9+
          transform: scale(@ratio);
 }
 .translate(@x; @y) {
  -webkit-transform: translate(@x, @y);
      -ms-transform: translate(@x, @y); // IE9+
          transform: translate(@x, @y);
 }
 .skew(@x; @y) {
  -webkit-transform: skew(@x, @y);
      -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
          transform: skew(@x, @y);
 }
 .translate3d(@x; @y; @z) {
  -webkit-transform: translate3d(@x, @y, @z);
          transform: translate3d(@x, @y, @z);
 }

 // Backface visibility
 // Prevent browsers from flickering when using CSS 3D transforms.
 // Default value is `visible`, but can be changed to `hidden`
 // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
 .backface-visibility(@visibility){
  -webkit-backface-visibility: @visibility;
     -moz-backface-visibility: @visibility;
          backface-visibility: @visibility;
 }

 // Box sizing
 .box-sizing(@boxmodel) {
  -webkit-box-sizing: @boxmodel;
     -moz-box-sizing: @boxmodel;
          box-sizing: @boxmodel;
 }

 // User select
 // For selecting text on the page
 .user-select(@select) {
  -webkit-user-select: @select;
     -moz-user-select: @select;
      -ms-user-select: @select; // IE10+
       -o-user-select: @select;
          user-select: @select;
 }

 // Resize anything
 .resizable(@direction) {
  resize: @direction; // Options: horizontal, vertical, both
  overflow: auto; // Safari fix
 }

 // CSS3 Content Columns
 .content-columns(@column-count; @column-gap: @grid-gutter-width) {
  -webkit-column-count: @column-count;
     -moz-column-count: @column-count;
          column-count: @column-count;
  -webkit-column-gap: @column-gap;
     -moz-column-gap: @column-gap;
          column-gap: @column-gap;
 }

 // Optional hyphenation
 .hyphens(@mode: auto) {
  word-wrap: break-word;
  -webkit-hyphens: @mode;
     -moz-hyphens: @mode;
      -ms-hyphens: @mode; // IE10+
       -o-hyphens: @mode;
          hyphens: @mode;
 }

 // Opacity
 .opacity(@opacity) {
  opacity: @opacity;
  // IE8 filter
  @opacity-ie: (@opacity * 100);
  filter: ~"alpha(opacity=@{opacity-ie})";
 }



 // GRADIENTS
 // --------------------------------------------------

 #gradient {

  // Horizontal gradient, from left to right
  //
  // Creates two color stops, start and end, by specifying a color and position for each color stop.
  // Color stops are not available in IE9 and below.
  .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
    background-image: -webkit-gradient(linear, @start-percent top, @end-percent top, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+
    background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1+, Chrome 10+
    background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
    background-image:  linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
    background-repeat: repeat-x;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down
  }

  // Vertical gradient, from top to bottom
  //
  // Creates two color stops, start and end, by specifying a color and position for each color stop.
  // Color stops are not available in IE9 and below.
  .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
    background-image: -webkit-gradient(linear, left @start-percent, left @end-percent, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+
    background-image: -webkit-linear-gradient(top, @start-color, @start-percent, @end-color, @end-percent); // Safari 5.1+, Chrome 10+
    background-image:  -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
    background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
    background-repeat: repeat-x;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
  }

  .directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
    background-repeat: repeat-x;
    background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1+, Chrome 10+
    background-image: -moz-linear-gradient(@deg, @start-color, @end-color); // FF 3.6+
    background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10
  }
  .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
    background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
    background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
    background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
    background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
    background-repeat: no-repeat;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
  }
  .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
    background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
    background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color);
    background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
    background-repeat: no-repeat;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
  }
  .radial(@inner-color: #555; @outer-color: #333) {
    background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));
    background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
    background-image: -moz-radial-gradient(circle, @inner-color, @outer-color);
    background-image: radial-gradient(circle, @inner-color, @outer-color);
    background-repeat: no-repeat;
  }
  .striped(@color: #555; @angle: 45deg) {
    background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
  }
 }

 // Reset filters for IE
 //
 // When you need to remove a gradient background, do not forget to use this to reset
 // the IE filter for IE9 and below.
 .reset-filter() {
  filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
 }



 // Retina images
 //
 // Short retina mixin for setting background-image and -size

 .img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
  background-image: url("@{file-1x}");

  @media
  only screen and (-webkit-min-device-pixel-ratio: 2),
  only screen and (   min--moz-device-pixel-ratio: 2),
  only screen and (     -o-min-device-pixel-ratio: 2/1),
  only screen and (        min-device-pixel-ratio: 2),
  only screen and (                min-resolution: 192dpi),
  only screen and (                min-resolution: 2dppx) {
    background-image: url("@{file-2x}");
    background-size: @width-1x @height-1x;
  }
 }


 // Responsive image
 //
 // Keep images from scaling beyond the width of their parents.

 .img-responsive(@display: block;) {
  display: @display;
  max-width: 100%; // Part 1: Set a maximum relative to the parent
  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
 }


 // COMPONENT MIXINS
 // --------------------------------------------------

 // Horizontal dividers
 // -------------------------
 // Dividers (basically an hr) within dropdowns and nav lists
 .nav-divider(@color: #e5e5e5) {
  height: 1px;
  margin: ((@line-height-computed / 2) - 1) 0;
  overflow: hidden;
  background-color: @color;
 }

 // Panels
 // -------------------------
 .panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border;) {
  border-color: @border;
  & > .panel-heading {
    color: @heading-text-color;
    background-color: @heading-bg-color;
    border-color: @heading-border;
    + .panel-collapse .panel-body {
      border-top-color: @border;
    }
  }
  & > .panel-footer {
    + .panel-collapse .panel-body {
      border-bottom-color: @border;
    }
  }
 }

 // Alerts
 // -------------------------
 .alert-variant(@background; @border; @text-color) {
  background-color: @background;
  border-color: @border;
  color: @text-color;
  hr {
    border-top-color: darken(@border, 5%);
  }
  .alert-link {
    color: darken(@text-color, 10%);
  }
 }

 // Tables
 // -------------------------
 .table-row-variant(@state; @background; @border) {
  // Exact selectors below required to override `.table-striped` and prevent
  // inheritance to nested tables.
  .table > thead > tr,
  .table > tbody > tr,
  .table > tfoot > tr {
    > td.@{state},
    > th.@{state},
    &.@{state} > td,
    &.@{state} > th {
      background-color: @background;
      border-color: @border;
    }
  }

  // Hover states for `.table-hover`
  // Note: this is not available for cells or rows within `thead` or `tfoot`.
  .table-hover > tbody > tr {
    > td.@{state}:hover,
    > th.@{state}:hover,
    &.@{state}:hover > td {
      background-color: darken(@background, 5%);
      border-color: darken(@border, 5%);
    }
  }
 }

 // Button variants
 // -------------------------
 // Easily pump out default styles, as well as :hover, :focus, :active,
 // and disabled options for all buttons
 .button-variant(@color; @background; @border) {
  color: @color;
  background-color: @background;
  border-color: @border;

  &:hover,
  &:focus,
  &:active,
  &.active,
  .open .dropdown-toggle& {
    color: @color;
    background-color: darken(@background, 8%);
        border-color: darken(@border, 12%);
  }
  &:active,
  &.active,
  .open .dropdown-toggle& {
    background-image: none;
  }
  &.disabled,
  &[disabled],
  fieldset[disabled] & {
    &,
    &:hover,
    &:focus,
    &:active,
    &.active {
      background-color: @background;
          border-color: @border
    }
  }
 }

 // Button sizes
 // -------------------------
 .button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
  padding: @padding-vertical @padding-horizontal;
  font-size: @font-size;
  line-height: @line-height;
  border-radius: @border-radius;
 }

 // Pagination
 // -------------------------
 .pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) {
  > li {
    > a,
    > span {
      padding: @padding-vertical @padding-horizontal;
      font-size: @font-size;
    }
    &:first-child {
      > a,
      > span {
        .border-left-radius(@border-radius);
      }
    }
    &:last-child {
      > a,
      > span {
        .border-right-radius(@border-radius);
      }
    }
  }
 }

 // Labels
 // -------------------------
 .label-variant(@color) {
  background-color: @color;
  &[href] {
    &:hover,
    &:focus {
      background-color: darken(@color, 10%);
    }
  }
 }

 // Navbar vertical align
 // -------------------------
 // Vertically center elements in the navbar.
 // Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
 .navbar-vertical-align(@element-height) {
  margin-top: ((@navbar-height - @element-height) / 2);
  margin-bottom: ((@navbar-height - @element-height) / 2);
 }

 // Progress bars
 // -------------------------
 .progress-bar-variant(@color) {
  background-color: @color;
  .progress-striped & {
    #gradient > .striped(@color);
  }
 }

 // Responsive utilities
 // -------------------------
 // More easily include all the states for responsive-utilities.less.
 .responsive-visibility() {
  display: block !important;
  tr& { display: table-row !important; }
  th&,
  td& { display: table-cell !important; }
 }

 .responsive-invisibility() {
  display: none !important;
  tr& { display: none !important; }
  th&,
  td& { display: none !important; }
 }

 // Grid System
 // -----------

 // Centered container element
 .container-fixed() {
  margin-right: auto;
  margin-left: auto;
  padding-left:  (@grid-gutter-width / 2);
  padding-right: (@grid-gutter-width / 2);
  .clearfix();
 }

 // Creates a wrapper for a series of columns
 .make-row(@gutter: @grid-gutter-width) {
  margin-left:  (@gutter / -2);
  margin-right: (@gutter / -2);
  .clearfix();
 }

 // Generate the extra small columns
 .make-xs-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  float: left;
  width: percentage((@columns / @grid-columns));
  // Prevent columns from collapsing when empty
  min-height: 1px;
  // Inner gutter via padding
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);
 }

 // Generate the small columns
 .make-sm-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  // Prevent columns from collapsing when empty
  min-height: 1px;
  // Inner gutter via padding
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  // Calculate width based on number of columns available
  @media (min-width: @screen-sm) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
 }

 // Generate the small column offsets
 .make-sm-column-offset(@columns) {
  @media (min-width: @screen-sm) {
    margin-left: percentage((@columns / @grid-columns));
  }
 }
 .make-sm-column-push(@columns) {
  @media (min-width: @screen-sm) {
    left: percentage((@columns / @grid-columns));
  }
 }
 .make-sm-column-pull(@columns) {
  @media (min-width: @screen-sm) {
    right: percentage((@columns / @grid-columns));
  }
 }

 // Generate the medium columns
 .make-md-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  // Prevent columns from collapsing when empty
  min-height: 1px;
  // Inner gutter via padding
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  // Calculate width based on number of columns available
  @media (min-width: @screen-md) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
 }

 // Generate the large column offsets
 .make-md-column-offset(@columns) {
  @media (min-width: @screen-md) {
    margin-left: percentage((@columns / @grid-columns));
  }
 }
 .make-md-column-push(@columns) {
  @media (min-width: @screen-md) {
    left: percentage((@columns / @grid-columns));
  }
 }
 .make-md-column-pull(@columns) {
  @media (min-width: @screen-md) {
    right: percentage((@columns / @grid-columns));
  }
 }

 // Generate the large columns
 .make-lg-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  // Prevent columns from collapsing when empty
  min-height: 1px;
  // Inner gutter via padding
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  // Calculate width based on number of columns available
  @media (min-width: @screen-lg) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
 }

 // Generate the large column offsets
 .make-lg-column-offset(@columns) {
  @media (min-width: @screen-lg) {
    margin-left: percentage((@columns / @grid-columns));
  }
 }
 .make-lg-column-push(@columns) {
  @media (min-width: @screen-lg) {
    left: percentage((@columns / @grid-columns));
  }
 }
 .make-lg-column-pull(@columns) {
  @media (min-width: @screen-lg) {
    right: percentage((@columns / @grid-columns));
  }
 }


 // Form validation states
 //
 // Used in forms.less to generate the form validation CSS for warnings, errors,
 // and successes.

 .form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
  // Color the label and help text
  .help-block,
  .control-label {
    color: @text-color;
  }
  // Set the border and box shadow on specific inputs to match
  .form-control {
    border-color: @border-color;
    .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
    &:focus {
      border-color: darken(@border-color, 10%);
      @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
      .box-shadow(@shadow);
    }
  }
  // Set validation states also for addons
  .input-group-addon {
    color: @text-color;
    border-color: @border-color;
    background-color: @background-color;
  }
 }

 // Form control focus state
 //
 // Generate a customized focus state and for any input with the specified color,
 // which defaults to the `@input-focus-border` variable.
 //
 // We highly encourage you to not customize the default value, but instead use
 // this to tweak colors on an as-needed basis. This aesthetic change is based on
 // WebKit's default styles, but applicable to a wider range of browsers. Its
 // usability and accessibility should be taken into account with any change.
 //
 // Example usage: change the default blue border and shadow to white for better
 // contrast against a dark gray background.

 .form-control-focus(@color: @input-border-focus) {
  @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
  &:focus {
    border-color: @color;
    outline: 0;
    .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
  }
 }

 // Form control sizing
 //
 // Relative text size, padding, and border-radii changes for form controls. For
 // horizontal sizing, wrap controls in the predefined grid classes. `<select>`
 // element gets special love because it's special, and that's a fact!

 .input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
  height: @input-height;
  padding: @padding-vertical @padding-horizontal;
  font-size: @font-size;
  line-height: @line-height;
  border-radius: @border-radius;

  select& {
    height: @input-height;
    line-height: @input-height;
  }

  textarea& {
    height: auto;
  }
 }
--- a/vendor/styles/bootstrap/normalize.less
+++ b/vendor/styles/bootstrap/normalize.less
@ -0,0 +1,396 @@
 /*! normalize.css v2.1.0 | MIT License | git.io/normalize */

 // ==========================================================================
 // HTML5 display definitions
 // ==========================================================================

 //
 // Correct `block` display not defined in IE 8/9.
 //

 article,
 aside,
 details,
 figcaption,
 figure,
 footer,
 header,
 hgroup,
 main,
 nav,
 section,
 summary {
  display: block;
 }

 //
 // Correct `inline-block` display not defined in IE 8/9.
 //

 audio,
 canvas,
 video {
  display: inline-block;
 }

 //
 // Prevent modern browsers from displaying `audio` without controls.
 // Remove excess height in iOS 5 devices.
 //

 audio:not([controls]) {
  display: none;
  height: 0;
 }

 //
 // Address styling not present in IE 8/9.
 //

 [hidden] {
  display: none;
 }

 // ==========================================================================
 // Base
 // ==========================================================================

 //
 // 1. Set default font family to sans-serif.
 // 2. Prevent iOS text size adjust after orientation change, without disabling
 //    user zoom.
 //

 html {
  font-family: sans-serif; // 1
  -webkit-text-size-adjust: 100%; // 2
  -ms-text-size-adjust: 100%; // 2
 }

 //
 // Remove default margin.
 //

 body {
  margin: 0;
 }

 // ==========================================================================
 // Links
 // ==========================================================================

 //
 // Address `outline` inconsistency between Chrome and other browsers.
 //

 a:focus {
  outline: thin dotted;
 }

 //
 // Improve readability when focused and also mouse hovered in all browsers.
 //

 a:active,
 a:hover {
  outline: 0;
 }

 // ==========================================================================
 // Typography
 // ==========================================================================

 //
 // Address variable `h1` font-size and margin within `section` and `article`
 // contexts in Firefox 4+, Safari 5, and Chrome.
 //

 h1 {
  font-size: 2em;
  margin: 0.67em 0;
 }

 //
 // Address styling not present in IE 8/9, Safari 5, and Chrome.
 //

 abbr[title] {
  border-bottom: 1px dotted;
 }

 //
 // Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 //

 b,
 strong {
  font-weight: bold;
 }

 //
 // Address styling not present in Safari 5 and Chrome.
 //

 dfn {
  font-style: italic;
 }

 //
 // Address differences between Firefox and other browsers.
 //

 hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
 }

 //
 // Address styling not present in IE 8/9.
 //

 mark {
  background: #ff0;
  color: #000;
 }

 //
 // Correct font family set oddly in Safari 5 and Chrome.
 //

 code,
 kbd,
 pre,
 samp {
  font-family: monospace, serif;
  font-size: 1em;
 }

 //
 // Improve readability of pre-formatted text in all browsers.
 //

 pre {
  white-space: pre-wrap;
 }

 //
 // Set consistent quote types.
 //

 q {
  quotes: "\201C" "\201D" "\2018" "\2019";
 }

 //
 // Address inconsistent and variable font size in all browsers.
 //

 small {
  font-size: 80%;
 }

 //
 // Prevent `sub` and `sup` affecting `line-height` in all browsers.
 //

 sub,
 sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
 }

 sup {
  top: -0.5em;
 }

 sub {
  bottom: -0.25em;
 }

 // ==========================================================================
 // Embedded content
 // ==========================================================================

 //
 // Remove border when inside `a` element in IE 8/9.
 //

 img {
  border: 0;
 }

 //
 // Correct overflow displayed oddly in IE 9.
 //

 svg:not(:root) {
  overflow: hidden;
 }

 // ==========================================================================
 // Figures
 // ==========================================================================

 //
 // Address margin not present in IE 8/9 and Safari 5.
 //

 figure {
  margin: 0;
 }

 // ==========================================================================
 // Forms
 // ==========================================================================

 //
 // Define consistent border, margin, and padding.
 //

 fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
 }

 //
 // 1. Correct `color` not being inherited in IE 8/9.
 // 2. Remove padding so people aren't caught out if they zero out fieldsets.
 //

 legend {
  border: 0; // 1
  padding: 0; // 2
 }

 //
 // 1. Correct font family not being inherited in all browsers.
 // 2. Correct font size not being inherited in all browsers.
 // 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 //

 button,
 input,
 select,
 textarea {
  font-family: inherit; // 1
  font-size: 100%; // 2
  margin: 0; // 3
 }

 //
 // Address Firefox 4+ setting `line-height` on `input` using `!important` in
 // the UA stylesheet.
 //

 button,
 input {
  line-height: normal;
 }

 //
 // Address inconsistent `text-transform` inheritance for `button` and `select`.
 // All other form control elements do not inherit `text-transform` values.
 // Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 // Correct `select` style inheritance in Firefox 4+ and Opera.
 //

 button,
 select {
  text-transform: none;
 }

 //
 // 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 //    and `video` controls.
 // 2. Correct inability to style clickable `input` types in iOS.
 // 3. Improve usability and consistency of cursor style between image-type
 //    `input` and others.
 //

 button,
 html input[type="button"], // 1
 input[type="reset"],
 input[type="submit"] {
  -webkit-appearance: button; // 2
  cursor: pointer; // 3
 }

 //
 // Re-set default cursor for disabled elements.
 //

 button[disabled],
 html input[disabled] {
  cursor: default;
 }

 //
 // 1. Address box sizing set to `content-box` in IE 8/9.
 // 2. Remove excess padding in IE 8/9.
 //

 input[type="checkbox"],
 input[type="radio"] {
  box-sizing: border-box; // 1
  padding: 0; // 2
 }

 //
 // 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 // 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 //    (include `-moz` to future-proof).
 //

 input[type="search"] {
  -webkit-appearance: textfield; // 1
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; // 2
  box-sizing: content-box;
 }

 //
 // Remove inner padding and search cancel button in Safari 5 and Chrome
 // on OS X.
 //

 input[type="search"]::-webkit-search-cancel-button,
 input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
 }

 //
 // Remove inner padding and border in Firefox 4+.
 //

 button::-moz-focus-inner,
 input::-moz-focus-inner {
  border: 0;
  padding: 0;
 }

 //
 // 1. Remove default vertical scrollbar in IE 8/9.
 // 2. Improve readability and alignment in all browsers.
 //

 textarea {
  overflow: auto; // 1
  vertical-align: top; // 2
 }

 // ==========================================================================
 // Tables
 // ==========================================================================

 //
 // Remove most spacing between table cells.
 //

 table {
  border-collapse: collapse;
  border-spacing: 0;
 }
--- a/vendor/styles/bootstrap/variables.less
+++ b/vendor/styles/bootstrap/variables.less
@ -0,0 +1,620 @@
 //
 // Variables
 // --------------------------------------------------


 // Global values
 // --------------------------------------------------

 // Grays
 // -------------------------

@gray-darker:            lighten(#000, 13.5%); // #222
@gray-dark:              lighten(#000, 20%);   // #333
@gray:                   lighten(#000, 33.5%); // #555
@gray-light:             lighten(#000, 60%);   // #999
@gray-lighter:           lighten(#000, 93.5%); // #eee

 // Brand colors
 // -------------------------

@brand-primary:         #428bca;
@brand-success:         #5cb85c;
@brand-warning:         #f0ad4e;
@brand-danger:          #d9534f;
@brand-info:            #5bc0de;

 // Scaffolding
 // -------------------------

@body-bg:               #fff;
@text-color:            @gray-dark;

 // Links
 // -------------------------

@link-color:            @brand-primary;
@link-hover-color:      darken(@link-color, 15%);

 // Typography
 // -------------------------

@font-family-sans-serif:  "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-serif:       Georgia, "Times New Roman", Times, serif;
@font-family-monospace:   Monaco, Menlo, Consolas, "Courier New", monospace;
@font-family-base:        @font-family-sans-serif;

@font-size-base:          14px;
@font-size-large:         ceil(@font-size-base * 1.25); // ~18px
@font-size-small:         ceil(@font-size-base * 0.85); // ~12px

@line-height-base:        1.428571429; // 20/14
@line-height-computed:    floor(@font-size-base * @line-height-base); // ~20px

@headings-font-family:    @font-family-base;
@headings-font-weight:    500;
@headings-line-height:    1.1;

 // Iconography
 // -------------------------

@icon-font-path:          "../fonts/";
@icon-font-name:          "glyphicons-halflings-regular";


 // Components
 // -------------------------
 // Based on 14px font-size and 1.428 line-height (~20px to start)

@padding-base-vertical:          6px;
@padding-base-horizontal:        12px;

@padding-large-vertical:         10px;
@padding-large-horizontal:       16px;

@padding-small-vertical:         5px;
@padding-small-horizontal:       10px;

@line-height-large:              1.33;
@line-height-small:              1.5;

@border-radius-base:             4px;
@border-radius-large:            6px;
@border-radius-small:            3px;

@component-active-bg:            @brand-primary;

@caret-width-base:               4px;
@caret-width-large:              5px;

 // Tables
 // -------------------------

@table-cell-padding:                 8px;
@table-condensed-cell-padding:       5px;

@table-bg:                           transparent; // overall background-color
@table-bg-accent:                    #f9f9f9; // for striping
@table-bg-hover:                     #f5f5f5;
@table-bg-active:                    @table-bg-hover;

@table-border-color:                 #ddd; // table and cell border


 // Buttons
 // -------------------------

@btn-font-weight:                normal;

@btn-default-color:              #333;
@btn-default-bg:                 #fff;
@btn-default-border:             #ccc;

@btn-primary-color:              #fff;
@btn-primary-bg:                 @brand-primary;
@btn-primary-border:             darken(@btn-primary-bg, 5%);

@btn-success-color:              #fff;
@btn-success-bg:                 @brand-success;
@btn-success-border:             darken(@btn-success-bg, 5%);

@btn-warning-color:              #fff;
@btn-warning-bg:                 @brand-warning;
@btn-warning-border:             darken(@btn-warning-bg, 5%);

@btn-danger-color:               #fff;
@btn-danger-bg:                  @brand-danger;
@btn-danger-border:              darken(@btn-danger-bg, 5%);

@btn-info-color:                 #fff;
@btn-info-bg:                    @brand-info;
@btn-info-border:                darken(@btn-info-bg, 5%);

@btn-link-disabled-color:        @gray-light;


 // Forms
 // -------------------------

@input-bg:                       #fff;
@input-bg-disabled:              @gray-lighter;

@input-color:                    @gray;
@input-border:                   #ccc;
@input-border-radius:            @border-radius-base;
@input-border-focus:             #66afe9;

@input-color-placeholder:        @gray-light;

@input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
@input-height-large:             (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
@input-height-small:             (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);

@legend-color:                   @gray-dark;
@legend-border-color:            #e5e5e5;

@input-group-addon-bg:           @gray-lighter;
@input-group-addon-border-color: @input-border;


 // Dropdowns
 // -------------------------

@dropdown-bg:                    #fff;
@dropdown-border:                rgba(0,0,0,.15);
@dropdown-fallback-border:       #ccc;
@dropdown-divider-bg:            #e5e5e5;

@dropdown-link-active-color:     #fff;
@dropdown-link-active-bg:        @component-active-bg;

@dropdown-link-color:            @gray-dark;
@dropdown-link-hover-color:      #fff;
@dropdown-link-hover-bg:         @dropdown-link-active-bg;

@dropdown-link-disabled-color:   @gray-light;

@dropdown-header-color:          @gray-light;

@dropdown-caret-color:           #000;


 // COMPONENT VARIABLES
 // --------------------------------------------------


 // Z-index master list
 // -------------------------
 // Used for a bird's eye view of components dependent on the z-axis
 // Try to avoid customizing these :)

@zindex-navbar:            1000;
@zindex-dropdown:          1000;
@zindex-popover:           1010;
@zindex-tooltip:           1030;
@zindex-navbar-fixed:      1030;
@zindex-modal-background:  1040;
@zindex-modal:             1050;

 // Media queries breakpoints
 // --------------------------------------------------

 // Extra small screen / phone
@screen-xs:                  480px;
@screen-phone:               @screen-xs;

 // Small screen / tablet
@screen-sm:                  768px;
@screen-tablet:              @screen-sm;

 // Medium screen / desktop
@screen-md:                  992px;
@screen-desktop:             @screen-md;

 // Large screen / wide desktop
@screen-lg:                  1200px;
@screen-lg-desktop:          @screen-lg;

 // So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-sm - 1);
@screen-sm-max:              (@screen-md - 1);
@screen-md-max:              (@screen-lg - 1);


 // Grid system
 // --------------------------------------------------

 // Number of columns in the grid system
@grid-columns:              12;
 // Padding, to be divided by two and applied to the left and right of all columns
@grid-gutter-width:         30px;
 // Point at which the navbar stops collapsing
@grid-float-breakpoint:     @screen-tablet;


 // Navbar
 // -------------------------

 // Basics of a navbar
@navbar-height:                    50px;
@navbar-margin-bottom:             @line-height-computed;
@navbar-default-color:             #777;
@navbar-default-bg:                #f8f8f8;
@navbar-default-border:            darken(@navbar-default-bg, 6.5%);
@navbar-border-radius:             @border-radius-base;
@navbar-padding-horizontal:        floor(@grid-gutter-width / 2);
@navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);

 // Navbar links
@navbar-default-link-color:                #777;
@navbar-default-link-hover-color:          #333;
@navbar-default-link-hover-bg:             transparent;
@navbar-default-link-active-color:         #555;
@navbar-default-link-active-bg:            darken(@navbar-default-bg, 6.5%);
@navbar-default-link-disabled-color:       #ccc;
@navbar-default-link-disabled-bg:          transparent;

 // Navbar brand label
@navbar-default-brand-color:               @navbar-default-link-color;
@navbar-default-brand-hover-color:         darken(@navbar-default-link-color, 10%);
@navbar-default-brand-hover-bg:            transparent;

 // Navbar toggle
@navbar-default-toggle-hover-bg:           #ddd;
@navbar-default-toggle-icon-bar-bg:        #ccc;
@navbar-default-toggle-border-color:       #ddd;


 // Inverted navbar
 //
 // Reset inverted navbar basics
@navbar-inverse-color:                      @gray-light;
@navbar-inverse-bg:                         #222;
@navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);

 // Inverted navbar links
@navbar-inverse-link-color:                 @gray-light;
@navbar-inverse-link-hover-color:           #fff;
@navbar-inverse-link-hover-bg:              transparent;
@navbar-inverse-link-active-color:          @navbar-inverse-link-hover-color;
@navbar-inverse-link-active-bg:             darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-disabled-color:        #444;
@navbar-inverse-link-disabled-bg:           transparent;

 // Inverted navbar brand label
@navbar-inverse-brand-color:                @navbar-inverse-link-color;
@navbar-inverse-brand-hover-color:          #fff;
@navbar-inverse-brand-hover-bg:             transparent;

 // Inverted navbar search
 // Normal navbar needs no special styles or vars
@navbar-inverse-search-bg:                  lighten(@navbar-inverse-bg, 25%);
@navbar-inverse-search-bg-focus:            #fff;
@navbar-inverse-search-border:              @navbar-inverse-bg;
@navbar-inverse-search-placeholder-color:   #ccc;

 // Inverted navbar toggle
@navbar-inverse-toggle-hover-bg:            #333;
@navbar-inverse-toggle-icon-bar-bg:         #fff;
@navbar-inverse-toggle-border-color:        #333;


 // Navs
 // -------------------------

@nav-link-padding:                          10px 15px;
@nav-link-hover-bg:                         @gray-lighter;

@nav-disabled-link-color:                   @gray-light;
@nav-disabled-link-hover-color:             @gray-light;

@nav-open-link-hover-color:                 #fff;
@nav-open-caret-border-color:               #fff;

 // Tabs
@nav-tabs-border-color:                     #ddd;

@nav-tabs-link-hover-border-color:          @gray-lighter;

@nav-tabs-active-link-hover-bg:             @body-bg;
@nav-tabs-active-link-hover-color:          @gray;
@nav-tabs-active-link-hover-border-color:   #ddd;

@nav-tabs-justified-link-border-color:            #ddd;
@nav-tabs-justified-active-link-border-color:     @body-bg;

 // Pills
@nav-pills-active-link-hover-bg:            @component-active-bg;
@nav-pills-active-link-hover-color:         #fff;


 // Pagination
 // -------------------------

@pagination-bg:                        #fff;
@pagination-border:                    #ddd;

@pagination-hover-bg:                  @gray-lighter;

@pagination-active-bg:                 @brand-primary;
@pagination-active-color:              #fff;

@pagination-disabled-color:            @gray-light;


 // Pager
 // -------------------------

@pager-border-radius:                  15px;
@pager-disabled-color:                 @gray-light;


 // Jumbotron
 // -------------------------

@jumbotron-padding:              30px;
@jumbotron-color:                inherit;
@jumbotron-bg:                   @gray-lighter;

@jumbotron-heading-color:        inherit;


 // Form states and alerts
 // -------------------------

@state-warning-text:             #c09853;
@state-warning-bg:               #fcf8e3;
@state-warning-border:           darken(spin(@state-warning-bg, -10), 3%);

@state-danger-text:              #b94a48;
@state-danger-bg:                #f2dede;
@state-danger-border:            darken(spin(@state-danger-bg, -10), 3%);

@state-success-text:             #468847;
@state-success-bg:               #dff0d8;
@state-success-border:           darken(spin(@state-success-bg, -10), 5%);

@state-info-text:                #3a87ad;
@state-info-bg:                  #d9edf7;
@state-info-border:              darken(spin(@state-info-bg, -10), 7%);


 // Tooltips
 // -------------------------
@tooltip-max-width:           200px;
@tooltip-color:               #fff;
@tooltip-bg:                  #000;

@tooltip-arrow-width:         5px;
@tooltip-arrow-color:         @tooltip-bg;


 // Popovers
 // -------------------------
@popover-bg:                          #fff;
@popover-max-width:                   276px;
@popover-border-color:                rgba(0,0,0,.2);
@popover-fallback-border-color:       #ccc;

@popover-title-bg:                    darken(@popover-bg, 3%);

@popover-arrow-width:                 10px;
@popover-arrow-color:                 #fff;

@popover-arrow-outer-width:           (@popover-arrow-width + 1);
@popover-arrow-outer-color:           rgba(0,0,0,.25);
@popover-arrow-outer-fallback-color:  #999;


 // Labels
 // -------------------------

@label-default-bg:            @gray-light;
@label-primary-bg:            @brand-primary;
@label-success-bg:            @brand-success;
@label-info-bg:               @brand-info;
@label-warning-bg:            @brand-warning;
@label-danger-bg:             @brand-danger;

@label-color:                 #fff;
@label-link-hover-color:      #fff;


 // Modals
 // -------------------------
@modal-inner-padding:         20px;

@modal-title-padding:         15px;
@modal-title-line-height:     @line-height-base;

@modal-content-bg:                             #fff;
@modal-content-border-color:                   rgba(0,0,0,.2);
@modal-content-fallback-border-color:          #999;

@modal-backdrop-bg:           #000;
@modal-header-border-color:   #e5e5e5;
@modal-footer-border-color:   @modal-header-border-color;


 // Alerts
 // -------------------------
@alert-padding:               15px;
@alert-border-radius:         @border-radius-base;
@alert-link-font-weight:      bold;

@alert-success-bg:            @state-success-bg;
@alert-success-text:          @state-success-text;
@alert-success-border:        @state-success-border;

@alert-info-bg:               @state-info-bg;
@alert-info-text:             @state-info-text;
@alert-info-border:           @state-info-border;

@alert-warning-bg:            @state-warning-bg;
@alert-warning-text:          @state-warning-text;
@alert-warning-border:        @state-warning-border;

@alert-danger-bg:             @state-danger-bg;
@alert-danger-text:           @state-danger-text;
@alert-danger-border:         @state-danger-border;


 // Progress bars
 // -------------------------
@progress-bg:                 #f5f5f5;
@progress-bar-color:          #fff;

@progress-bar-bg:             @brand-primary;
@progress-bar-success-bg:     @brand-success;
@progress-bar-warning-bg:     @brand-warning;
@progress-bar-danger-bg:      @brand-danger;
@progress-bar-info-bg:        @brand-info;


 // List group
 // -------------------------
@list-group-bg:               #fff;
@list-group-border:           #ddd;
@list-group-border-radius:    @border-radius-base;

@list-group-hover-bg:         #f5f5f5;
@list-group-active-color:     #fff;
@list-group-active-bg:        @component-active-bg;
@list-group-active-border:    @list-group-active-bg;

@list-group-link-color:          #555;
@list-group-link-heading-color:  #333;


 // Panels
 // -------------------------
@panel-bg:                    #fff;
@panel-inner-border:          #ddd;
@panel-border-radius:         @border-radius-base;
@panel-footer-bg:             #f5f5f5;

@panel-default-text:          @gray-dark;
@panel-default-border:        #ddd;
@panel-default-heading-bg:    #f5f5f5;

@panel-primary-text:          #fff;
@panel-primary-border:        @brand-primary;
@panel-primary-heading-bg:    @brand-primary;

@panel-success-text:          @state-success-text;
@panel-success-border:        @state-success-border;
@panel-success-heading-bg:    @state-success-bg;

@panel-warning-text:          @state-warning-text;
@panel-warning-border:        @state-warning-border;
@panel-warning-heading-bg:    @state-warning-bg;

@panel-danger-text:           @state-danger-text;
@panel-danger-border:         @state-danger-border;
@panel-danger-heading-bg:     @state-danger-bg;

@panel-info-text:             @state-info-text;
@panel-info-border:           @state-info-border;
@panel-info-heading-bg:       @state-info-bg;


 // Thumbnails
 // -------------------------
@thumbnail-padding:           4px;
@thumbnail-bg:                @body-bg;
@thumbnail-border:            #ddd;
@thumbnail-border-radius:     @border-radius-base;

@thumbnail-caption-color:     @text-color;
@thumbnail-caption-padding:   9px;


 // Wells
 // -------------------------
@well-bg:                     #f5f5f5;


 // Badges
 // -------------------------
@badge-color:                 #fff;
@badge-link-hover-color:      #fff;
@badge-bg:                    @gray-light;

@badge-active-color:          @link-color;
@badge-active-bg:             #fff;

@badge-font-weight:           bold;
@badge-line-height:           1;
@badge-border-radius:         10px;


 // Breadcrumbs
 // -------------------------
@breadcrumb-bg:               #f5f5f5;
@breadcrumb-color:            #ccc;
@breadcrumb-active-color:     @gray-light;


 // Carousel
 // ------------------------

@carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6);

@carousel-control-color:                      #fff;
@carousel-control-width:                      15%;
@carousel-control-opacity:                    .5;
@carousel-control-font-size:                  20px;

@carousel-indicator-active-bg:                #fff;
@carousel-indicator-border-color:             #fff;

@carousel-caption-color:                      #fff;


 // Close
 // ------------------------
@close-color:                 #000;
@close-font-weight:           bold;
@close-text-shadow:           0 1px 0 #fff;


 // Code
 // ------------------------
@code-color:                  #c7254e;
@code-bg:                     #f9f2f4;

@pre-bg:                      #f5f5f5;
@pre-color:                   @gray-dark;
@pre-border-color:            #ccc;
@pre-scrollable-max-height:   340px;

 // Type
 // ------------------------
@text-muted:                  @gray-light;
@abbr-border-color:           @gray-light;
@headings-small-color:        @gray-light;
@blockquote-small-color:      @gray-light;
@blockquote-border-color:     @gray-lighter;
@page-header-border-color:    @gray-lighter;

 // Miscellaneous
 // -------------------------

 // Hr border color
@hr-border:                   @gray-lighter;

 // Horizontal forms & lists
@component-offset-horizontal: 180px;


 // Container sizes
 // --------------------------------------------------

 // Small screen / tablet
@container-tablet:            ((720px + @grid-gutter-width));

 // Medium screen / desktop
@container-desktop:           ((940px + @grid-gutter-width));

 // Large screen / wide desktop
@container-lg-desktop:        ((1140px + @grid-gutter-width));
--- a/vendor/styles/normalize-2.1.0.css
+++ b/vendor/styles/normalize-2.1.0.css
@ -1,396 +0,0 @@
 /*! normalize.css v2.1.0 | MIT License | git.io/normalize */

 /* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

 /**
 * Correct `block` display not defined in IE 8/9.
 */

 article,
 aside,
 details,
 figcaption,
 figure,
 footer,
 header,
 hgroup,