new swatch, slate

1 files changed, 396 insertions, 0 deletions

diff --git a/slate/bootswatch.less b/slate/bootswatch.less
new file mode 100755
index 00000000..e8f2fd81
--- /dev/null
+++ b/slate/bootswatch.less
@@ -0,0 +1,396 @@
+// Bootswatch.less
+// Swatch: Slate
+// -----------------------------------------------------
+
+// SCAFFOLDING
+// -----------------------------------------------------
+
+body {
+	background-color: @grayDarker;
+}
+
+h1, h2, h3, h4, h5, h6, body, legend, label {
+	color: @grayLight;
+	text-shadow: -1px -1px 0 #111;
+}
+
+// NAVBAR
+// -----------------------------------------------------
+
+.navbar .brand {
+	font-weight: bold;
+}
+
+.navbar .navbar-inner,
+div.subnav {
+	#gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);
+}
+
+.navbar .divider-vertical {
+	background-color: transparent;
+	border-right: none;
+}
+
+.navbar .brand,
+.navbar .nav > li > a,
+div.subnav .nav > li > a {
+	color: @grayLighter;
+	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+	border-right: 1px solid darken(@gray, 15%);
+}
+
+.navbar .nav > li > a,
+div.subnav .nav > li > a {
+	border-left: 1px solid @gray;
+	
+	&:hover {
+		color: @grayLighter;
+		background-color: @grayDark;
+		#gradient > .directional(@grayDarker, @grayDark, 280deg);
+		border-left: 1px solid transparent;
+		border-right: 1px solid transparent;
+	}
+}
+
+.navbar .nav > li.active > a,
+div.subnav .nav > li.active > a,
+.navbar .nav > li.active > a:hover,
+div.subnav .nav > li.active > a:hover {
+	color: @grayLighter;
+	background-color: @grayDark;
+	#gradient > .directional(lighten(@grayDarker, 4%), lighten(@grayDark, 4%), 280deg);
+	border-right: 1px solid darken(@gray, 15%);
+}
+
+div.subnav .nav > li:first-child > a,
+div.subnav .nav > li:first-child > a:hover {
+	border-left: 1px solid transparent;
+}
+
+div.subnav.subnav-fixed .nav > li.active:first-child > a,
+div.subnav.subnav-fixed .nav > li:first-child > a:hover {
+	border-left: 1px solid darken(@gray, 15%);
+}
+
+div.subnav .nav > li.active:last-child > a,
+div.subnav .nav > li:last-child > a:hover {
+	border-right: 1px solid darken(@gray, 15%);
+}
+
+div.subnav {
+	border: 1px solid transparent;
+	.box-shadow(0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1));
+}
+
+.navbar-search .search-query {
+	border: 1px solid darken(@gray, 15%);
+}
+
+.navbar .nav-collapse.collapse > .nav > li > a,
+.navbar .nav-collapse.collapse > .nav > li.active > a,
+.navbar .nav-collapse.collapse > .nav > li > a:hover,
+.navbar .nav-collapse.collapse > .nav > li.active > a:hover {
+	color: @grayLighter;
+	border: 1px solid transparent;
+	.box-shadow(none);
+	background-color: transparent;
+	background-image: none;
+}
+
+.navbar .nav-collapse.collapse > .nav > li > a:hover, 
+.navbar .nav-collapse.collapse > .nav > li.active > a:hover {
+	background-color: @grayDarker;
+}
+
+@media (max-width: 979px) {
+	.navbar .brand {
+		border-right: none;
+	}
+}
+
+// BUTTONS
+// -----------------------------------------------------
+
+.btn {
+    .buttonBackground(@gray, darken(@gray, 10%));
+	.border-radius(3px);
+	border: 1px solid @grayDarker;
+}
+
+.btn, .btn:hover {
+	color: @white;
+	font-weight: bold;
+	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+
+// Set the backgrounds
+// -------------------------
+.btn-primary {
+  .buttonBackground(@primaryButtonBackground, spin(@primaryButtonBackground, 20));
+}
+// Warning appears are orange
+.btn-warning {
+  .buttonBackground(lighten(@orange, 15%), @orange);
+}
+// Danger and error appear as red
+.btn-danger {
+  .buttonBackground(#ee5f5b, #bd362f);
+}
+// Success appears as green
+.btn-success {
+  .buttonBackground(#62c462, #51a351);
+}
+// Info appears as a neutral blue
+.btn-info {
+  .buttonBackground(#5bc0de, #2f96b4);
+}
+// Inverse appears as dark gray
+.btn-inverse {
+  .buttonBackground(#454545, #262626);
+}
+
+.caret {
+	border-top-color: @white;
+}
+
+// TABLES
+// -----------------------------------------------------
+
+.table th, .table td, .table tbody + tbody {
+	border-top: 1px solid darken(@grayDarker, 5%);
+}
+
+.table-bordered {
+  border: 1px solid darken(@grayDarker, 5%);
+  th + th,
+  td + td,
+  th + td,
+  td + th {
+    border-left: 1px solid darken(@grayDarker, 5%);
+  }
+  // Prevent a double border
+  thead:first-child tr:first-child th,
+  tbody:first-child tr:first-child th,
+  tbody:first-child tr:first-child td {
+    border-top: 0;
+  }
+}
+
+.table-striped {
+  tbody {
+    tr:nth-child(odd) td,
+    tr:nth-child(odd) th {
+      background-color: darken(@grayDark, 5%);
+    }
+  }
+}
+
+.table {
+  tbody tr:hover td,
+  tbody tr:hover th {
+    background-color: @grayDark;
+  }
+}
+
+// NAVIGATION
+// -----------------------------------------------------
+
+.pagination > ul {
+	.box-shadow(none);
+}
+
+.breadcrumb, .pagination > ul a, .pager a {
+	border: 1px solid transparent;
+	.box-shadow(0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1));
+	#gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);	
+}
+
+.breadcrumb li, .breadcrumb a, .pagination > ul a {
+	color: @grayLighter;
+	font-weight: bold;
+	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+
+.breadcrumb a {
+	color: @white;
+}
+
+.pagination li > a,
+.pagination li.disabled > a {
+	border-left: 1px solid @gray;
+	border-right: 1px solid darken(@gray, 15%);
+	border-top: none;
+	border-bottom: none;
+}
+
+.pagination li.disabled > a {
+	#gradient > .vertical-three-colors(@grayLight, @gray, 70%, @gray);	
+}
+
+.pagination > ul > li:not(.disabled) a:hover,
+  {
+	#gradient > .directional(@grayDarker, @grayDark, 280deg);
+	border-left: 1px solid transparent;
+}
+
+.pagination > ul > li.active > a,
+.pagination > ul > li.active > a:hover {
+	color: @grayLighter;
+	background-color: @grayDark;
+	#gradient > .directional(lighten(@grayDarker, 4%), lighten(@grayDark, 4%), 280deg);
+	border-left: 1px solid transparent;
+}
+
+.pager a:hover {
+	#gradient > .directional(@grayDarker, @grayDark, 280deg);
+	border: 1px solid transparent;
+}
+
+.nav > li > a,
+.nav > li > a:hover,
+.nav > li.active > a,
+.nav > li.active > a:hover,
+.nav-tabs.nav-stacked > li > a,
+.nav-tabs.nav-stacked > li > a:hover {
+	border: none;
+	background-color: transparent;
+	color: @grayLighter;
+	font-weight: bold;
+	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);	
+}
+
+.dropdown-menu {
+	.box-shadow(0 5px 5px rgba(0, 0, 0, 0.2));
+}
+
+.dropdown-menu,
+.dropdown-menu li.active a,
+.dropdown-menu li.active a:hover {
+	background-color: @grayDark;
+}
+
+.dropdown-menu a,
+.dropdown-menu li.active a,
+.dropdown-menu li a:hover,
+.dropdown-menu li.active a:hover,
+.dropdown.open .dropdown-toggle {
+	color: @grayLighter;
+}
+
+.dropdown-menu li a:hover,
+.dropdown-menu li.active a:hover {
+	background-color: @grayDarker;
+}
+
+.navbar .dropdown-menu::after {
+	border-bottom: 6px solid @grayDark;
+}
+
+.nav > li > a {
+	border: none;
+	.box-shadow(0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1));
+	#gradient > .vertical-three-colors(@gray, @grayDark, 70%, @grayDark);
+
+}
+
+.nav.nav-list .nav-header {
+	color: @grayLight;
+	text-shadow: -1px -1px 0 #111;
+}
+
+.tabs-below .nav-tabs {
+	border-top: none;
+}
+
+.tabs-left .nav-tabs {
+	border-right: none;
+}
+
+.tabs-right .nav-tabs {
+	border-left: none;
+}
+
+// FORMS
+// -----------------------------------------------------
+
+.form-actions {
+	background-color: darken(@grayDarker, 3%);
+	border-top: none;
+}
+
+.input-prepend .add-on, .input-append .add-on {
+	background-color: @gray;
+	border-top: 1px solid @grayLight;
+	border-left: 1px solid @grayLight;
+	border-bottom: 1px solid @grayDark;
+	border-right: 1px solid @grayDark;
+	text-shadow: none;
+}
+
+.uneditable-input, input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {
+	text-shadow: none;
+	color: @grayLighter;
+}
+
+// LABELS AND ALERTS
+// -----------------------------------------------------
+
+.label, .alert {
+  	color: rgba(256, 256, 256, 0.9);
+	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
+	.box-shadow(1px 1px 1px rgba(0, 0, 0, 0.3));
+}
+
+.alert-heading {
+  	color: rgba(256, 256, 256, 0.9);
+	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
+}
+
+.alert {
+  background-color: @warningText;
+  border-color: @warningText;  
+}
+
+.alert-success {
+  background-color: @successText;
+  border-color: @successText;  
+}
+
+.alert-danger,
+.alert-error {
+  background-color: @errorText;
+  border-color: @errorText;
+}
+
+.alert-info {
+  background-color: @infoText;
+  border-color: @infoText;
+}
+
+// MISCELLANEOUS
+// -----------------------------------------------------
+
+code, pre {
+	background-color: #F7F7F7;
+	border: 1px solid darken(@grayDarker, 5%);
+	text-shadow: none;
+}
+
+hr, legend, .page-header, .dropdown-menu .divider {
+	border-top: none;
+	border-bottom: 1px solid darken(@grayDarker, 5%);
+	background-color: transparent;
+}
+
+.well, .progress {
+	background-color: darken(@grayDarker, 3%);
+	.box-shadow(inset 1px 1px 1px rgba(0, 0, 0, 0.5);
+}
+
+.progress {
+	#gradient > .vertical(darken(@grayDarker, 3%), darken(@grayDarker, 3%));
+}
+
+.thumbnail, a.thumbnail:hover {
+  border: 1px solid darken(@grayDarker, 5%);
+}