xt/comfy-downloader
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(Segments): 优化样式和布局

Browse Source 
- 调整 padding: 将 p-1 替换为 px-1 py-1，提供更精确的内边距
- 添加 flex gap: 在 flex 布局中加入 gap-1，增加选项之间的间隔
- 调整选项样式: 将 py-1 替换为 py-0.5，使选项高度更加合适
This commit is contained in:
Vixalie
2025-08-14 22:14:32 +08:00
parent 5523047b69
commit 7895fbe3fe
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Segments.tsx
View File

@@ -77,10 +77,10 @@ const Segments: Component<SegmentsProps> = (props) => {
}; };
return ( return (
<div class="inline-block overflow-hidden rounded-sm p-1 select-none bg-neutral"> <div class="inline-block overflow-hidden rounded-sm px-1 py-1 select-none bg-neutral">
<div <div
class={cx( class={cx(
'relative flex', 'relative flex gap-1',
mProps.direction === 'horizontal' ? 'flex-row items-center' : 'flex-col', mProps.direction === 'horizontal' ? 'flex-row items-center' : 'flex-col',
)}> )}>
<Index each={mProps.options}> <Index each={mProps.options}>
@@ -89,7 +89,7 @@ const Segments: Component<SegmentsProps> = (props) => {
ref={(el) => (optionRefs[index] = el)} ref={(el) => (optionRefs[index] = el)}
aria-disabled={mProps.disabled} aria-disabled={mProps.disabled}
class={cx( class={cx(
'z-[5] cursor-pointer rounded-sm px-2 py-1', 'z-[5] cursor-pointer rounded-sm px-2 py-0.5',
selected() === option().value selected() === option().value
? 'not-aria-disabled:text-on-primary-surface aria-disabled:text-primary-disabled hover:not-aria-disabled:bg-primary-surface-hover/45' ? 'not-aria-disabled:text-on-primary-surface aria-disabled:text-primary-disabled hover:not-aria-disabled:bg-primary-surface-hover/45'
: 'not-aria-disabled:text-on-surface aria-disabled:text-surface-disabled hover:not-aria-disabled:bg-surface/35', : 'not-aria-disabled:text-on-surface aria-disabled:text-surface-disabled hover:not-aria-disabled:bg-surface/35',