bootswatch-rails 0.2.0 → 0.3.0

data/vendor/assets/stylesheets/bootswatch/cosmo/_variables.scss

@@ -1,7 +1,6 @@
-// Variables to customize the look and feel of Bootstrap
-// Swatch: Cosmo
-// Version: 2.0.2
-// -----------------------------------------------------
+// Cosmo 2.2.2
+// Variables
+// --------------------------------------------------
 
 
 // Global values
@@ -40,7 +39,7 @@ $textColor:             #555;
 // Links
 // -------------------------
 $linkColor:             $blue;
-$linkColorHover:        darken($linkColor, 0.1);
+$linkColorHover:        darken($linkColor, 10%);
 
 
 // Typography
@@ -67,9 +66,9 @@ $fontSizeLarge:         $baseFontSize * 1.25; // ~18px
 $fontSizeSmall:         $baseFontSize * 0.85; // ~12px
 $fontSizeMini:          $baseFontSize * 0.75; // ~11px
 
-$paddingLarge:          11px 19px; // 44px
+$paddingLarge:          22px 30px; // 66px
 $paddingSmall:          2px 10px;  // 26px
-$paddingMini:           1px 6px;   // 24px
+$paddingMini:           2px 6px;   // 24px
 
 $baseBorderRadius:      0px;
 $borderRadiusLarge:     0px;
@@ -86,26 +85,26 @@ $tableBorder:                       #ddd; // table and cell border
 // Buttons
 // -------------------------
 $btnBackground:                     $grayLighter;
-$btnBackgroundHighlight:            darken($grayLighter, 0.15);
+$btnBackgroundHighlight:            darken($grayLighter, 15%);
 $btnBorder:                         #bbb;
 
-$btnPrimaryBackground:              lighten($blue, 0.05);
-$btnPrimaryBackgroundHighlight:     darken($blue, 0.05);
+$btnPrimaryBackground:              lighten($blue, 5%);
+$btnPrimaryBackgroundHighlight:     darken($blue, 5%);
 
-$btnInfoBackground:                 lighten($purple, 0.05);
-$btnInfoBackgroundHighlight:        darken($purple, 0.05);
+$btnInfoBackground:                 lighten($purple, 5%);
+$btnInfoBackgroundHighlight:        darken($purple, 5%);
 
-$btnSuccessBackground:              lighten($green, 0.05);
-$btnSuccessBackgroundHighlight:     darken($green, 0.05);
+$btnSuccessBackground:              lighten($green, 5%);
+$btnSuccessBackgroundHighlight:     darken($green, 5%);
 
-$btnWarningBackground:              lighten($orange, 0.05);
-$btnWarningBackgroundHighlight:     darken($orange, 0.05);
+$btnWarningBackground:              lighten($orange, 5%);
+$btnWarningBackgroundHighlight:     darken($orange, 5%);
 
-$btnDangerBackground:               lighten($red, 0.05);
-$btnDangerBackgroundHighlight:      darken($red, 0.05);
+$btnDangerBackground:               lighten($red, 5%);
+$btnDangerBackgroundHighlight:      darken($red, 5%);
 
-$btnInverseBackground:              lighten($black, 0.05);
-$btnInverseBackgroundHighlight:     darken($black, 0.05);
+$btnInverseBackground:              lighten($black, 5%);
+$btnInverseBackgroundHighlight:     darken($black, 5%);
 
 
 // Forms
@@ -127,7 +126,7 @@ $dropdownDividerBottom:         $white;
 
 $dropdownLinkColor:             $grayDark;
 $dropdownLinkColorHover:        $white;
-$dropdownLinkColorActive:       $dropdownLinkColor;
+$dropdownLinkColorActive:       $white;
 
 $dropdownLinkBackgroundActive:  $blue;
 $dropdownLinkBackgroundHover:   $dropdownLinkBackgroundActive;
@@ -182,7 +181,7 @@ $navbarCollapseWidth:             979px;
 $navbarCollapseDesktopWidth:      $navbarCollapseWidth + 1;
 
 $navbarHeight:                    50px;
