diff --git a/libs/shared/lib/components/tabs/Tab.tsx b/libs/shared/lib/components/tabs/Tab.tsx index 49a66667fcb8b63f4313fb0907bd0d482d5518e1..3d8aad9f663a74ad4a2f6b21e616135105074198 100644 --- a/libs/shared/lib/components/tabs/Tab.tsx +++ b/libs/shared/lib/components/tabs/Tab.tsx @@ -30,7 +30,6 @@ export const Tabs = (props: { children: React.ReactNode; tabType?: TabTypes }) = export const Tab = ({ activeTab, text, - variant = 'ghost', className = '', ...props }: ButtonProps & { @@ -43,7 +42,7 @@ export const Tab = ({ if (context.tabType === 'inline') { className += ` pl-2 pr-1 gap-1 relative h-full text-secondary-500 border-secondary-200 before:content-[''] before:absolute before:left-0 before:bottom-0 before:h-[2px] before:w-full - ${activeTab ? 'before:bg-primary-500' : 'before:bg-transparent hover:before:bg-secondary-300 hover:bg-secondary-200'}`; + ${activeTab ? 'before:bg-primary-500 hover:bg-inherit' : 'before:bg-transparent hover:before:bg-secondary-300 hover:text-dark hover:bg-secondary-200'}`; } else if (context.tabType === 'rounded') { className += ` -mb-px py-4 px-4 text-sm text-secondary-500 text-center border rounded-t-lg rounded-b-none ${activeTab ? 'active text-secondary-950 border-l-secondary-300 border-r-secondary-300 border-t-secondary-300 border-b-white' : ''} @@ -53,10 +52,10 @@ export const Tab = ({ } return ( - <Button className={className} label={text} variant={variant} size="xs" {...props}> - {/* <p className={`text-xs font-semibold ${activeTab && 'text-secondary-950'}`}>{text}</p> */} + <div className={`btn btn-ghost btn-xs rounded-none ${className}`} {...props}> + <span>{text}</span> {props.children} - </Button> + </div> ); };