From 7895fbe3fe4734b339a708df81bd4f236afbe926 Mon Sep 17 00:00:00 2001
From: Vixalie <vixalie@outlook.com>
Date: Thu, 14 Aug 2025 22:14:32 +0800
Subject: [PATCH] =?UTF-8?q?style(Segments):=20=E4=BC=98=E5=8C=96=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E5=92=8C=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整 padding: 将 p-1 替换为 px-1 py-1，提供更精确的内边距
- 添加 flex gap: 在 flex 布局中加入 gap-1，增加选项之间的间隔
- 调整选项样式: 将 py-1 替换为 py-0.5，使选项高度更加合适
---
 src/components/Segments.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Segments.tsx b/src/components/Segments.tsx
index 877fb03..c09a598 100644
--- a/src/components/Segments.tsx
+++ b/src/components/Segments.tsx
@@ -77,10 +77,10 @@ const Segments: Component<SegmentsProps> = (props) => {
   };
 
   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
         class={cx(
-          'relative flex',
+          'relative flex gap-1',
           mProps.direction === 'horizontal' ? 'flex-row items-center' : 'flex-col',
         )}>
         <Index each={mProps.options}>
@@ -89,7 +89,7 @@ const Segments: Component<SegmentsProps> = (props) => {
               ref={(el) => (optionRefs[index] = el)}
               aria-disabled={mProps.disabled}
               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
                   ? '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',