Add role control

2026-06-23 07:19:08 -07:00
parent deff2264a6
commit 870eeec82a
45 changed files with 1923 additions and 165 deletions
@@ -200,6 +200,70 @@
    max-height: calc(100vh - 200px); // Account for header and footer
 }

+// Quick search / filter box
+.nav-search {
+    position: relative;
+    display: flex;
+    align-items: center;
+    margin: 0 1.25rem 1.5rem;
+
+    .nav-search-icon {
+        position: absolute;
+        left: 0.625rem;
+        width: 16px;
+        height: 16px;
+        color: #9ca3af;
+        pointer-events: none;
+    }
+
+    .nav-search-input {
+        width: 100%;
+        padding: 0.5rem 2rem 0.5rem 2rem;
+        border: 1px solid #e5e7eb;
+        border-radius: 8px;
+        background: #f9fafb;
+        font-size: 0.85rem;
+        color: #1f2937;
+        transition: all 0.2s ease;
+
+        &::placeholder {
+            color: #9ca3af;
+        }
+
+        &:focus {
+            outline: none;
+            border-color: #1e40af;
+            background: #ffffff;
+            box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.1);
+        }
+    }
+
+    .nav-search-clear {
+        position: absolute;
+        right: 0.5rem;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: none;
+        border: none;
+        padding: 0.25rem;
+        cursor: pointer;
+        color: #9ca3af;
+        border-radius: 4px;
+        transition: all 0.2s ease;
+
+        kendo-svgicon {
+            width: 14px;
+            height: 14px;
+        }
+
+        &:hover {
+            color: #1e40af;
+            background: #f3f4f6;
+        }
+    }
+}
+
 .nav-section {
    margin-bottom: 2rem;

@@ -213,6 +277,55 @@
    }
 }

+// Collapsible finance group
+.nav-group {
+    margin-bottom: 0.25rem;
+
+    .nav-group-header {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 0.75rem;
+        padding: 0.625rem 1.5rem;
+        background: none;
+        border: none;
+        cursor: pointer;
+        color: #4b5563;
+        transition: all 0.2s ease;
+
+        .nav-group-title {
+            font-size: 0.85rem;
+            font-weight: 600;
+        }
+
+        .nav-group-chevron {
+            width: 16px;
+            height: 16px;
+            color: #9ca3af;
+            transition: transform 0.2s ease;
+        }
+
+        &:hover {
+            background: rgba(30, 64, 175, 0.06);
+            color: #1e40af;
+        }
+
+        &.expanded .nav-group-chevron {
+            transform: rotate(180deg);
+        }
+    }
+
+    .nav-group-items {
+        padding: 0.125rem 0;
+    }
+}
+
+// Nested item inside a group — indent the icon to show hierarchy
+.nav-item.nav-item-nested {
+    padding-left: 2.5rem;
+}
+
 .nav-item {
    display: flex;
    align-items: center;