From ec2f544a3e8ecd403318e2c4577095bd3e77dc9b Mon Sep 17 00:00:00 2001
From: kjs <kjs@wace.me>
Date: Thu, 6 Nov 2025 11:26:38 +0900
Subject: [PATCH] =?UTF-8?q?style:=20=EC=B1=84=EB=B2=88=EA=B7=9C=EC=B9=99?=
 =?UTF-8?q?=20=EA=B7=9C=EC=B9=99=EB=AA=85=EA=B3=BC=20=EB=AF=B8=EB=A6=AC?=
 =?UTF-8?q?=EB=B3=B4=EA=B8=B0=EB=A5=BC=20=ED=95=9C=20=EC=A4=84=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B0=B0=EC=B9=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 규칙명과 미리보기를 flex로 나란히 배치
- 각각 flex-1로 동일한 너비 (50:50)
- gap-3로 간격 설정
- 공간 효율성 향상
---
 .../numbering-rule/NumberingRuleDesigner.tsx  | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/frontend/components/numbering-rule/NumberingRuleDesigner.tsx b/frontend/components/numbering-rule/NumberingRuleDesigner.tsx
index 2b7e6236..fc6b883f 100644
--- a/frontend/components/numbering-rule/NumberingRuleDesigner.tsx
+++ b/frontend/components/numbering-rule/NumberingRuleDesigner.tsx
@@ -312,18 +312,20 @@ export const NumberingRuleDesigner: React.FC<NumberingRuleDesignerProps> = ({
               </Button>
             </div>
 
-            <div className="space-y-2">
-              <Label className="text-sm font-medium">규칙명</Label>
-              <Input
-                value={currentRule.ruleName}
-                onChange={(e) => setCurrentRule((prev) => ({ ...prev!, ruleName: e.target.value }))}
-                className="h-9"
-                placeholder="예: 프로젝트 코드"
-              />
-            </div>
-
-            <div className="space-y-2">
-              <NumberingRulePreview config={currentRule} />
+            <div className="flex items-center gap-3">
+              <div className="flex-1 space-y-2">
+                <Label className="text-sm font-medium">규칙명</Label>
+                <Input
+                  value={currentRule.ruleName}
+                  onChange={(e) => setCurrentRule((prev) => ({ ...prev!, ruleName: e.target.value }))}
+                  className="h-9"
+                  placeholder="예: 프로젝트 코드"
+                />
+              </div>
+              <div className="flex-1 space-y-2">
+                <Label className="text-sm font-medium">미리보기</Label>
+                <NumberingRulePreview config={currentRule} />
+              </div>
             </div>
 
             <div className="flex-1 overflow-y-auto">