-$navbarBackground:                #0062ff;
+$navbarBackground:                $grayDarker;
 $navbarBackgroundHighlight:       $navbarBackground;
 $navbarBorder:                    transparent;
 
@@ -207,7 +206,7 @@ $navbarInverseLinkColorActive:           $navbarInverseLinkColorHover;
 $navbarInverseLinkBackgroundHover:       rgba(0, 0, 0, 0.05);
 $navbarInverseLinkBackgroundActive:      $navbarInverseBackground;
 
-$navbarInverseSearchBackground:          lighten($navbarInverseBackground, 0.25);
+$navbarInverseSearchBackground:          lighten($navbarInverseBackground, 25%);
 $navbarInverseSearchBackgroundFocus:     $white;
 $navbarInverseSearchBorder:              $navbarInverseBackground;
 $navbarInverseSearchPlaceholderColor:    $grayDark;

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

@@ -1,22 +1,12 @@
-// Swatch: Cyborg
-// Version: 2.0.2
+// Cyborg 2.2.2
+// Bootswatch
 // -----------------------------------------------------
 
+
 // TYPOGRAPHY
 // -----------------------------------------------------
 
-@import url("https://fonts.googleapis.com/css?family=Droid+Sans:400,700");
-
-.navbar {
-	font-size: 16px;
-}
-
-.navbar .brand,
-.navbar .nav-collapse.in .nav li > a {
-	color: $grayLighter;
-	font-weight: normal;
-	text-shadow: none;
-}
+@import url('//fonts.googleapis.com/css?family=Droid+Sans:400,700');
 
 label, input, button, select, textarea,
 .navbar .search-query:-moz-placeholder,
@@ -25,15 +15,15 @@ label, input, button, select, textarea,
 	color: $gray;
 }
 
