bootswatch-rails 0.2.0 → 0.3.0

data/.gitmodules

@@ -0,0 +1,3 @@
+[submodule "bootswatch"]
+	path = bootswatch
+	url = git@github.com:thomaspark/bootswatch.git

data/HISTORY.md

@@ -0,0 +1,7 @@
+## 0.3.0 (2013-01-13)
+
+* Add a converter script for most of the repetitive less/sass conversion work
+* Add bootswatch project as a submodule
+* Add a rake task that auto-converts less files from submodule into scss
+* Convert all latest bootswatches to scss
+* Stop using percentage -> percentile conversion, it seems to only break things

data/README.md

@@ -1,6 +1,10 @@
 # bootswatch-rails
 
-This gem is meant to be used with [bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass). It gives you complete scss versions of [bootswatches](http://bootswatch.com) for use in your Rails 3 asset pipeline, just like bootstrap-sass gives you scss version of bootstrap itself.
+This gem is meant to be used with
+[bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass). It gives
+you complete scss versions of [bootswatches](http://bootswatch.com) for use in
+your Rails 3 asset pipeline, just like bootstrap-sass gives you scss version of
+bootstrap itself.
 
 ## Installation
 
@@ -14,9 +18,15 @@ And then execute:
 
 ## Usage
 
-When using bootstrap-sass, it's recommended to avoid sprockets in your stylesheets. In order to do that you simply rename your `application.css` file to `application.css.scss`, remove all sprockets comments, and instead use sass `@import` commands. These commands are smart enough to fully support asset pipeline load paths, thanks to `sass-rails` gem.
+When using bootstrap-sass, it's recommended to avoid sprockets in your
+stylesheets. In order to do that you simply rename your `application.css` file
+to `application.css.scss`, remove all sprockets comments, and instead use sass
+`@import` commands. These commands are smart enough to fully support asset
+pipeline load paths, thanks to `sass-rails` gem.
 
-Here's approximately how your `application.css.scss` file should look like, considering that you're using [bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass).
+Here's approximately how your `application.css.scss` file should look like,
+considering that you're using
+[bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass).
 
     // Example using 'Cerulean' bootswatch
     //
@@ -40,7 +50,7 @@ Here's approximately how your `application.css.scss` file should look like, cons
 
 ## Bootswatches
 
-I'm converting/updating them as time permits. Here's what's included at this point.
+Included bootswatches
 
 * [Amelia](http://bootswatch.com/amelia/)
 * [Cerulean](http://bootswatch.com/cerulean/)
@@ -67,6 +77,5 @@ I'm converting/updating them as time permits. Here's what's included at this poi
 
 Big thanks to these guys.
 
-[Thomas Park](http://github.com/thomaspark) for [bootswatch](http://bootswatch.com/)
-
-[Thomas McDonald](http://github.com/thomas-mcdonald) for [bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass)
+* [Thomas Park](http://github.com/thomaspark) for [bootswatch](http://bootswatch.com/)
+* [Thomas McDonald](http://github.com/thomas-mcdonald) for [bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass)

data/Rakefile

@@ -1,2 +1,34 @@
 #!/usr/bin/env rake
 require "bundler/gem_tasks"
+
+THEMES = %w(
+  amelia
+  cerulean
+  cosmo
+  cyborg
+  journal
+  readable
+  simplex
+  slate
+  spacelab
+  spruce
+  superhero
+  united
+).freeze
+
+
+LESS_FILES = FileList["bootswatch/{#{THEMES.join(',')}}/*.less"]
+SCSS_FILES = LESS_FILES.pathmap(
+  'vendor/assets/stylesheets/bootswatch/%-1d/_%n.scss'
+)
+
+SCSS_FILES.zip(LESS_FILES).each do |target, source|
+  directory File.dirname(target)
+
+  file target => [File.dirname(target), source] do
+    sh "./converter #{source} #{target}"
+  end
+end
+
+desc 'Imprecisely convert LESS files to SCSS files'
+task convert: SCSS_FILES

data/converter

@@ -0,0 +1,112 @@
+#!/usr/bin/env ruby
+
+src_file_path, dst_file_path = *ARGV
+lines = File.readlines(src_file_path)
+
+indent_size_calc = lambda do |line|
+  size = 0
+
+  line.each_char do |char|
+    char =~ /\s/ ? size += 1 : break
+  end
+
+  size
+end
+
+swap_variable_prefix = lambda do |line, _|
+  line.gsub(/\@[[:alnum:]]+/) do |var|
+    if %w(@media @import).include?(var)
+      var
+    else
+      var.sub('@', '$')
+    end
+  end
+end
+
+turn_percentages_into_percentiles = lambda do |line, _|
+  line.gsub(/([\d\.]+)%/) do
+    ($1.to_f / 100.0).to_s.sub(/^0/, '')
+  end
+end
+
+convert_mixin_declarations = lambda do |line, _|
+  line.sub(/^\.([^\(\s]+)\(/) do
+    "@mixin #{$1}("
+  end
+end
+
+convert_namespace_include_syntax = lambda do |line, _|
+  line.sub(/#(\S+)\s+>\s+\.([[:alnum:]]+)/) do
+    "@include #{$1}-#{$2}"
+  end
+end
+
+convert_include_syntax = lambda do |line, _|
+  line.sub(/^(\s+)\.([^\(\s]+)\(/) do
+    "#{$1}@include #{$2}("
+  end
+end
+
+swap_spin_adjust_hue = lambda do |line, _|
+  line.gsub(/(\W)spin\(/) do
+    "#{$1}adjust-hue("
+  end
+end
+
+resolve_ampersand_dash = lambda do |line, index|
+  line.sub(/^(\s*)&-(\S+)/) do
+    indent, suffix, prefix = $1, $2, ''
+
+    while index > 0
+      index -= 1
+      parent = lines[index]
+      next if parent.strip == ''
+
+      parent_indent_size = indent_size_calc.call(parent)
+      if parent_indent_size < indent.size
+        prefix = parent[/^\s*(\S+)/, 1].to_s.strip
+        break
+      end
+    end
+
+    if prefix == ''
+      raise "Could not find parent for &- substitution on line #{index}\n" +
+        line
+    else
+      "#{indent}#{prefix}-#{suffix}"
+    end
+  end
+end
+
+clear_out_escapes = lambda do |line, index|
+  line.gsub(/~"([^"]+)"/) { $1 }
+end
+
+line_processors = [
+  swap_variable_prefix,
+  # turn_percentages_into_percentiles,
+  convert_mixin_declarations,
+  convert_namespace_include_syntax,
+  convert_include_syntax,
+  swap_spin_adjust_hue,
+  resolve_ampersand_dash,
+  clear_out_escapes
+]
+
+comment_line = /^\s*\/\//
+
+processed_lines = lines.map.with_index do |line, index|
+  if line =~ comment_line
+    line
+  else
+    line_processors.each do |processor|
+      line = processor.call(line, index)
+    end
+
+    line
+  end
+end
+
+File.open(dst_file_path, 'w') do |file|
+  file.write(processed_lines.join)
+end

data/lib/bootswatch-rails/version.rb

@@ -1,5 +1,5 @@
 module Bootswatch
   module Rails
-    VERSION = "0.2.0"
+    VERSION = "0.3.0"
   end
 end

data/vendor/assets/stylesheets/bootswatch/amelia/_bootswatch.scss

@@ -1,16 +1,12 @@
-// Swatch: Amelia
-// Version: 2.0.2
+// Amelia 2.2.2
+// Bootswatch
 // -----------------------------------------------------
 
+
 // TYPOGRAPHY
 // -----------------------------------------------------
 
-@import url("https://fonts.googleapis.com/css?family=Lobster");
-@import url("https://fonts.googleapis.com/css?family=Cabin:400,700");
-
-.navbar .brand, legend {
-	font-family: $headingsFontFamily;
-}
+@import url('//fonts.googleapis.com/css?family=Lobster|Cabin:400,700');
 
 h6 {
 	color: $textColor;
@@ -21,6 +17,24 @@ h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
 	color: $textColor;
 }
 
+code, pre {
+	background-color: rgba(255, 255, 255, 0.3);
+	padding: 2px;
+}
+
+blockquote {
+
+	border-left-color: lighten(#147E88, 12%);
+
+	&.pull-right {
+		border-right-color: lighten(#147E88, 12%);
+	}
+
+	small {
+		color: rgba(255, 255, 255, 0.6);
+	}
+}
+
 .muted {
 	color: rgba(255, 255, 255, 0.5);
 }
@@ -29,7 +43,7 @@ h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
 // -----------------------------------------------------
 
 body {
-	@include gradient-radial(lighten(#0F8790, .07), #0F8790);
+	@include gradient-radial(lighten(#0F8790, 7%), #0F8790);
 }
 
 hr {
@@ -37,27 +51,22 @@ hr {
 }
 
 .page-header {
+	margin: 30px 0 15px;
 	border-bottom: 0px solid transparent;
 }
 
-footer.footer {
-	border-top: 1px solid rgba(255, 255, 255, 0.3);
-
-	p {
-		color: $textColor;
-	}
-}
-
 // NAVBAR
 // -----------------------------------------------------
 
 .navbar {
+
 	.navbar-inner {
 		@include border-radius(0);
 	}
 
 	.brand {
-		padding-top: 12px;
+		padding: 15px 20px 14px;
+		font-family: $headingsFontFamily;
 		font-size: 24px;
 		font-weight: normal;
 	}
@@ -68,34 +77,96 @@ footer.footer {
 		text-shadow: none;
 	}
 
+	.nav > .active > a,
+	.nav > .active > a:hover,
+	.navbar .nav > .active > a:focus {
+		@include box-shadow(none);
+	}
+
 	.navbar-search {
 		margin-top: 10px;
 	}
 
 	.navbar-search .search-query {
-		border: 2px solid lighten($navbarBackground, .1);
 		@include border-radius(0);
-		@include box-shadow(none);
+		padding-top: 5px;
+		padding-bottom: 5px;
+	}
+
+	.navbar-text {
+		margin: 17px 15px 14px;
+		line-height: 20px;
+	}
+
+	.btn,
+	.btn-group {
+		padding: 4px;
+	}
+
+	.navbar-inverse {
+
+		.dropdown-menu li > a:hover,
+		.dropdown-menu li > a:focus,
+		.dropdown-submenu:hover > a {
+			background-image: none;
+			background-color: $yellow;
+		}
+	}
+}
+
+@media (max-width: $navbarCollapseWidth) {
+
+	.navbar .nav-collapse {
+
+		.nav li > a {
+
+			color: $textColor;
+			@include border-radius(0);
+
+			&:hover {
+				background-color: lighten($navbarBackground, 10%);
+			}
+		}
+
+		.dropdown-menu li > a:hover,
+		.dropdown-menu li > a:focus,
+		.dropdown-submenu:hover > a {
+			background-image: none;
+		}
 
-		&:focus, &.focus {
-			background-color: $grayLighter;
-			border-color: $grayLighter;
-			text-shadow: none;
-			padding: 4px 9px;
+		.navbar-form,
+		.navbar-search {
 			@include box-shadow(none);
+			border: none;
+		}
+
+		.navbar-search .search-query {
+			border: 2px solid $textColor;
+		}
+
+		.nav-header {
+			color: rgba(255, 255, 255, 0.5);
 		}
+	}
+
+	.navbar-inverse .nav-collapse {
 
+		.nav li > a:hover,
+		.dropdown-menu a:hover {
+			background-color: lighten($navbarInverseBackground, 10%) !important;
+		}
 	}
 }
 
 div.subnav {
+
 	background-color: rgba(42, 99, 105, 0.9);
 	background-image: none;
 	border: 0px solid transparent;
 	@include border-radius(0);
 	@include box-shadow(none);
 
-	.nav > li.dropdown.open > a {
+	.nav > li.open > a {
 		border-color: transparent;
 		background-color: rgba(255, 255, 255, 0.4);
 	}
@@ -119,7 +190,8 @@ div.subnav {
 
 	.nav > .active > a:hover,
 	.nav > li > a:hover,
-	.nav > li.active > a:hover, {
+	.nav > .active > a,
+	.nav > .active > a:hover, {
 		border-right-color: transparent;
 		background-color: rgba(255, 255, 255, 0.4);
 		color: $textColor;
@@ -129,30 +201,164 @@ div.subnav {
 		border-left-color: rgba(255, 255, 255, 0.4);
 		border-left-width: 1px;
 	}
+
+	div.subnav-fixed {
+		top: 50px;
+	}
 }
 
-div.subnav-fixed {
-	top: 50px;
+// NAV
+// -----------------------------------------------------
+
+.nav-tabs li.open > .dropdown-toggle,
+.nav-pills li.open > .dropdown-toggle {
+	background-color: #8AD5DC;
+	color: $linkColor;
+	border-color: transparent;
 }
 
-.navbar .nav-collapse.in {
+.nav-tabs, .nav-pills {
+	border-color: transparent;
+
+	li > a {
+		border-color: transparent;
+		@include border-radius(0);
+		@include box-shadow(0);
+	}
 
-	.nav li > a {
+	li.active > a,
+	li.active > a:hover {
 		color: $textColor;
+	}
+
+	li.active > a,
+	li > a:hover,
+	li.active > a:hover {
+		background-color: #8AD5DC;
+		border-color: transparent;
+		text-shadow: none;
+	}
+}
+
+.nav-tabs, .nav-tabs > li > a {
+	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
+}
+
+.nav-tabs > li > a {
+	background-color: #3CB9C6;
+}
+
+.nav-tabs.nav-stacked {
+
+	li > a:first-child,
+	li > a:last-child {
 		@include border-radius(0);
 	}
 
-	li > a:hover {
-		background-color: lighten($navbarBackground, .1);
+	li > a,
+	li > a:hover,
+	li.active > a,
+	li.active > a:hover {
+		border-color: transparent;
 	}
+}
 
-	.navbar-form, .navbar-search {
-		@include box-shadow(none);
-		border-color: lighten($navbarBackground, .1);
+.nav-list {
+
+	.nav-header {
+		text-shadow: none;
+		color: $textColor;
 	}
 
-	.navbar-search .search-query {
-		border: 2px solid $textColor;
+	li > a {
+		text-shadow: none;
+	}
+
+	li.active > a,
+	li > a:hover,
+	li.active > a:hover {
+		background-color: #8AD5DC;
+		text-shadow: none;
+	}
+
+	.divider {
+		background-color: rgba(255, 255, 255, 0.3);
+		border-bottom: none;
+	}
+}
+
+.breadcrumb, .pager > li > a {
+	border-color: transparent;
+	@include border-radius(0);
+	@include box-shadow(none);
+	text-shadow: none;
+}
+
+.breadcrumb {
+	background-color: #3CB9C6;
+	background-image: none;
+
+	li {
+		text-shadow: none;
+	}
+
+	.active {
+		color: $white;
+	}
+
+	.divider {
+		color: $linkColor;
+	}
+}
+
+.pagination {
+
+	ul  {
+		background-color: $paginationBackground;
+		background-image: none;
+		@include border-radius(0);
+	}
+
+	ul > li > a:hover {
+		background-color: rgba(255, 255, 255, 0.4);
+		color: $linkColor;
+	}
+
+	ul > li:first-child > a,
+	ul > li:last-child > a {
+		@include border-radius(0);
+	}
+
+	ul > .disabled > a,
+	ul > .disabled > a:hover,
+	ul > .disabled > span,
+	ul > .disabled > span:hover {
+		color: $textColor;
+	}
+
+	ul > .active > a,
+	ul > .active > a:hover,
+	ul > .active > span,
+	ul > .active > span:hover {
+		background-color: rgba(255, 255, 255, 0.4);
+		color: $textColor;
+	}
+}
+
+.pager {
+
+	li > a {
+		background-color: #3CB9C6;
+
+		&:hover {
+			background-color: #8AD5DC;
+		}
+	}
+
+	.disabled a,
+	.disabled a:hover {
+		background-color: #3CB9C6;
+		color: $white;
 	}
 }
 
@@ -165,19 +371,19 @@ div.subnav-fixed {
   border-color: transparent;
 
   &:hover, &:active, &.active, &.disabled, &[disabled] {
-    background-color: darken($color, .05);
+    background-color: darken($color, 5%);
 	text-shadow: none;
   }
 
   &:active, &.active {
-    background-color: darken($color, .15);
+    background-color: darken($color, 15%);
 	@include box-shadow(none);
   }
 
   // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
   &:active,
   &.active {
-    background-color: darken($color, .15) e("\9");
+    background-color: darken($color, 15%) e("\9");
   }
 }
 
@@ -191,23 +397,13 @@ div.subnav-fixed {
 }
 
 .btn-group .btn:first-child {
-  margin-left: 0;
-     -webkit-border-top-left-radius: 0;
-         -moz-border-radius-topleft: 0;
-             border-top-left-radius: 0;
-  -webkit-border-bottom-left-radius: 0;
-      -moz-border-radius-bottomleft: 0;
-          border-bottom-left-radius: 0;
+	margin-left: 0;
+	@include border-radius(0);
 }
 
 .btn-group .btn:last-child,
 .btn-group .dropdown-toggle {
-     -webkit-border-top-right-radius: 0;
-         -moz-border-radius-topright: 0;
-             border-top-right-radius: 0;
-  -webkit-border-bottom-right-radius: 0;
-      -moz-border-radius-bottomright: 0;
-          border-bottom-right-radius: 0;
+     @include border-radius(0);
 }
 
 .btn-group .dropdown-toggle,
@@ -240,8 +436,8 @@ div.subnav-fixed {
   @include buttonBackgroundCustom($btnInverseBackground);
 }
 
-.btn-small {
-	padding: 13px 16px 12px;
+.btn-link {
+	@include buttonBackgroundCustom($btnPrimaryBackground);
 }
 
 [class^="icon-"], [class*=" icon-"] {
@@ -253,7 +449,7 @@ div.subnav-fixed {
 	margin-top: 1px;
 }
 
-.add-on  [class^="icon-"] {
+.add-on [class^="icon-"] {
 	margin-left: 5px;
 }
 
@@ -269,9 +465,28 @@ div.subnav-fixed {
 	@include border-radius(0);
 }
 
+.table tbody {
+
+	tr.success td {
+		background-color: $green;
+	}
+
+	tr.error td {
+		background-color: $red;
+	}
+
+	tr.info td {
+		background-color: $blue;
+	}
+}
+
 // FORMS
 // -----------------------------------------------------
 
+legend {
+	font-family: $headingsFontFamily;
+}
+
 legend, label, .help-block, .input-file {
 	color: $textColor;
 	border: 0px solid transparent;
@@ -298,33 +513,32 @@ input, textarea, .search-query, .uneditable-input,
 .input-append input, .input-append .uneditable-input,
 .input-prepend input, .input-prepend .uneditable-input {
 	border-color: transparent;
-	@include border-radius(0);
 	@include box-shadow(none);
 }
 
 .form-actions {
-	background-color: transparent;
 	border-top: 0px solid transparent;
 }
 
 .control-group.warning > label,
 .control-group.warning .help-inline {
-	color: lighten($orange, .3);
+	color: lighten($orange, 30%);
 }
 
 .control-group.error > label,
 .control-group.error .help-inline {
-	color: lighten($linkColor, .1);
+	color: lighten($linkColor, 10%);
 }
 
 .control-group.success > label,
 .control-group.success .help-inline {
-	color: lighten($green, .2);
+	color: lighten($green, 20%);
 }
 
-.input-prepend .add-on, .input-append .add-on {
-	height: 25px;
-	padding-top: 9px;
+.input-prepend .add-on,
+.input-append .add-on {
+	height: 20px;
+	padding-top: 4px;
 	background-color: $grayLighter;
 	border-color: transparent;
 	@include border-radius(0);
@@ -332,167 +546,30 @@ input, textarea, .search-query, .uneditable-input,
 	text-shadow: none;
 }
 
-// NAVIGATION
-// -----------------------------------------------------
-
-.breadcrumb, .pager > li > a {
-	border-color: transparent;
-	@include border-radius(0);
-	@include box-shadow(none);
-	text-shadow: none;
-}
-
-.breadcrumb {
-	background-color: #3CB9C6;
-	background-image: none;
-
-	li {
-		text-shadow: none;
-	}
-
-	.divider {
-		color: $linkColor;
-	}
-}
-
-.pager > li > a {
-	background-color: #3CB9C6;
-
-	&:hover {
-		background-color: #8AD5DC;
-	}
-}
-
-.pagination {
-
-	ul  {
-		background-color: #3CB9C6;
-		background-image: none;
-	}
-
-	li a {
-		border: 0px solid transparent;
-	}
-
-	.disabled a, .disabled a:hover {
-		color: $textColor;
-	}
-
-	li a:hover {
-		background-color: rgba(255, 255, 255, 0.4);
-		color: $linkColor;
-	}
-
-	.active a, .active a:hover {
-		background-color: rgba(255, 255, 255, 0.4);
-		color: $textColor;
-	}
-
-	ul,
-	li:first-child a,
-	li:last-child a {
-		@include border-radius(0);
-	}
-
-}
-
-.nav-tabs .dropdown.open > .dropdown-toggle,
-.nav-pills .dropdown.open > .dropdown-toggle {
-	background-color: #8AD5DC;
-	color: $linkColor;
-	border-color: transparent;
-}
-
-.nav-tabs, .nav-pills {
-	border-color: transparent;
-
-	li > a {
-		border-color: transparent;
-		@include border-radius(0);
-		@include box-shadow(0);
-	}
-
-	li.active > a,
-	li:active > a,
-	li.active > a:hover,
-	li:active > a:hover {
-		color: $textColor;
-	}
-
-	li.active > a,
-	li:active > a,
-	li > a:hover,
-	li.active > a:hover,
-	li:active > a:hover {
-		background-color: #8AD5DC;
-		border-color: transparent;
-		text-shadow: none;
-	}
-}
-
-.nav-tabs, .nav-tabs > li > a {
-	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
+.input-append .btn,
+.input-prepend .btn {
+	padding: 4px 10px;
 }
 
-.nav-tabs > li > a {
-	background-color: #3CB9C6;
-}
-
-.nav-tabs.nav-stacked {
-
-	li > a:first-child,
-	li > a:last-child {
-		@include border-radius(0);
-	}
+// ALERTS, LABELS, BADGES
+// -----------------------------------------------------
 
-	li > a,
-	li > a:hover,
-	li.active > a,
-	li:active > a,
-	li.active > a:hover,
-	li:active > a:hover {
-		border-color: transparent;
-	}
-}
+.alert {
 
-.nav-list {
-	.nav-header {
-		text-shadow: none;
+	h1, h2, h3, h4, h5, h6 {
 		color: $textColor;
 	}
-
-	li > a {
-		text-shadow: none;
-	}
-
-	li.active > a,
-	li:active > a,
-	li > a:hover,
-	li.active > a:hover,
-	li:active > a:hover {
-		background-color: #8AD5DC;
-		text-shadow: none;
-	}
 }
 
-// MISCELLANEOUS
-// -----------------------------------------------------
-
-.alert, .label, .progress, .well, pre, code {
+.alert, .label {
 	border-color: transparent;
 	@include border-radius(0);
 	@include box-shadow(none);
 	text-shadow: none;
 }
 
-code, pre {
-	background-color: rgba(255, 255, 255, 0.3);
-	padding: 2px;
-}
-
-.well {
-	background-color: #3CB9C6;
-	background-image: none;
+.alert-heading {
+	color: $textColor;
 }
 
 .label, .label:hover {
@@ -507,7 +584,7 @@ code, pre {
 }
 
 .label-important, .label-important:hover, .alert-error {
-	background-color: darken($yellow, .03);
+	background-color: darken($yellow, 3%);
 	color: $textColor;
 }
 
@@ -521,18 +598,52 @@ code, pre {
 	color: $textColor;
 }
 
-.alert-heading {
-	color: $textColor;
+// MISCELLANEOUS
+// -----------------------------------------------------
+
+.progress, .well, pre, code {
+	border-color: transparent;
+	@include border-radius(0);
+	@include box-shadow(none);
+	text-shadow: none;
+}
+
+.well {
+	background-image: none;
+}
+
+.hero-unit {
+	@include border-radius(0);
+}
+
+.thumbnail {
+	border: 0 solid transparent;
+	@include border-radius(0);
+	@include box-shadow(none);
 }
 
 .progress {
+
 	background-image: none;
 	background-color: #27666D;
 
 	.bar {
+
 		@include box-shadow(none);
 		background-image: none;
-		background-color: $orange;
+		background-color: $yellow;
+
+		.bar-success {
+			background-color: $green;
+		}
+
+		.bar-warning {
+			background-color: $orange;
+		}
+
+		.bar-error {
+			background-color: $red;
+		}
 	}
 }
 
@@ -540,41 +651,76 @@ code, pre {
 	background-image: none;
 	background-color: #AD1D28;
 }
+
 .progress-danger.progress-striped .bar {
-  @include gradient-striped(#AD1D28);
+	@include gradient-striped(#AD1D28);
 }
 
 .progress-success .bar {
 	background-image: none;
 	background-color: $green;
 }
+
 .progress-success.progress-striped .bar {
-  @include gradient-striped($green);
+	@include gradient-striped($green);
 }
 
 .progress-info .bar {
 	background-image: none;
 	background-color: $blue;
 }
+
 .progress-info.progress-striped .bar {
-  @include gradient-striped($blue);
+	@include gradient-striped($blue);
 }
 
-.thumbnail {
-	border: 0px solid transparent;
+.modal {
+
 	@include border-radius(0);
-	@include box-shadow(none);
-}
 
-blockquote {
+	.modal-header {
+		background-color: $navbarBackground;
+		color: $white;
+	}
 
-	border-left-color: lighten(#147E88, .12);
+	.modal-body {
+		
+		color: $grayDark;
 
-	&.pull-right {
-		border-right-color: lighten(#147E88, .12);
+		h1, h2, h3, h4, h5, h6,
+		legend {
+			color: $red;
+		}
+
+		label,
+		.input-file {
+			color: $grayDark;
+		}
+
+		.help-block,
+		.help-inline {
+			color: $grayLight;
+		}
+
+		textarea,
+		input,
+		.uneditable-input {
+			border: 1px solid $grayLight;
+		}
 	}
+}
 
-	small {
-		color: rgba(255, 255, 255, 0.6);
+.popover {
+	
+	padding: 0;
+	@include border-radius(0);
+	color: $grayDark;
+
+	.popover-title {
+		@include border-radius(0);
+		color: $white;
 	}
 }
+
+// MEDIA QUERIES
+// -----------------------------------------------------