fix: resolve styling issue for checkbox when disabled (#6240)

#### What type of PR is this?

/area ui
/kind bug
/milestone 2.17.x

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

修复 FormKit 中当 checkbox 为 disabled 时的样式问题。

before:

<img width="550" alt="image" src="https://github.com/halo-dev/halo/assets/21301288/65e8e750-6663-4e14-9f7f-5102e8412675">

after:

<img width="540" alt="image" src="https://github.com/halo-dev/halo/assets/21301288/2b55dcb4-b71a-45bf-8eae-17c490168bc6">

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

```release-note
None
```
pull/6279/head
Ryan Wang 2024-07-01 17:55:17 +08:00 committed by GitHub
parent f5ebd9fe43
commit 0b7b74e826
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 2 additions and 2 deletions

View File

@ -29,7 +29,7 @@ const theme: Record<string, Record<string, string>> = {
global: {
form: "divide-y divide-gray-100",
outer:
"formkit-disabled:opacity-50 py-4 first:pt-0 last:pb-0 transition-all",
"formkit-disabled:opacity-70 formkit-disabled:cursor-not-allowed formkit-disabled:pointer-events-none py-4 first:pt-0 last:pb-0 transition-all",
help: "text-xs mt-2 text-gray-500",
messages: "list-none p-0 mt-1.5 mb-0 transition-all",
message: "text-red-500 mt-2 text-xs",

View File

@ -22,5 +22,5 @@ textarea {
}
input[type="checkbox"] {
@apply rounded-sm border-gray-500 disabled:bg-gray-200 disabled:opacity-50;
@apply rounded-sm border-gray-500 disabled:cursor-not-allowed disabled:border-gray-400 disabled:opacity-50 disabled:checked:border-none;
}