Make dropdown nav menus display on hover.

stephenmcd · Oct 19, 2013 · da1ded9 · da1ded9
1 parent 323660d
commit da1ded9
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/mezzanine/core/static/css/mezzanine.css b/mezzanine/core/static/css/mezzanine.css
@@ -288,3 +288,12 @@ img.pull-left {
 .profile-image {
   margin-bottom: 20px;
 }
+/*========================================
+          RESPONSIVE TWEAKS
+==========================================*/
+/* Display dropdowns on hover only in desktops (md and lg classes) */
+@media (min-width: 768px) {
+  .navbar-nav > li.dropdown:hover > ul.dropdown-menu {
+    display: block;
+  }
+}
diff --git a/mezzanine/pages/templates/pages/menus/dropdown.html b/mezzanine/pages/templates/pages/menus/dropdown.html
@@ -16,7 +16,7 @@
         id="dropdown-menu-{{ page.html_id }}">
         <a href="{{ page.get_absolute_url }}"
         {% if page.has_children_in_menu %}
-        class="dropdown-toggle" data-toggle="dropdown"            
+        class="dropdown-toggle disabled" data-toggle="dropdown"            
         {% endif %}>
             {{ page.title }}
             {% if page.has_children_in_menu %}<b class="caret"></b>{% endif %}
@@ -25,7 +25,6 @@
     </li>
     {% endif %}
     {% endfor %}
-    <li class="divider-vertical"></li>
 </ul>
 {% endif %}