starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-23 18:01:08 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

fix padding and hover highlight in tabs (#243)

Browse Source
This commit is contained in:
Song
2025-07-20 00:19:48 +08:00
committed by GitHub
parent d6057aa1ec
commit adca071574
3 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src-web/components/core/Tabs/Tabs.tsx
View File

@@ -84,7 +84,7 @@ export function Tabs({
tabListClassName,
addBorders && '!-ml-1',
'flex items-center hide-scrollbars mb-2',
layout === 'horizontal' && 'h-full overflow-auto px-2',
layout === 'horizontal' && 'h-full overflow-auto p-2',
layout === 'vertical' && 'overflow-x-auto overflow-y-visible ',
// Give space for button focus states within overflow boundary.
layout === 'vertical' && 'py-1 -ml-5 pl-3 pr-1',
@@ -100,9 +100,9 @@ export function Tabs({
const isActive = t.value === value;
const btnClassName = classNames(
'h-sm flex items-center rounded whitespace-nowrap',
'!px-2 ml-[1px]',
addBorders && 'border',
isActive ? 'text-text' : 'text-text-subtle hover:text-text',
'!px-2 ml-[1px] hocus:text-text',
addBorders && 'border hocus:bg-surface-highlight',
isActive ? 'text-text' : 'text-text-subtle',
isActive && addBorders
? 'border-surface-active bg-surface-active'
: layout === 'vertical'
@@ -177,7 +177,7 @@ export const TabContent = memo(function TabContent({
<div
tabIndex={-1}
data-tab={value}
className={classNames(className, 'tab-content', 'hidden w-full h-full')}
className={classNames(className, 'tab-content', 'hidden w-full h-full py-2')}
>
{children}
</div>