swatchmaker: update styles, fix modal and popover, add smoothscroll, fix path to icos

1 files changed, 59 insertions, 264 deletions

diff --git a/swatchmaker/test/bootswatch.css b/swatchmaker/test/bootswatch.css
index e7aaca6f..2a69cbb7 100644
--- a/swatchmaker/test/bootswatch.css
+++ b/swatchmaker/test/bootswatch.css
@@ -1,20 +1,44 @@
-body {
-	padding-top: 80px;
-	padding-bottom: 20px;
+section {
+	margin-top: 60px;
+	padding-top: 100px;
 }
 
-.navbar a > i {
-	opacity: 0.5;
+/* index */
+
+.tooltip-inner {
+	max-width: 500px;
 }
 
-.navbar a:hover > i {
-	opacity: 1;
+.hero-unit h1,
+.hero-unit p {
+	margin-bottom: 15px;
 }
 
-section {
-	margin-top: 100px;
+#footer {
+	margin-bottom: 20px;
+}
+
+#footer .links a {
+	margin-right: 10px;
+}
+
+@media (max-width: 767px) {
+
+
+	section {
+		padding-top: 20px;
+	}
+}
+
+@media (max-width: 979px) and (min-width: 768px) {
+
+	section {
+		padding-top: 20px;
+	}
 }
 
+/* preview */
+
 .subhead {
 	padding-bottom: 0;
 	margin-bottom: 9px;
@@ -24,6 +48,12 @@ section {
 	font-size: 54px;
 }
 
+.subhead > div:first-child {
+	min-height: 200px;
+}
+
+/* subnav */
+ 
 .subnav {
 	margin-bottom: 60px;
 	width: 100%;
@@ -42,11 +72,11 @@ section {
 	-moz-border-radius: 4px;
 	border-radius: 4px;
 }
-
+ 
 .subnav .nav {
 	margin-bottom: 0;
 }
-
+ 
 .subnav .nav > li > a {
 	margin: 0;
 	padding-top:    11px;
@@ -57,7 +87,7 @@ section {
 	-moz-border-radius: 0;
 	border-radius: 0;
 }
-
+ 
 .subnav .nav > .active > a,
 .subnav .nav > .active > a:hover {
 	padding-left: 13px;
@@ -69,12 +99,12 @@ section {
 	-moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
 	box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
 }
-
+ 
 .subnav .nav > .active > a .caret,
 .subnav .nav > .active > a:hover .caret {
 	border-top-color: #777;
 }
-
+ 
 .subnav .nav > li:first-child > a,
 .subnav .nav > li:first-child > a:hover {
 	border-left: 0;
@@ -83,227 +113,19 @@ section {
 	-moz-border-radius: 4px 0 0 4px;
 	border-radius: 4px 0 0 4px;
 }
-
+ 
 .subnav .nav > li:last-child > a {
 	border-right: 0;
 }
-
+ 
 .subnav .dropdown-menu {
 	-webkit-border-radius: 0 0 4px 4px;
 	-moz-border-radius: 0 0 4px 4px;
 	border-radius: 0 0 4px 4px;
 }
-
-.tooltip-inner {
-	max-width: 500px;
-}
-
-.hero-unit {
-	margin-bottom: 10px;
-	text-align: center;
-}
-
-.hero-unit h1,
-.hero-unit p {
-	margin-bottom: 15px;
-}
-
-#social {
-	display: inline-block;
-	margin-top: 45px;
-	text-align: center;
-}
-
-#gh-star {
-	margin-right: 10px;
-}
-
-.twitter-follow-button {
-	width: 60px !important;
-}
-
-.twitter-share-button  {
-	margin-right: 15px;
-}
-
-.rss-button {
-	width: 40px;
-	height: 14px;
-	font-size: 11px;
-	line-height: 14px;
-	font-weight: bold;
-	margin: 0 0 10px;
-	padding: 2px 5px 2px 4px;
-}
-
-.icon-rss {
-	background: url(../img/rss-icons.png) no-repeat 0 0;
-	opacity: .65;
-	width: 16px;
-}
-
-#ticker {
-	margin-bottom: 40px;
-}
-
-.about {
-	margin-top: 20px;
-}
-
-.about > div {
-	margin-bottom: 20px;
-}
-
-.about h3 {
-	margin: 0 0 5px 35px;
-}
-
-.about img {
-	float: left;
-	margin-top: 5px;
-	opacity: 0.7;
-}
-
-#gallery {
-	margin: 45px 0 30px 0;
-	padding-right: 20px;
-	text-align: center;
-}
-
-.thumbnail {
-	margin-bottom: 20px;
-	background-color: rgba(0, 0, 0, 0.05);
-}
-
-.thumbnail img {
-	width: 100%;
-	-webkit-border-radius: 7px;
-	-moz-border-radius: 7px;
-	border-radius: 7px;
-}
-
-.thumbnail .caption {
-	color: inherit !important;
-}
-
-.thumbnail h3 {
-	margin-bottom: 0;
-}
-
-.thumbnail .btn-toolbar {
-	margin-top: 15px;
-	text-align: right;
-}
-
-.links {
-	margin-bottom: 20px;
-}
-
-.links > a {
-	margin-right: 10px;
-} 
-
-div.one .bsa_it_ad {
-	padding: 25px 25px 15px 25px;
-}
-
-div.one .bsa_it_p {
-	display: none;
-}
-
-.bsa {
-	float: right;
-	max-width: 400px;
-	padding: 0;
-}
-
-body .one .bsa_it_ad {
-	margin-bottom: -10px;
-	background: none;
-	border: none;
-	font-family: inherit;
-	color: inherit;
-}
-
-body .one .bsa_it_ad .bsa_it_t,
-body .one .bsa_it_ad .bsa_it_d {
-	color: inherit;
-	font-size: inherit;
-}
-
-body .one .bsa_it_p {
-	display: none;
-}
-
-.links {
-	margin-bottom: 20px;
-}
-
-.links > a {
-	margin-right: 10px;
-}
-
-@media (max-width: 480px) {
-
-	.hero-unit {
-		padding: 20px 20px 0;
-		margin: 0 0 20px;
-	}
-
-	.hero-unit h1 {
-		font-size: 36px;
-	}
-
-	.hero-unit iframe {
-		margin-right: 0 !important;
-	}
-
-	#social {
-		margin-top: 0px;
-		margin-bottom: 20px;
-	}
-
-	#social > span {
-		display: block;
-	}
-
-	.about {
-		margin-top: 0;
-	}
-
-	.about h3 {
-		margin-top: 20px;
-	}
-
-	.about p {
-		margin-bottom: 0;
-	}
-
-	.modal {
-		position: fixed !important;
-		top: 25% !important;
-	}
-}
-
-/* Landscape phone to portrait tablet */
-@media (min-width: 481px) and (max-width: 767px) {
-
-	.hero-unit {
-		margin-top: 0;
-		padding: 30px;
-	}
-
-	.about {
-		margin-top: 0;
-	}
-}
-
+ 
 @media (max-width: 767px) {
-
-	body {
-		padding-top: 0;
-	}
-
+ 
 	.subnav {
 		position: static;
 		top: auto;
@@ -315,53 +137,32 @@ body .one .bsa_it_p {
 		-moz-box-shadow: none;
 		box-shadow: none;
 	}
-
+ 
 	.subnav .nav > li {
 		float: none;
 	}
-
+ 
 	.subnav .nav > li > a {
 		border: 0;
 	}
-
+ 
 	.subnav .nav > li + li > a {
 		border-top: 1px solid #e5e5e5;
 	}
-
+ 
 	.subnav .nav > li:first-child > a,
 	.subnav .nav > li:first-child > a:hover {
 		-webkit-border-radius: 4px 4px 0 0;
 		-moz-border-radius: 4px 4px 0 0;
 		border-radius: 4px 4px 0 0;
 	}
-
-	.bsa {
-		float: none;
-	}
 }
-
-/* Portrait tablet to landscape and desktop */
-@media (min-width: 768px) and (max-width: 979px) {
-
-	.hero-unit {
-		margin-top: 0;
-	}
-
-	.thumbnail p {
-		font-size: 12px;
-	}
-
-	.thumbnail .btn {
-		padding: 8px 12px;
-		font-size: 12px;
-	}
-}
-
-/* Fixed subnav on scroll, but only for 980px and up (sorry IE!) */
+ 
 @media (min-width: 980px) {
+  
 	.subnav-fixed {
 		position: fixed;
-		top: 41px;
+		top: 40px;
 		left: 0;
 		right: 0;
 		z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
@@ -375,11 +176,13 @@ body .one .bsa_it_p {
 		box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
 		filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
 	}
+  
 	.subnav-fixed .nav {
 		width: 938px;
 		margin: 0 auto;
 		padding: 0 1px;
 	}
+  
 	.subnav .nav > li:first-child > a,
 	.subnav .nav > li:first-child > a:hover {
 		-webkit-border-radius: 0;
@@ -387,17 +190,9 @@ body .one .bsa_it_p {
 		border-radius: 0;
 	}
 }
-
-@media (min-width: 768px) and (max-width: 979px) {
-
-	/* Remove any padding from the body */
-	body {
-		padding-top: 0;
-	}
-}
-
+ 
 @media (min-width: 1210px) {
-
+ 
 	.subnav-fixed .nav {
 		width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */
 	}