From 29f79ee24d90703e308d5a61a96ad56debaf56b3 Mon Sep 17 00:00:00 2001
From: jlukic <jacklukic@gmail.com>
Date: Wed, 8 Oct 2014 23:51:21 -0400
Subject: [PATCH] Adds responsive breakpoints for dropdown menu height

---
 src/definitions/modules/dropdown.less         | 30 +++++++++++++++++++
 .../default/modules/dropdown.variables        | 14 ++++++++-
 2 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/src/definitions/modules/dropdown.less b/src/definitions/modules/dropdown.less
index 90804c63b..fb6f125a4 100755
--- a/src/definitions/modules/dropdown.less
+++ b/src/definitions/modules/dropdown.less
@@ -56,6 +56,10 @@
   background: @menuBackground;
   min-width: 100%;
 
+  overflow-y: auto;
+  backface-visibility: hidden;
+  -webkit-overflow-scrolling: touch;
+
   white-space: @menuWrap;
   font-size: 1rem;
   text-shadow: none;
@@ -69,6 +73,32 @@
   will-change: transform, opacity;
 }
 
+/*--------------
+   Responsive
+---------------*/
+
+@media only screen and (max-width : @largestMobileScreen) {
+  .ui.dropdown .menu {
+    max-height: @mobileMaxMenuHeight;
+  }
+}
+@media only screen and (min-width: @tabletBreakpoint) {
+  .ui.dropdown .menu {
+    max-height: @tabletMaxMenuHeight;
+  }
+}
+@media only screen and (min-width: @computerBreakpoint) {
+  .ui.dropdown .menu {
+    max-height: @computerMaxMenuHeight;
+  }
+}
+@media only screen and (min-width: @widescreenMonitorBreakpoint) {
+  .ui.dropdown .menu {
+    max-height: @widescreenMaxMenuHeight;
+  }
+}
+
+
 /*--------------
   Hidden Input
 ---------------*/
diff --git a/src/themes/packages/default/modules/dropdown.variables b/src/themes/packages/default/modules/dropdown.variables
index 9f88fadbf..a925ec9d2 100755
--- a/src/themes/packages/default/modules/dropdown.variables
+++ b/src/themes/packages/default/modules/dropdown.variables
@@ -47,10 +47,22 @@
 @itemVerticalPadding: 0.65rem;
 @itemHorizontalPadding: 1.25rem;
 @itemFontWeight: normal;
-@itemLineHeight: 1.2;
+@itemLineHeight: 1.2em;
 @itemTextTransform: none;
 @itemBoxShadow: none;
 
+/* Responsive */
+@itemActualHeight: (@itemVerticalPadding * 2) + @itemLineHeight;
+
+@mobileMaxItems: 6;
+@tabletMaxItems: 8;
+@computerMaxItems: 12;
+@mobileMaxMenuHeight: (@itemActualHeight * @mobileMaxItems);
+@tabletMaxMenuHeight: (@itemActualHeight * @tabletMaxItems);
+@computerMaxMenuHeight: (@itemActualHeight * @computerMaxItems);
+@widescreenMaxMenuHeight: 9999px;
+
+
 /* Menu Header */
 @menuHeaderColor: @darkTextColor;
 @menuHeaderFontSize: 0.8em;