removed animation from dropdown

jameschildress · jameschildress · commit 0aecdeaeb625 · 2012-11-10T09:09:12.000-05:00
diff --git a/assets/index.scss b/assets/index.scss
@@ -139,6 +139,11 @@ a {
           text-decoration: none;
 					border-top: $border;
 					background: transparent url("/images/city-arrow.png") no-repeat right center;
+
+					@media (max-width: $tablet) {
+						padding-top: 7px;
+						padding-bottom: 7px;
+					}
 					
 					&:hover, &.highlight {
 						background: {
@@ -159,11 +164,7 @@ a {
 							position: right center, left top;
 						}
 					}
-
-          small {
-            color: $black;
-            font-size: $city-size / 2;
-          }
+					
         }
 
 				&:first-child a {
@@ -174,7 +175,9 @@ a {
     }
 
 		@media (max-width: $tablet) {
-			
+			#menu {
+				height: 0;
+			}
       h2 {
 				color: $white;
 				font-weight: bold;
@@ -198,17 +201,15 @@ a {
 			}
     }
 
-		@media (min-width: $tablet + 1) {
-			#menu {
-				display: block !important;
-			}
-		}
-
 		&.show_menu {
 			@media (max-width: $tablet) {
+				#menu {
+					height: auto;
+				}
 				h2 {
 					border-bottom-left-radius: 0;
 					border-bottom-right-radius: 0;
+					box-shadow: none;
 				}
 				ul {
 					border-top-left-radius: 0;
diff --git a/javascripts/city_dropdown.js b/javascripts/city_dropdown.js
@@ -1,25 +1,13 @@
 $(function(){
 
-	var tablet_width, class_name, wrapper, menu, header;
+	var class_name, wrapper, header;
 
-	tablet_width = 767;
-	class_name = "show_menu";
-	
+	class_name = "show_menu";	
 	wrapper = $("#menu_wrapper");
-	menu = wrapper.find("#menu");
 	header = wrapper.find("#menu_header");
-	
-	menu.hide();
-	
+		
 	header.click(function(){
-		if ($(window).width() <= tablet_width) {
-			wrapper.stop().toggleClass(class_name);
-			if (wrapper.hasClass(class_name)) {
-				menu.slideDown();
-			} else {
-				menu.slideUp();
-			}
-		}
+		wrapper.toggleClass(class_name);
 	})
 	
 });
diff --git a/stylesheets/index.css b/stylesheets/index.css
@@ -100,6 +100,10 @@ a {
         text-decoration: none;
         border-top: 1px solid #e0e0e0;
         background: transparent url("/images/city-arrow.png") no-repeat right center; }
+        @media (max-width: 767px) {
+          .wrapper #menu_wrapper ul li a {
+            padding-top: 7px;
+            padding-bottom: 7px; } }
         .wrapper #menu_wrapper ul li a:hover, .wrapper #menu_wrapper ul li a.highlight {
           background-color: #69b373;
           background-image: url("/images/city-arrow-hover.png"), url("/images/green-gradient.png");
@@ -112,12 +116,11 @@ a {
           background-image: url("/images/city-arrow-hover.png"), url("/images/green-gradient.png");
           background-repeat: no-repeat, repeat-x;
           background-position: right center, left top; }
-        .wrapper #menu_wrapper ul li a small {
-          color: #555555;
-          font-size: 9px; }
       .wrapper #menu_wrapper ul li:first-child a {
         border: none; }
   @media (max-width: 767px) {
+    .wrapper #menu_wrapper #menu {
+      height: 0; }
     .wrapper #menu_wrapper h2 {
       color: white;
       font-weight: bold;
@@ -136,13 +139,13 @@ a {
       background-position: 10px center, left bottom;
       background-repeat: no-repeat, repeat-x;
       background-size: 18px, auto; } }
-  @media (min-width: 768px) {
-    .wrapper #menu_wrapper #menu {
-      display: block !important; } }
   @media (max-width: 767px) {
+    .wrapper #menu_wrapper.show_menu #menu {
+      height: auto; }
     .wrapper #menu_wrapper.show_menu h2 {
       border-bottom-left-radius: 0;
-      border-bottom-right-radius: 0; }
+      border-bottom-right-radius: 0;
+      box-shadow: none; }
     .wrapper #menu_wrapper.show_menu ul {
       border-top-left-radius: 0;
       border-top-right-radius: 0; } }
