all: change how nav-collapse is styled to use a media query

3 files changed, 36 insertions, 18 deletions

diff --git a/spruce/bootstrap.css b/spruce/bootstrap.css
index 73831c7e..75bd39bb 100644
--- a/spruce/bootstrap.css
+++ b/spruce/bootstrap.css
@@ -4863,13 +4863,6 @@ blockquote small {
 .navbar .btn-navbar {
   margin-top: 14px;
 }
-.navbar .nav-collapse.in .nav li > a {
-  color: #f5f3dc;
-}
-.navbar .nav-collapse.in .nav li > a:hover {
-  color: #ebd90b;
-  background-color: #01584c;
-}
 .navbar .navbar-form,
 .navbar .navbar-search {
   border-color: transparent;
@@ -4877,6 +4870,18 @@ blockquote small {
   -moz-box-shadow: none;
   box-shadow: none;
 }
+@media (max-width: 979px) {
+  .navbar .nav-collapse .nav li > a {
+    color: #f5f3dc;
+  }
+  .navbar .nav-collapse .nav li > a:hover {
+    color: #ebd90b;
+    background-color: #01584c;
+  }
+  .navbar-inverse .nav-collapse .nav li > a:hover {
+    background-color: rgba(0, 0, 0, 0.06) !important;
+  }
+}
 div.subnav {
   background-color: #015b4e;
   background-image: none;
diff --git a/spruce/bootstrap.min.css b/spruce/bootstrap.min.css
index cd6777d1..213f82bb 100644
--- a/spruce/bootstrap.min.css
+++ b/spruce/bootstrap.min.css
@@ -825,9 +825,8 @@ blockquote small{color:#013435;}
 .navbar .nav>.open>.dropdown-menu{background-color:#f5f3dc;color:#013435;border-color:transparent;}
 .navbar .nav>.open>.dropdown-menu a:hover{background-color:#748c73;color:#f5f3dc;}
 .navbar .btn-navbar{margin-top:14px;}
-.navbar .nav-collapse.in .nav li>a{color:#f5f3dc;}.navbar .nav-collapse.in .nav li>a:hover{color:#ebd90b;background-color:#01584c;}
 .navbar .navbar-form,.navbar .navbar-search{border-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
-div.subnav{background-color:#015b4e;background-image:none;border-color:transparent;-webkit-box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);font-size:18px;}div.subnav .nav>li>a{padding:13px 12px 9px;border-color:transparent;background-color:transparent;font-family:'Josefin Slab',serif;font-weight:700;color:#f5f3dc;}
+@media (max-width:979px){.navbar .nav-collapse .nav li>a{color:#f5f3dc;}.navbar .nav-collapse .nav li>a:hover{color:#ebd90b;background-color:#01584c;} .navbar-inverse .nav-collapse .nav li>a:hover{background-color:rgba(0, 0, 0, 0.06) !important;}}div.subnav{background-color:#015b4e;background-image:none;border-color:transparent;-webkit-box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);box-shadow:0 1px 5px rgba(0, 0, 0, 0.1);font-size:18px;}div.subnav .nav>li>a{padding:13px 12px 9px;border-color:transparent;background-color:transparent;font-family:'Josefin Slab',serif;font-weight:700;color:#f5f3dc;}
 div.subnav .nav>li+li>a{border-color:transparent;}
 div.subnav .nav>li.active>a,div.subnav .nav>li>a:hover,div.subnav .nav>li.active>a:hover,div.subnav .dropdown.open .dropdown-toggle,div.subnav .dropdown.open.active .dropdown-toggle:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:transparent;border-color:transparent;color:#ebd90b;}
 div.subnav .dropdown.open>.dropdown-menu{background-color:#f5f3dc;color:#013435;border-color:transparent;}
diff --git a/spruce/bootswatch.less b/spruce/bootswatch.less
index 24235df7..91c32aeb 100755
--- a/spruce/bootswatch.less
+++ b/spruce/bootswatch.less
@@ -146,21 +146,35 @@ blockquote {
 		margin-top: 14px;
 	}
 
-	.nav-collapse.in .nav li > a {
-		color: @headingsColor;
-
-		&:hover {
-			color: @yellow;
-			background-color: @blue;
-		}
-	}
-
 	.navbar-form, .navbar-search {
 		border-color: transparent;
 		.box-shadow(none);
 	}
 }
 
+@media (max-width: @navbarCollapseWidth) {
+
+	.navbar .nav-collapse {
+
+		.nav li > a {
+			color: @headingsColor;
+
+			&:hover {
+				color: @yellow;
+				background-color: @blue;
+			}
+		}	
+	}
+
+	.navbar-inverse .nav-collapse {
+
+		.nav li > a:hover {
+			background-color: rgba(0, 0, 0, 0.06) !important;
+		}
+
+	}
+}
+
 div.subnav {
 	background-color: @green;
 	background-image: none;