cosmo: first commit!

cosmo/bootswatch.less

+// Cosmo 2.2.1
+// Bootswatch
+// -----------------------------------------------------
+
+
+// TYPOGRAPHY
+// -----------------------------------------------------
+
+@import url('http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700');
+
+body {
+	font-weight: 300;
+}
+
+h1 {
+	font-size: 50px;
+}
+
+h2, h3 {
+	font-size: 26px;
+}
+
+h4 {
+	font-size: 14px;
+}
+
+h5, h6 {
+	font-size: 11px;
+}
+
+blockquote {
+
+	padding: 10px 15px;
+	background-color: @grayLighter;
+	border-left-color: @gray;
+
+	&.pull-right {
+		padding: 10px 15px;
+		border-right-color: @gray;
+	}
+}
+
+.muted {
+	color: @gray;
+}
+
+// SCAFFOLDING
+// -----------------------------------------------------
+
+// NAVBAR
+// -----------------------------------------------------
+
+.navbar {
+
+	.navbar-inner {
+		background-image: none;
+		.box-shadow(none);
+		.border-radius(0);
+	}
+
+	.brand {
+
+		&:hover {
+			color: @navbarLinkColorHover;
+		}
+	}
+
+	.nav > .active > a,
+	.nav > .active > a:hover,
+	.nav > .active > a:focus {
+		.box-shadow(none);
+		background-color: @navbarLinkBackgroundHover;
+	}
+
+	.nav li.dropdown.open > .dropdown-toggle,
+	.nav li.dropdown.active > .dropdown-toggle,
+	.nav li.dropdown.open.active > .dropdown-toggle {
+		color: @white;
+
+		&:hover {
+			color: @grayLighter;
+		}
+	}
+
+	.navbar-search .search-query {
+		line-height: normal;
+	}
+
+	&-inverse {
+
+
+		.nav > .active > a,
+		.nav > .active > a:hover,
+		.nav > .active > a:focus {
+			.box-shadow(none);
+			background-color: @navbarInverseLinkBackgroundHover;
+		}
+
+		.navbar-search .search-query {
+			color: @grayDarker;
+		}
+	}
+}
+
+div.subnav {
+
+	background-color: @grayLight;
+	background-image: none;
+	.box-shadow(none);
+	border: none;
+	.border-radius(0);
+
+	.nav {
+		background-color: transparent;
+	}
+
+	.nav > li > a {
+		border: none;
+	}
+
+	.nav > .active > a,
+	.nav > .active > a:hover {
+		padding-left: 12px;
+		border: none;
+		background-color: transparent;
+		.box-shadow(none);
+		color: @grayDarker;
+	}
+
+	&-fixed {
+		top: @navbarHeight;
+	}
+}
+
+// NAV
+// -----------------------------------------------------
+
+.nav {
+
+	.open .dropdown-toggle,
+	& > li.dropdown.open.active > a:hover {
+		color: @blue;
+	}
+
+}
+
+.nav-tabs {
+
+	& > li > a {
+		.border-radius(0);
+	}
+
+	&.nav-stacked {
+
+		& > li > a:hover {
+			background-color: @blue;
+			color: @white;
+		}
+
+		& > .active > a,
+		& > .active > a:hover {
+			background-color: @white;
+			color: @gray;
+		}
+
+		& > li:first-child > a,
+		& > li:last-child > a {
+			.border-radius(0);
+		}
+	}
+}
+
+.nav-pills {
+
+	& > li > a {
+		background-color: @grayLight;
+		.border-radius(0);
+		color: @black;
+
+		&:hover {
+			background-color: @black;
+			color: @white;
+		}
+	}
+
+	& > .disabled > a,
+	& > .disabled > a:hover {
+		background-color: @grayLighter;
+		color: @grayDark;
+	}
+}
+
+.nav-list {
+
+	& > li > a {
+		color: @grayDarker;
+
+		&:hover {
+			background-color: @blue;
+			color: @white;
+			text-shadow: none;
+		}
+	}
+
+	.nav-header {
+		color: @grayDarker;
+	}
+
+	.divider {
+		background-color: @gray;
+		border-bottom: none;
+	}
+}
+
+.pagination {
+
+	ul {
+
+		.box-shadow(none);
+
+		& > li > a,
+		& > li > span {
+			margin-right: 6px;
+			color: @grayDarker;
+
+			&:hover {
+				background-color: @grayDarker;
+				color: @white;
+			}
+		}
+
+		& > li:last-child > a,
+		& > li:last-child > span {
+			margin-right: 0;
+		}
+
+		& > .active > a,
+		& > .active > span { 
+			color: @white;
+		}
+
+		& > .disabled > span,
+		& > .disabled > a,
+		& > .disabled > a:hover {
+			background-color: @grayLighter;
+			color: @grayDark;
+		}
+	}
+}
+
+.pager {
+
+	li > a,
+	li > span {
+		background-color: @grayLight;
+		border: none;
+		.border-radius(0);
+		color: @grayDarker;
+
+		&:hover {
+			background-color: @grayDarker;
+			color: @white;
+		}
+	}
+
+	.disabled > a,
+	.disabled > a:hover,
+	.disabled > span {
+		background-color: @grayLighter;
+		color: @grayDark;
+	}
+
+}
+
+.breadcrumb {
+	background-color: @grayLight;
+
+	li {
+		text-shadow: none;
+	}
+
+	.divider,
+	.active {
+		color: @grayDarker;
+		text-shadow: none;
+	}
+}
+
+// BUTTONS
+// -----------------------------------------------------
+
+.btn {
+
+	padding: 5px 12px;
+	background-image: none;
+	.box-shadow(none);
+	border: none;
+	.border-radius(0);
+	text-shadow: none;
+
+	&.disabled {
+		box-shadow: inset 0 2px 4px rgba(0,0,0,.15),~" "0 1px 2px rgba(0,0,0,.05);
+	}
+
+	&-large {
+		padding: 22px 30px;
+	}
+}
+
+.btn-group {
+
+	& > .btn:first-child,
+	& > .btn:last-child,
+	& > .dropdown-toggle {
+		.border-radius(0);
+	}
+
+	& > .btn + .dropdown-toggle {
+		.box-shadow(none);
+	}
+}
+
+// TABLES
+// -----------------------------------------------------
+
+.table {
+
+	tbody tr.success td {
+		color: @white;
+	}
+
+	tbody tr.error td {
+		color: @white;
+	}
+
+	tbody tr.info td {
+		color: @white;
+	}
+
+	&-bordered {
+		.border-radius(0);
+
+		thead:first-child tr:first-child th:first-child,
+		tbody:first-child tr:first-child td:first-child {
+			.border-radius(0);
+		}
+
+		thead:last-child tr:last-child th:first-child,
+		tbody:last-child tr:last-child td:first-child,
+		tfoot:last-child tr:last-child td:first-child {
+			.border-radius(0);
+		}
+	}
+}
+
+// FORMS
+// -----------------------------------------------------
+
+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"] {
+	color: @grayDarker;
+}
+
+.control-group {
+
+	&.warning {
+
+		& > label,
+		.help-block,
+		.help-inline {
+			color: @orange;
+		}
+
+		input,
+		select,
+		textarea {
+			border-color: @orange;
+			color: @grayDarker;
+		}
+	}
+
+	&.error {
+
+		& > label,
+		.help-block,
+		.help-inline {
+			color: @red;
+		}
+
+		input,
+		select,
+		textarea {
+			border-color: @red;
+			color: @grayDarker;
+		}
+	}
+
+	&.success {
+
+		& > label,
+		.help-block,
+		.help-inline {
+			color: @green;
+		}
+
+		input,
+		select,
+		textarea {
+			border-color: @green;
+			color: @grayDarker;
+		}
+	}
+}
+
+legend {
+	border-bottom: none;
+	color: @grayDarker;
+}
+
+.form-actions {
+	border-top: none;
+	background-color: @grayLighter;
+}
+
+// DROPDOWNS
+// -----------------------------------------------------
+
+.dropdown-menu {
+	.border-radius(0);
+}
+
+// ALERTS, LABELS, BADGES
+// -----------------------------------------------------
+
+.alert {
+	.border-radius(0);
+	text-shadow: none;
+
+	&-heading, h1, h2, h3, h4, h5, h6 {
+		color: @white;
+	}
+}
+
+.label {
+	.border-radius(0);
+	text-shadow: none;
+
+	&-success {
+		background-color: @green;
+	}
+
+	&-important {
+		background-color: @red;
+	}
+
+	&-info {
+		background-color: @blue;
+	}
+
+	&-inverse {
+		background-color: @gray;
+	}
+}
+
+.badge {
+
+	.border-radius(0);
+
+	&-success {
+		background-color: @green;
+	}
+
+	&-important {
+		background-color: @red;
+	}
+
+	&-info {
+		background-color: @blue;
+	}
+
+	&-inverse {
+		background-color: @gray;
+	}
+}
+
+// MISC
+// -----------------------------------------------------
+
+.hero-unit {
+	border: none;
+	.border-radius(0);
+	.box-shadow(none);
+}
+
+.well {
+	border: none;
+	.border-radius(0);
+	.box-shadow(none);
+}
+
+[class^="icon-"], [class*=" icon-"] {
+	margin: 0 2px;
+	vertical-align: -2px;
+}
+
+a.thumbnail {
+	background-color: @grayLight;
+
+	&:hover {
+		background-color: @gray;
+		border-color: transparent;
+	}
+}
+
+.progress {
+	height: 6px;
+	.border-radius(0);
+	.box-shadow(none);
+	background-color: @grayLighter;
+	background-image: none;
+
+	.bar {
+		background-color: @blue;
+		background-image: none;
+	}
+
+	&-info {
+		background-color: @purple;
+	}
+
+	&-success {
+		background-color: @green;
+	}
+
+	&-warning {
+		background-color: @orange;
+	}
+
+	&-danger {
+		background-color: @red;
+	}
+}
+
+.modal {
+	.border-radius(0);
+
+	&-header {
+		border-bottom: none;
+	}
+
+	&-footer {
+		border-top: none;
+		background-color: transparent;
+	}
+}
+
+.popover {
+	.border-radius(0);
+	color: @white;
+
+	&-title {
+		border-bottom: none;
+		color: @white;
+	}
+
+}
+
+// MEDIA QUERIES
+// -----------------------------------------------------

