From 4c74f040761f601c7d9e2e714d76cfad3258c01a Mon Sep 17 00:00:00 2001
From: Ryan Wang <i@ryanc.cc>
Date: Fri, 4 Nov 2022 21:44:11 +0800
Subject: [PATCH] perf: optimize the style of fieldset in the form
 (halo-dev/console#680)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/kind improvement
/milestone 2.0

#### What this PR does / why we need it:

优化表单中关于 fieldset 的样式。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2655

#### Screenshots:

before:

<img width="553" alt="image" src="https://user-images.githubusercontent.com/21301288/199667319-f94b962f-f4ba-4eb5-bd56-3224218e0920.png">

after:

<img width="562" alt="image" src="https://user-images.githubusercontent.com/21301288/199667265-d29c5933-2d16-402f-9496-065e9cb73046.png">


#### Special notes for your reviewer:

/cc @halo-dev/sig-halo-console

#### Does this PR introduce a user-facing change?

```release-note
优化表单中关于 fieldset 的样式。
```
---
 src/formkit/theme.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/formkit/theme.ts b/src/formkit/theme.ts
index f7a391997..c0bf79194 100644
--- a/src/formkit/theme.ts
+++ b/src/formkit/theme.ts
@@ -9,10 +9,11 @@ const textClassification = {
 
 const boxClassification = {
   label: textClassification.label,
-  legend: textClassification.label,
+  legend: `${textClassification.label} px-2`,
   fieldset:
-    "border border-gray-300 rounded-base px-2 py-2 focus-within:border-primary max-w-lg",
-  wrapper: "flex items-center mb-1 cursor-pointer",
+    "group border border-gray-300 rounded-base px-2 py-2 focus-within:border-primary max-w-lg",
+  wrapper:
+    "flex items-center mb-1 cursor-pointer group-[.formkit-fieldset]:px-2",
   help: "mb-2 mt-0",
   input:
     "form-check-input h-4 w-4 mr-2 border border-gray-500 rounded-sm bg-white checked:bg-primary focus:outline-none focus:ring-0 transition duration-200",