diff --git a/frontend/app/tab/tab.scss b/frontend/app/tab/tab.scss index 031276698..1e63b5763 100644 --- a/frontend/app/tab/tab.scss +++ b/frontend/app/tab/tab.scss @@ -41,7 +41,7 @@ .tab-inner { border-color: transparent; border-radius: 6px; - background: rgb(from var(--main-text-color) r g b / 0.14); + background: rgb(from var(--main-text-color) r g b / 0.1); } .name { @@ -111,7 +111,7 @@ body:not(.nohover) .tab:hover { .tab-inner { border-color: transparent; - background: rgb(from var(--main-text-color) r g b / 0.14); + background: rgb(from var(--main-text-color) r g b / 0.1); } .close { visibility: visible; diff --git a/frontend/app/tab/workspaceswitcher.scss b/frontend/app/tab/workspaceswitcher.scss index eb7d96a30..880db794f 100644 --- a/frontend/app/tab/workspaceswitcher.scss +++ b/frontend/app/tab/workspaceswitcher.scss @@ -9,10 +9,14 @@ align-items: center; gap: 12px; border-radius: 6px; - background: var(--modal-bg-color); margin-top: 6px; margin-right: 13px; box-sizing: border-box; + background-color: rgb(from var(--main-text-color) r g b / 0.1) !important; + + &:hover { + background-color: rgb(from var(--main-text-color) r g b / 0.14) !important; + } .workspace-icon { width: 15px; diff --git a/frontend/app/tab/workspaceswitcher.tsx b/frontend/app/tab/workspaceswitcher.tsx index 7f322c590..4c81ee4b4 100644 --- a/frontend/app/tab/workspaceswitcher.tsx +++ b/frontend/app/tab/workspaceswitcher.tsx @@ -32,6 +32,33 @@ interface ColorSelectorProps { className?: string; } +const colors = [ + "#58C142", // Green (accent) + "#00FFDB", // Teal + "#429DFF", // Blue + "#BF55EC", // Purple + "#FF453A", // Red + "#FF9500", // Orange + "#FFE900", // Yellow +]; + +const icons = [ + "triangle", + "star", + "cube", + "gem", + "chess-knight", + "heart", + "plane", + "rocket", + "shield-cat", + "paw-simple", + "umbrella", + "graduation-cap", + "mug-hot", + "circle", +]; + const ColorSelector = memo(({ colors, selectedColor, onSelect, className }: ColorSelectorProps) => { const handleColorClick = (color: string) => { onSelect(color); @@ -117,31 +144,8 @@ const ColorAndIconSelector = memo( value={title} autoFocus /> - - + +