cosmo/variables.less

+// Cosmo 2.2.1
+// Variables
+// --------------------------------------------------
+
+
+// Global values
+// --------------------------------------------------
+
+
+// Grays
+// -------------------------
+@black:                 #000;
+@grayDarker:            #080808;
+@grayDark:              #999;
+@gray:                  #bbb;
+@grayLight:             #dfdfdf;
+@grayLighter:           #eee;
+@white:                 #fff;
+
+
+// Accent colors
+// -------------------------
+@blue:                  #5192FB;
+@blueDark:              #083047;
+@green:                 #00A301;
+@red:                   #E51400;
+@yellow:                #F4B300;
+@orange:                #F09609;
+@pink:                  #E671B8;
+@purple:                #852C99;
+
+
+// Scaffolding
+// -------------------------
+@bodyBackground:        @white;
+@textColor:             #555;
+
+
+// Links
+// -------------------------
+@linkColor:             @blue;
+@linkColorHover:        darken(@linkColor, 10%);
+
+
+// Typography
+// -------------------------
+@sansFontFamily:        "Open Sans", Calibri, Candara, Arial, sans-serif;
+@serifFontFamily:       Georgia, "Times New Roman", Times, serif;
+@monoFontFamily:        Monaco, Menlo, Consolas, "Courier New", monospace;
+
+@baseFontSize:          14px;
+@baseFontFamily:        @sansFontFamily;
+@baseLineHeight:        20px;
+@altFontFamily:         @serifFontFamily;
+
+@headingsFontFamily:    inherit; // empty to use BS default, @baseFontFamily
+@headingsFontWeight:    300;    // instead of browser default, bold
+@headingsColor:         @grayDarker; // empty to use BS default, @textColor
+
+
+// Component sizing
+// -------------------------
+// Based on 14px font-size and 20px line-height
+
+@fontSizeLarge:         @baseFontSize * 1.25; // ~18px
+@fontSizeSmall:         @baseFontSize * 0.85; // ~12px
+@fontSizeMini:          @baseFontSize * 0.75; // ~11px
+
+@paddingLarge:          11px 19px; // 44px
+@paddingSmall:          2px 10px;  // 26px
+@paddingMini:           1px 6px;   // 24px
+
+@baseBorderRadius:      0px;
+@borderRadiusLarge:     0px;
+@borderRadiusSmall:     0px;
+
+
+// Tables
+// -------------------------
+@tableBackground:                   transparent; // overall background-color
+@tableBackgroundAccent:             #f9f9f9; // for striping
+@tableBackgroundHover:              #E8F8FD; // for hover
+@tableBorder:                       #ddd; // table and cell border
+
+// Buttons
+// -------------------------