From b10801167a0b75de4b5367725800df8767114ae0 Mon Sep 17 00:00:00 2001
From: Nitin Kumar Yadav <nitinyadav8675@gmail.com>
Date: Sun, 15 Feb 2026 01:29:25 +0530
Subject: [PATCH 1/4] fix: column dropdown visibility and z-index in dark theme

---
 frontend/src/components/CollectionTable.jsx | 49 ++++++++++++---------
 1 file changed, 27 insertions(+), 22 deletions(-)

diff --git a/frontend/src/components/CollectionTable.jsx b/frontend/src/components/CollectionTable.jsx
index c67120d47..f85be89a5 100644
--- a/frontend/src/components/CollectionTable.jsx
+++ b/frontend/src/components/CollectionTable.jsx
@@ -302,16 +302,20 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
     const showSlider = scrollState.scrollWidth > scrollState.clientWidth;
 
     return (
-        <div className="table-wrapper" style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
+        <div className="table-wrapper" style={{ display: 'flex', flexDirection: 'column', height: '100%', overflow: 'visible' }}>
             {/* Toolbar Area */}
             <div className="table-toolbar glass-panel" style={{
+                overflow: 'visible',
+                position: 'relative',
+                zIndex: 50,
                 padding: '0.75rem 1.5rem',
                 borderBottom: '1px solid var(--color-border)',
                 display: 'flex',
                 justifyContent: 'flex-end',
                 background: 'rgba(10, 10, 10, 0.4)',
                 backdropFilter: 'blur(10px)',
-                marginBottom: '1px'
+                marginBottom: '1px',
+                
             }}>
                 <div style={{ position: 'relative' }}>
                     <button
@@ -329,29 +333,27 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
                         <Settings2 size={14} />
                         COLUMNS
                     </button>
-
-                    {showColumnMenu && (
+   {showColumnMenu && (
                         <>
                             <div
                                 className="fixed-backdrop"
-                                style={{ position: 'fixed', inset: 0, zIndex: 40 }}
+                                style={{ position: 'fixed', inset: 0, zIndex: 10 }}
                                 onClick={() => setShowColumnMenu(false)}
                             />
-                            <div className="column-menu glass-panel" style={{
-                                position: 'absolute',
-                                right: 0,
-                                top: '100%',
-                                marginTop: '8px',
-                                width: '240px',
-                                maxHeight: '400px',
-                                overflowY: 'auto',
-                                zIndex: 50,
-                                padding: '8px',
-                                border: '1px solid var(--color-border)',
-                                boxShadow: '0 10px 40px rgba(0,0,0,0.5)',
-                                borderRadius: '8px',
-                                background: '#0A0A0A'
-                            }}>
+                            <div
+  className="column-menu glass-panel"
+  style={{
+    position: 'absolute',
+    right: 0,
+    top: 'calc(100% + 6px)',
+    width: '220px',
+    maxHeight: '320px',
+    overflowY: 'auto',
+    zIndex: 100000,
+  }}
+>
+
+
                                 <div style={{
                                     fontSize: '0.7rem',
                                     fontWeight: 700,
@@ -405,6 +407,7 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
                             </div>
                         </>
                     )}
+                 
                 </div>
             </div>
 
@@ -437,7 +440,8 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
                                                 position: (isStickyLeft || isStickyRight) ? "sticky" : "relative",
                                                 left: isStickyLeft ? 0 : 'auto',
                                                 right: isStickyRight ? 0 : 'auto',
-                                                zIndex: (isStickyLeft || isStickyRight) ? 20 : 10,
+                                               zIndex: (isStickyLeft || isStickyRight) ? 5 : 3,
+
                                                 background: 'rgba(10, 10, 10, 0.85)',
                                                 backdropFilter: 'blur(8px)',
                                                 boxShadow: isStickyRight ? '-5px 0 15px rgba(0,0,0,0.3)' : 'none'
@@ -479,7 +483,8 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
                                             position: (isStickyLeft || isStickyRight) ? "sticky" : "relative",
                                             left: isStickyLeft ? 0 : 'auto',
                                             right: isStickyRight ? 0 : 'auto',
-                                            zIndex: (isStickyLeft || isStickyRight) ? 5 : 1,
+                                          zIndex: (isStickyLeft || isStickyRight) ? 2 : 1,
+
                                             boxShadow: isStickyRight ? '-5px 0 15px rgba(0,0,0,0.2)' : 'none'
                                         };
 

From c9d48f6fb3da5a09937fcd01f5cb31f098db5b8c Mon Sep 17 00:00:00 2001
From: Nitin Kumar Yadav <nitinyadav8675@gmail.com>
Date: Sun, 15 Feb 2026 15:57:41 +0530
Subject: [PATCH 2/4]  reduce dropdown z-index to 1000

---
 frontend/src/components/CollectionTable.jsx | 22 ++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/frontend/src/components/CollectionTable.jsx b/frontend/src/components/CollectionTable.jsx
index f85be89a5..4fe0dc709 100644
--- a/frontend/src/components/CollectionTable.jsx
+++ b/frontend/src/components/CollectionTable.jsx
@@ -341,17 +341,17 @@ export default function CollectionTable({ data, activeCollection, onDelete, onVi
                                 onClick={() => setShowColumnMenu(false)}
                             />
                             <div
-  className="column-menu glass-panel"
-  style={{
-    position: 'absolute',
-    right: 0,
-    top: 'calc(100% + 6px)',
-    width: '220px',
-    maxHeight: '320px',
-    overflowY: 'auto',
-    zIndex: 100000,
-  }}
->
+                     className="column-menu glass-panel"
+                 style={{
+                       position: 'absolute',
+                         right: 0,
+                        top: 'calc(100% + 6px)',
+                        width: '220px',
+                         maxHeight: '320px',
+                          overflowY: 'auto',
+                           zIndex: 1000,
+                        }}
+                         >
 
 
                                 <div style={{

From f74170c4362493832bbdb2d6da738e4cd4eac1a7 Mon Sep 17 00:00:00 2001
From: Nitin Kumar Yadav <nitinyadav8675@gmail.com>
Date: Sun, 15 Feb 2026 20:48:17 +0530
Subject: [PATCH 3/4] fix: improve create collection dropdown visibility in
 dark mode

---
 frontend/src/index.css | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/frontend/src/index.css b/frontend/src/index.css
index 009dfafa5..7b7c9dc2f 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -497,4 +497,21 @@ body {
   padding: 5px;
   width: 5rem;
 
-}
\ No newline at end of file
+}
+
+/* Fix dark-mode select dropdown options */
+select {
+  background-color: var(--color-bg-input);
+  color: #ffffff;
+}
+
+select option {
+  background-color: #0f0f0f;   
+  color: #ffffff;              
+}
+
+/* Optional: hover state */
+select option:hover {
+  background-color: #1f2933;
+}
+

From 61907b2f7e783ce0fb4d520b72baeddeae14188c Mon Sep 17 00:00:00 2001
From: Nitin Kumar Yadav <nitinyadav8675@gmail.com>
Date: Sun, 15 Feb 2026 21:08:22 +0530
Subject: [PATCH 4/4]  remove ineffective option:hover styles

---
 frontend/src/index.css | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/frontend/src/index.css b/frontend/src/index.css
index 7b7c9dc2f..843ef7aa0 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -510,8 +510,5 @@ select option {
   color: #ffffff;              
 }
 
-/* Optional: hover state */
-select option:hover {
-  background-color: #1f2933;
-}
+