From c9a689229733614381ab6375d5560f569d4f9164 Mon Sep 17 00:00:00 2001
From: Toby Zerner <toby.zerner@gmail.com>
Date: Wed, 25 Oct 2017 12:36:09 +1030
Subject: [PATCH] Add LESS variable to configure expansion of sideNav dropdowns

---
 framework/core/less/lib/sideNav.less   | 71 ++++++++++++++------------
 framework/core/less/lib/variables.less |  2 +
 2 files changed, 40 insertions(+), 33 deletions(-)

diff --git a/framework/core/less/lib/sideNav.less b/framework/core/less/lib/sideNav.less
index ebc1caee2..13383a41b 100755
--- a/framework/core/less/lib/sideNav.less
+++ b/framework/core/less/lib/sideNav.less
@@ -9,7 +9,7 @@
 // control; the new discussion button is the primary-control. On anything
 // larger than a phone, however, we need to affix the sidebar and expand the
 // .dropdown-select into a plain list.
-@media @tablet-up {
+@media @expand-side-nav {
   .sideNav {
     // Expand the dropdown-select component into a normal nav list.
     & .Dropdown--select {
@@ -48,45 +48,50 @@
   }
 }
 
-.sideNav--horizontal {
-  padding: 15px 0;
-  white-space: nowrap;
-  overflow: auto;
-  -webkit-overflow-scrolling: touch;
+.sideNav--horizontal {}
 
-  &:after {
-    content: " ";
-    position: absolute;
-    left: 0;
-    right: 0;
-    margin-top: 15px;
-    border-bottom: 1px solid @control-bg;
-  }
+@media @expand-side-nav {
+  .sideNav--horizontal {
+    padding: 15px 0;
+    white-space: nowrap;
+    overflow: auto;
+    -webkit-overflow-scrolling: touch;
 
-  > ul > li, .Dropdown-menu > li {
-    display: inline-block;
-    margin: 0 20px 0 0;
-    vertical-align: top;
-  }
-  .Dropdown-separator {
-    display: none;
-  }
+    &:after {
+      content: " ";
+      position: absolute;
+      left: 0;
+      right: 0;
+      margin-top: 15px;
+      border-bottom: 1px solid @control-bg;
+    }
 
-  .Dropdown--select .Dropdown-menu > li > a {
-    padding-left: 25px;
+    > ul > li, .Dropdown-menu > li {
+      display: inline-block;
+      margin: 0 20px 0 0;
+      vertical-align: top;
+    }
+    .Dropdown-separator {
+      display: none;
+    }
 
-    .icon {
-      margin-left: -25px;
+    .Dropdown--select .Dropdown-menu > li > a {
+      padding-left: 25px;
+
+      .icon {
+        margin-left: -25px;
+      }
+    }
+
+    .affix {
+      position: static;
     }
   }
 
-  .affix {
-    position: static;
-  }
-}
-@media @tablet {
-  .sideNav {
-    .sideNav--horizontal();
+  @media @tablet {
+    .sideNav {
+      .sideNav--horizontal();
+    }
   }
 }
 
diff --git a/framework/core/less/lib/variables.less b/framework/core/less/lib/variables.less
index 501e52372..bc2ba5f32 100755
--- a/framework/core/less/lib/variables.less
+++ b/framework/core/less/lib/variables.less
@@ -110,6 +110,8 @@
 @zindex-alerts:                    1060;
 @zindex-tooltip:                   1070;
 
+@expand-side-nav:                  @tablet-up;
+
 // ---------------------------------
 // BREAKPOINTS