diff --git a/src/frontend/src/primitives/Tabs.tsx b/src/frontend/src/primitives/Tabs.tsx index c2b76fb3..04638b94 100644 --- a/src/frontend/src/primitives/Tabs.tsx +++ b/src/frontend/src/primitives/Tabs.tsx @@ -40,7 +40,6 @@ const StyledTab = styled(RACTab, { outline: 'none', position: 'relative', color: 'box.text', - transition: 'color 200ms ease, backgroundColor 200ms ease', borderColor: 'transparent', forcedColorAdjust: 'none', }, @@ -57,6 +56,25 @@ const StyledTab = styled(RACTab, { border: 'none', }, }, + highlight: { + true: { + borderRadius: 4, + backgroundColor: 'colorPalette.active', + transition: 'background 200ms, color 200ms', + '&[data-hovered]': { + backgroundColor: 'gray.100', + color: 'box.text', + }, + '&[data-selected]': { + backgroundColor: 'primary', + color: 'white', + '&[data-hovered]': { + backgroundColor: 'primary', + color: 'white', + }, + }, + }, + }, }, defaultVariants: { border: true,