From 697a3c1252ea90b0c907ebb0dc66c5b63c1c4ce0 Mon Sep 17 00:00:00 2001
From: Sean Sun <33432158+SeanSun6814@users.noreply.github.com>
Date: Sun, 7 May 2023 15:18:03 -0400
Subject: [PATCH 1/2] feat(menu): add scrolling and shadows

---
 src/definitions/collections/menu.less | 78 +++++++++++++++++++++++++++
 1 file changed, 78 insertions(+)

diff --git a/src/definitions/collections/menu.less b/src/definitions/collections/menu.less
index ab481dca8c..e965b7b270 100755
--- a/src/definitions/collections/menu.less
+++ b/src/definitions/collections/menu.less
@@ -1923,6 +1923,84 @@ Floated Menu / Item
             margin-right: 0;
             width: 100%;
         }
+
+        .ui.top.attached.tabular.scroll {
+            display: flex;
+            position: relative;
+            overflow-x: auto;
+            overflow-y: hidden;
+            overscroll-behavior: contain;
+        }
+        
+        .ui.top.attached.tabular.scroll::-webkit-scrollbar {
+            display: none;
+            width: 0;
+            background: transparent;
+        }
+        
+        .ui.top.attached.tabular.menu>.item.active {
+            border-bottom: 1px solid #ffffff;
+        }
+        
+        .ui.top.attached.tabular.menu {
+            overflow: visible;
+            width: 100%;
+            min-width: fit-content !important;
+        }
+        
+        .ui.bottom.attached.tab.segment {
+            border-top: none !important;
+        }
+        
+        .ui.top.attached.tab.segment {
+            border-bottom: none !important;
+        }
+        
+        .ui.bottom.attached.tabular.menu {
+            overflow: visible;
+            width: 100% !important;
+            min-width: fit-content !important;
+        }
+        
+        .ui.attached.tabular.shadowHider {
+            border: black 1px;
+            margin-right: 1rem;
+            position: absolute;
+            height: 100%;
+            width: 1em;
+            background-color: white;
+            z-index: 2;
+        }
+        
+        .ui.attached.tabular.top.shadowHiderStart {
+            border-bottom: 1px solid #d4d4d5 !important;
+        }
+        
+        .ui.attached.tabular.shadowHiderEnd {
+            height: 100%;
+            position: sticky;
+            margin-left: -1rem;
+            flex: 0 0 1rem;
+            left: calc(100% - 2rem);
+        }
+        
+        .ui.attached.tabular.shadow {
+            position: sticky;
+            z-index: 1;
+            flex: 0 0 1rem;
+        }
+        
+        .ui.attached.tabular.shadowStart {
+            left: 0;
+            background-image: linear-gradient(90deg, #0004, transparent);
+        }
+        
+        .ui.attached.tabular.shadowEnd {
+            right: 0;
+            background-image: linear-gradient(90deg, transparent, #0004);
+            width: 1rem;
+            left: calc(100% - 2.1rem);
+        }
     }
 }
 

From 198492b826710fba949d0bd3f73e75779e7389bf Mon Sep 17 00:00:00 2001
From: Sean Sun <33432158+SeanSun6814@users.noreply.github.com>
Date: Sun, 7 May 2023 21:20:46 -0400
Subject: [PATCH 2/2] style(menu.less): fixed naming and spaces

---
 src/definitions/collections/menu.less | 38 +++++++++++++--------------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/src/definitions/collections/menu.less b/src/definitions/collections/menu.less
index e965b7b270..d8c743749a 100755
--- a/src/definitions/collections/menu.less
+++ b/src/definitions/collections/menu.less
@@ -1931,38 +1931,38 @@ Floated Menu / Item
             overflow-y: hidden;
             overscroll-behavior: contain;
         }
-        
+
         .ui.top.attached.tabular.scroll::-webkit-scrollbar {
             display: none;
             width: 0;
             background: transparent;
         }
-        
-        .ui.top.attached.tabular.menu>.item.active {
-            border-bottom: 1px solid #ffffff;
+
+        .ui.top.attached.tabular.menu > .item.active {
+            border-bottom: 1px solid #fff;
         }
-        
+
         .ui.top.attached.tabular.menu {
             overflow: visible;
             width: 100%;
             min-width: fit-content !important;
         }
-        
+
         .ui.bottom.attached.tab.segment {
             border-top: none !important;
         }
-        
+
         .ui.top.attached.tab.segment {
             border-bottom: none !important;
         }
-        
+
         .ui.bottom.attached.tabular.menu {
             overflow: visible;
             width: 100% !important;
             min-width: fit-content !important;
         }
-        
-        .ui.attached.tabular.shadowHider {
+
+        .ui.attached.tabular.shadow-hider {
             border: black 1px;
             margin-right: 1rem;
             position: absolute;
@@ -1971,31 +1971,31 @@ Floated Menu / Item
             background-color: white;
             z-index: 2;
         }
-        
-        .ui.attached.tabular.top.shadowHiderStart {
+
+        .ui.attached.tabular.top.shadow-hider-start {
             border-bottom: 1px solid #d4d4d5 !important;
         }
-        
-        .ui.attached.tabular.shadowHiderEnd {
+
+        .ui.attached.tabular.shadow-hider-end {
             height: 100%;
             position: sticky;
             margin-left: -1rem;
             flex: 0 0 1rem;
             left: calc(100% - 2rem);
         }
-        
+
         .ui.attached.tabular.shadow {
             position: sticky;
             z-index: 1;
             flex: 0 0 1rem;
         }
-        
-        .ui.attached.tabular.shadowStart {
+
+        .ui.attached.tabular.shadow-start {
             left: 0;
             background-image: linear-gradient(90deg, #0004, transparent);
         }
-        
-        .ui.attached.tabular.shadowEnd {
+
+        .ui.attached.tabular.shadow-end {
             right: 0;
             background-image: linear-gradient(90deg, transparent, #0004);
             width: 1rem;