Improve tab styling and accessibility in linker UI

- Redesign tabs with new visual styling (active/hover states, separators)
- Add ARIA attributes for tab accessibility (aria-selected, aria-disabled, aria-current)
- Update header styling in linker-shell.css
- Refactor tab switching logic to use centralized state management
This commit is contained in:
Dariusz L
2026-05-28 06:05:21 +02:00
parent 1048b0ace4
commit 5dec88fd15
3 changed files with 120 additions and 40 deletions
+6 -5
View File
@@ -56,10 +56,10 @@
justify-content: space-between;
align-items: center;
gap: var(--ml-spacing-10);
min-height: 40px;
padding: 5px 10px;
border-bottom: 1px solid rgba(255, 255, 255, 0.09);
background: linear-gradient(180deg, rgba(255,255,255,0.035) 0%, rgba(255,255,255,0.012) 100%);
min-height: 42px;
padding: 6px 10px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.075);
background: #1f1f1f;
}
.ml-dialog-brand,
@@ -73,13 +73,14 @@
.ml-dialog-brand {
min-width: 0;
flex: 1 1 auto;
align-self: stretch;
}
.ml-dialog-controls {
flex: 0 0 auto;
align-self: stretch;
gap: 0;
margin: -5px -10px -5px 0;
margin: -6px -10px 0 0;
}
#model-linker-drag-handle {