-.jumbotron h1 {
-	font-weight: normal !important;
+code, pre {
+	background-color: $grayLighter;
 }
 
 blockquote {
-	border-left: 5px solid $blue;
+	border-left: 5px solid $grayDark;
 
 	&.pull-right {
-		border-right: 5px solid $blue;
+		border-right: 5px solid $grayDark;
 	}
 }
 
@@ -50,229 +40,307 @@ body {
 }
 
 .page-header {
-	border-bottom: 2px solid $blue
+	border-bottom: 1px solid $grayDark
+}
+
+hr {
+	border-bottom: none;
 }
 
 // NAVBAR
 // -----------------------------------------------------
 
-.navbar-inner {
-  @include border-radius(0);
-  $shadow: none;
-  @include box-shadow($shadow);
-  border-bottom: 2px solid $blue
-}
+.navbar {
 
-.navbar .brand {
-	padding: 12px 20px 8px;
-}
+	.navbar-inner {
+		@include border-radius(0);
+		@include box-shadow(none);
+		border-bottom: 1px solid $grayDark;
+	}
 
-.navbar .nav li > a {
-	padding: 13px 10px 8px;
-	border-bottom: 3px solid rgba(0, 0, 0, 0);
-}
+	.brand {
+		padding: 15px 20px 15px;
+		color: $grayLighter;
+		font-weight: normal;
+		text-shadow: none;
+	}
 
-.navbar .nav .active > a,
-.navbar .nav li > a:hover,
-.navbar .brand:hover {
-	border-bottom: 3px solid $blue
-}
+	.nav > li > a {
+		padding: 15px 15px 14px;
+		border-bottom: 1px solid transparent;
+	}
 
-.navbar .search-query,
-.navbar .search-query:focus,
-.navbar .search-query.focused {
-	color: $grayLight;
-	text-shadow: none;
-	background-color: #222;
-	@include border-radius(1px);
-	@include placeholder($gray);
-}
+	.nav > li > a:hover,
+	.nav > .active > a,
+	.nav > .active > a:hover {
+		border-bottom: 1px solid $blue;
+	}
 
-.navbar .nav > li > a {
-	border-left: 1px solid #222;
-}
+	.nav > .active > a,
+	.nav > .active > a:hover,
+	.nav > .active > a:focus {
+		@include box-shadow(none);
+	}
 
-.dropdown-menu {
-	background-color: #191A1A;
-	border-left: solid 1px rgba(255,255,255,.1);
-	@include box-shadow(0 2px 4px rgba(0,0,0,.8));
-}
+	.navbar-text {
+		margin-bottom: 1px;
+		padding: 15px 15px 14px;
+		line-height: inherit;
+	}
 
-.dropdown-menu li > a:hover {
-	background-color: $blue;
-	border-bottom: 3px solid transparent;
-}
+	.divider-vertical {
+		margin: 0;
+		border-left: 1px solid $grayDark;
+		border-right-width: 0;
+	}
 
-.dropdown-menu .divider {
-	background-color: #222;
-	border-bottom: 0px solid white;
-}
+	.search-query,
+	.search-query:focus,
+	.search-query.focused {
+		@include border-radius(1px);
+		background-color: $grayDark;
+		line-height: normal;
+		color: $grayLight;
+		text-shadow: none;
+		@include placeholder($gray);
+	}
 
-.navbar .dropdown-menu::before,
-.navbar .dropdown-menu::after {
-	display: none;
-}
+	.navbar-inverse {
 
-.navbar .nav-collapse.in .nav > li > a {
-	border-left: 0;
+	}
 }
 
-.navbar .nav-collapse.in .nav a:hover {
-	background-color: $blue;
+@media (max-width: $navbarCollapseWidth) {
+
+	.navbar .nav-collapse {
+
+		.nav li > a {
+			border: none;
+			color: $grayLighter;
+			font-weight: normal;
+			text-shadow: none;
+
+			&:hover {
+				border: none;
+				background-color: $blue;
+			}
+		}
+
+		.nav .active > a {
+			border: none;
+			background-color: $blue;
+		}
+
+		.dropdown-menu a:hover {
+			background-color: $blue;
+		}
+
+		.navbar-form,
+		.navbar-search {
+			border-top: none;
+			border-bottom: none;
+		}
+
+		.nav-header {
+			color: rgba(128, 128, 128, 0.6);
+		}
+	}
+
+	.navbar-inverse .nav-collapse {
+
+		.nav li > a:hover {
+			background-color: #111;
+		}
+
+		.nav .active > a {
+			background-color: #111;
+		}
+
+		.nav li.dropdown.open > .dropdown-toggle,
+		.nav li.dropdown.active > .dropdown-toggle,
+		.nav li.dropdown.open.active > .dropdown-toggle {
+			background-color: #111;
+		}
+	}
 }
 
 div.subnav {
-	position: static;
 	background-color: $grayDarker;
 	background-image: none;
-	border: 0;
-}
+	border: none;
+	border-bottom: 1px solid $grayDark;
 
-div.subnav.subnav-fixed {
-	position: relative;
-	left: -1px;
-	top: auto;
-}
 
-div.subnav .nav li > a,
-div.subnav .nav .active a {
-	border-left: 1px solid #222;
-	border-right: 0;
-	color: $grayLighter;
-	background-color: $grayDarker;
-}
+	&.subnav-fixed {
+		top: $navbarHeight;
+	}
 
-.subnav .nav > li > a:hover,
-.subnav .nav > li.active > a:hover,
-.subnav .nav > li:first-child > a:hover {
-	background: transparent;
-	border-bottom: 2px solid $blue;
-	border-left: 1px solid #222;
-	color: $white;
+	.nav > li > a,
+	.nav > li:first-child > a,
+	.nav > li:first-child > a:hover {
+		padding: 11px 12px;
+		border: none;
+		background-color: $grayDarker;
+		color: $grayLight;
+	}
+
+	.nav > li > a:hover,
+	.nav > li.active > a,
+	.nav > li.active > a:hover,
+	.nav > li:first-child > a:hover {
+		padding: 11px 12px;
+		background: transparent;
+		border: none;
+		border-bottom: 1px solid $blue;
+		color: $white;
+	}
+
+	.nav li.nav-header {
+		text-shadow: none;
+	}
 }
 
-div.subnav .nav .dropdown.open {
+// NAV
+// -----------------------------------------------------
 
-	.dropdown-toggle {
-		border: 0;
-		border-left: 1px solid #222;
-	    border-bottom: 2px solid $blue;
+.nav-tabs {
+
+	border-bottom: 1px solid $grayDark;
+
+	li > a:hover,
+	li.active > a,
+	li.active > a:hover {
+		border-color: transparent;
+		background-color: $blue;
+		color: $white;
+	}
+
+	.open .dropdown-toggle {
 		background-color: #060606;
+		border-color: transparent;
 	}
+}
 
-	.dropdown-menu {
-		background-color: $grayDarker;
-		border-left: 0;
+.nav-pills {
 
-		li > a:hover {
-			border-bottom: 0;
-			background: $blue;
-		}
+	li > a:hover {
+		background-color: $blue;
+		color: $white;
 	}
-}
 
-@media (max-width: 768px) {
-	div.subnav .nav > li + li > a,
-	div.subnav .nav > li:first-child > a {
-		border-top: 1px solid #222;
-		border-left: 1px solid #222;
+	.open .dropdown-toggle {
+		background-color: #060606;
 	}
 
-	.subnav .nav > li + li > a:hover,
-	.subnav .nav > li:first-child > a:hover {
-			border-bottom: 0;
-			background-color: $blue;
+	.dropdown-menu li > a:hover {
+		border: none;
 	}
 }
 
-// NAVIGATION
-// -----------------------------------------------------
+.nav-list {
 
-.nav-list > li > a, .nav-list .nav-header {
-	text-shadow: none;
-}
+	li > a {
+		text-shadow: none;
+	}
 
-.nav-list li > a:hover,
-.nav-tabs li > a:hover,
-.nav-tabs li.active > a,
-.nav-pills li > a:hover,
-.nav-stacked li > a:hover,
-.nav-stacked li.active > a {
-	background-color: $blue;
-	color: $white;
-}
+	li > a:hover {
+		background-color: $blue;
+		color: $white;
+	}
 
-.nav-tabs {
-	border-bottom: 1px solid #222;
-}
+	.nav-header {
+		text-shadow: none;
+	}
 
-.nav-stacked > li > a,
-.nav-tabs > li > a:hover,
-.nav-tabs > .active > a,
-.nav-tabs > .active > a:hover {
-	border: 1px solid #222 !important;
+	.divider {
+		background-color: transparent;
+		border-bottom: 1px solid $grayDark;
+	}
 }
 
-.nav.nav-tabs .active a:hover {
-	background-color: $blue;
-	color: $white;
-}
+.nav-stacked {
 
-.nav.nav-tabs .dropdown.open,
-.nav.nav-pills .dropdown.open {
-	.dropdown-toggle {
-		background-color: #060606 !important;
-		border-top: 0;
-		border: 1px solid #222;
+	li > a {
+		border: 1px solid $grayDark !important;
 	}
 
-	.dropdown-menu li > a:hover { border-bottom: 0; }
+	li > a:hover,
+	li.active > a {
+		background-color: $blue;
+		color: $white;
+	}
 }
 
-.tabbable .nav-tabs, .thumbnail {
-	border-color: #222;
+.tabbable  {
+	.nav-tabs,
+	.nav-tabs li.active > a {
+		border-color: $grayDark;
+	}
 }
 
 .breadcrumb {
+	
 	background-color: transparent;
 	background-image: none;
 	border-width: 0;
 	@include box-shadow(none);
 	font-size: 14px;
 
-	li > a {
-		color: $blue;
+	li {
 		text-shadow: none;
 	}
 
-	li.active {
+	li > a {
+		color: $blue;
 		text-shadow: none;
 	}
 }
 
 .pagination {
+
 	ul {
 		@include box-shadow(none);
 	}
 
-	a {
-		border: 0;
-		font-size: 14px;
+	ul > li > a:hover,
+	ul > .active > a,
+	ul > .active > span {
+		// color: @white;	
 	}
 
-	a:hover, .active a {
-		background-color: $blue;
-		color: $white;
+	ul > .disabled > a,
+	ul > .disabled > a:hover,
+	ul > .disabled > span,
+	ul > .disabled > span:hover {
+		background-color: rgba(0, 0, 0, 0.2);
 	}
 }
 
+.pager {
+
+	li > a,
+	li > span {
+		background-color: $bodyBackground;
+		border: none;
+
+		&:hover {
+			background-color: $blue;
+		}
+	}
+
+	.disabled a,
+	.disabled a:hover {
+		background-color: $bodyBackground;
+	}
+
+}
+
 // BUTTONS
 // -----------------------------------------------------
 
 .btn {
-	@include border-radius(3px);
 	@include box-shadow(1px 1px 2px #111);
-	@include buttonBackground(darken($gray, .2), darken($gray, .3));
+	@include buttonBackground(darken($gray, 20%), darken($gray, 30%));
 	color: $white;
 	text-shadow: none;
 
@@ -283,48 +351,27 @@ div.subnav .nav .dropdown.open {
 }
 
 .btn-primary {
-  @include buttonBackground($blueDark, darken($blueDark, .1));
+  @include buttonBackground($blueDark, darken($blueDark, 10%));
 }
 
 .btn-warning {
-  @include buttonBackground(lighten($orange, .1), $orange);
+  @include buttonBackground(lighten($orange, 10%), $orange);
 }
 
 .btn-danger {
-  @include buttonBackground(lighten($red, .1), $red);
+  @include buttonBackground(lighten($red, 10%), $red);
 }
 
 .btn-success {
-  @include buttonBackground(lighten($green, .1), $green);
+  @include buttonBackground(lighten($green, 10%), $green);
 }
 
 .btn-info {
-  @include buttonBackground(darken($gray, .4), darken($gray, .5));
+  @include buttonBackground(darken($gray, 40%), darken($gray, 50%));
 }
 
 .btn-inverse {
-  @include buttonBackground(lighten($purple, .05), $purple);
-}
-
-.btn-group .btn:first-child {
-    -webkit-border-top-left-radius: 3px;
-       -moz-border-top-left-radius: 3px;
-            border-top-left-radius: 3px;
-
-    -webkit-border-bottom-left-radius: 3px;
-       -moz-border-bottom-left-radius: 3px;
-            border-bottom-left-radius: 3px;
-}
-
-.btn-group .btn:last-child, .btn-group .dropdown-toggle {
-    -webkit-border-top-right-radius: 3px;
-       -moz-border-top-right-radius: 3px;
-            border-top-right-radius: 3px;
-
-    -webkit-border-bottom-right-radius: 3px;
-       -moz-border-bottom-right-radius: 3px;
-            border-bottom-right-radius: 3px;
-
+  @include buttonBackground(lighten($purple, 5%), $purple);
 }
 
 .btn .caret {
@@ -345,19 +392,19 @@ div.subnav .nav .dropdown.open {
 
 input, textarea, select {
 	border-width: 2px;
+	@include border-radius(1px);
 }
 
-legend, label {
-	color: $textColor;
-	border-bottom: 0px solid #222;
-}
-
-input, textarea, select, .uneditable-input {
+select, textarea,
+input[type="text"], input[type="password"], input[type="datetime"],
+input[type="datetime-local"], input[type="date"], input[type="month"],
+input[type="time"], input[type="week"], input[type="number"],
+input[type="email"], input[type="url"], input[type="search"],
+input[type="tel"], input[type="color"], .uneditable-input {
 	color: $grayDark;
 }
 
 input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly], .uneditable-input {
-	background-color: #555;
 	border-color: #444;
 }
 
@@ -378,76 +425,145 @@ select:focus {
   @include tab-focus();
 }
 
-.form-actions {
-	background: transparent;
+legend, label {
+	color: $textColor;
+	border-bottom: 0px solid #222;
 }
 
-.form-actions, footer.footer {
+.form-actions {
 	border-top: 1px solid #222;
 }
 
-
-// MISCELLANEOUS
+// TABLES
 // -----------------------------------------------------
 
-.table, .well, .prettyprint, input, textarea, select {
+.table {
+
 	@include border-radius(1px);
-}
 
-code, pre, pre.prettyprint {
-	background-color: $grayLighter;
+	tbody tr.success td {
+		background-color: $green;
+		color: $white;
+	}
+
+	tbody tr.error td {
+		background-color: $red;
+		color: $white;
+	}
+
+	tbody tr.info td {
+		background-color: $blue;
+		color: $white;
+	}
 }
 
-.well {
-	background-color: rgba(40, 40, 40, 0.5);
-	background-color: #131517;
-	border-top: solid 1px rgba(255,255,255,.1);
-	@include box-shadow(0 2px 4px rgba(0,0,0,.8));
+// DROPDOWNS
+// -----------------------------------------------------
+
+.dropdown-menu {
+	@include box-shadow(0 2px 4px rgba(0, 0, 0, 0.8));
 }
 
-.progress {
-	background-color: #060606;
-	background-image: none;
-	@include border-radius(0);
+// ALERTS, LABELS, BADGES
+// -----------------------------------------------------
+
+.alert,
+.alert .alert-heading,
+.alert-success,
+.alert-success .alert-heading,
+.alert-danger,
+.alert-error,
+.alert-danger .alert-heading,
+.alert-error .alert-heading,
+.alert-info,
+.alert-info .alert-heading {
+  color: $grayLighter;
+  text-shadow: none;
+  border: none;
 }
 
 .label {
 	color: $grayLighter;
 }
 
-.label, .alert { background-color: darken($gray, .2); }
-
-.label:hover { background-color: darken($gray, .3); }
+.label, .alert { background-color: darken($gray, 20%); }
 
+.label:hover { background-color: darken($gray, 30%); }
 
-.label-important, .alert-danger,
+.label-important,
+.alert-danger,
 .alert-error { background-color: $red; }
 
-.label-important:hover { background-color: darken($red, .1); }
+.label-important:hover { background-color: darken($red, 10%); }
 
-.label-warning   { background-color: darken($orange, .1); }
+.label-warning   { background-color: darken($orange, 10%); }
 
-.label-warning:hover { background-color: darken($orange, .2); }
+.label-warning:hover { background-color: darken($orange, 20%); }
 
-.label-success, .alert-success { background-color: darken($green, .03); }
+.label-success, .alert-success { background-color: darken($green, 3%); }
 
-.label-success:hover { background-color: darken($green, .13); }
+.label-success:hover { background-color: darken($green, 13%); }
 
-.label-info, .alert-info { background-color: darken($blueDark, .1); }
+.label-info, .alert-info { background-color: darken($blueDark, 10%); }
 
-.label-info:hover { background-color: darken($blueDark, .2); }
+.label-info:hover { background-color: darken($blueDark, 20%); }
 
-.alert,
-.alert .alert-heading,
-.alert-success,
-.alert-success .alert-heading,
-.alert-danger,
-.alert-error,
-.alert-danger .alert-heading,
-.alert-error .alert-heading,
-.alert-info,
-.alert-info .alert-heading {
-  color: $grayLighter;
-  text-shadow: none;
-  border: none;
+// MISC
+// -----------------------------------------------------
+
+.well, .hero-unit {
+	@include border-radius(1px);
+}
+
+.well, .hero-unit {
+	border-top: solid 1px lighten($grayDark, 5%);
+	@include box-shadow(0 2px 4px rgba(0,0,0,.8));
+}
+
+.thumbnail {
+	border-color: $grayDark;
+}
+
+.progress {
+	background-color: #060606;
+	background-image: none;
+	@include border-radius(0);
+}
+
+.modal {
+ 	@include border-radius(1px);
+	border-top: solid 1px lighten($grayDark, 5%);
+	background-color: $grayDark;
+}
+
+.modal-header {
+	border-bottom: 1px solid $grayDark;
+}
+
+.modal-footer {
+	background-color: $grayDark;
+	border-top: 1px solid $grayDark;
+	@include border-radius(0 0 6px 6px);
+	@include box-shadow(none);
+}
+
+.footer {
+	border-top: 1px solid $grayDark;
+}
+
+// MEDIA QUERIES
+// -----------------------------------------------------
+
+@media (max-width: 768px) {
+	div.subnav .nav > li + li > a,
+	div.subnav .nav > li:first-child > a {
+		border-top: 1px solid $grayDark;
+		border-left: 1px solid $grayDark;
+	}
+
+	.subnav .nav > li + li > a:hover,
+	.subnav .nav > li:first-child > a:hover {
+			border-bottom: 0;
+			background-color: $blue;
+	}
 }