From d9b77d8b0535874f6a3f24a35407b029d8d49e74 Mon Sep 17 00:00:00 2001 From: Victoria League Date: Wed, 21 Aug 2024 14:27:49 -0400 Subject: [PATCH] [CL-380] Remove hover state from disabled form fields (#10639) --- libs/components/src/form-field/form-field.component.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/libs/components/src/form-field/form-field.component.ts b/libs/components/src/form-field/form-field.component.ts index 41561bfbb4f..4860185fee5 100644 --- a/libs/components/src/form-field/form-field.component.ts +++ b/libs/components/src/form-field/form-field.component.ts @@ -49,6 +49,9 @@ export class BitFormFieldComponent implements AfterContentChecked { this.input.hasError ? "group-hover/bit-form-field:tw-border-danger-700" : "group-hover/bit-form-field:tw-border-primary-500", + // the next 2 selectors override the above hover selectors when the input (or text area) is non-interactive (i.e. readonly, disabled) + "group-has-[input:read-only]/bit-form-field:group-hover/bit-form-field:tw-border-secondary-500", + "group-has-[textarea:read-only]/bit-form-field:group-hover/bit-form-field:tw-border-secondary-500", "group-focus-within/bit-form-field:tw-outline-none", shouldFocusBorderAppear ? "group-focus-within/bit-form-field:tw-border-2" : "", shouldFocusBorderAppear ? "group-focus-within/bit-form-field:tw-border-primary-500" : "",