starred/yaak
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-01-11 20:00:29 +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

2
src-web/commands/openWorkspaceSettings.tsx
View File

@@ -14,7 +14,7 @@ export function openWorkspaceSettings(tab?: WorkspaceSettingsTab) {
id: 'workspace-settings',
title: 'Workspace Settings',
size: 'md',
className: 'h-[calc(100vh-5rem)] max-h-[40rem]',
className: 'h-[calc(100vh-5rem)] !max-h-[40rem]',
noPadding: true,
render: ({ hide }) => (
<WorkspaceSettingsDialog workspaceId={workspaceId} hide={hide} tab={tab} />

12
src-web/components/Settings/Settings.tsx
View File

@@ -74,22 +74,22 @@ export default function Settings({ hide }: Props) {
onChangeValue={setTab}
tabs={tabs.map((value) => ({ value, label: capitalize(value) }))}
>
<TabContent value={TAB_GENERAL} className="pt-3 overflow-y-auto h-full px-4">
<TabContent value={TAB_GENERAL} className="overflow-y-auto h-full px-4">
<SettingsGeneral />
</TabContent>
<TabContent value={TAB_INTERFACE} className="pt-3 overflow-y-auto h-full px-4">
<TabContent value={TAB_INTERFACE} className="overflow-y-auto h-full px-4">
<SettingsInterface />
</TabContent>
<TabContent value={TAB_THEME} className="pt-3 overflow-y-auto h-full px-4">
<TabContent value={TAB_THEME} className="overflow-y-auto h-full px-4">
<SettingsTheme />
</TabContent>
<TabContent value={TAB_PLUGINS} className="pt-3 h-full px-4 grid grid-rows-1">
<TabContent value={TAB_PLUGINS} className="h-full px-4 grid grid-rows-1">
<SettingsPlugins />
</TabContent>
<TabContent value={TAB_PROXY} className="pt-3 overflow-y-auto h-full px-4">
<TabContent value={TAB_PROXY} className="overflow-y-auto h-full px-4">
<SettingsProxy />
</TabContent>
<TabContent value={TAB_LICENSE} className="pt-3 overflow-y-auto h-full px-4">
<TabContent value={TAB_LICENSE} className="overflow-y-auto h-full px-4">
<SettingsLicense />
</TabContent>
</Tabs>

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>