fix: improve CustomEmailTextField styling and focus behavior (#26024)

2025-12-19 13:08:28 +00:00
parent 5032d2716d
commit 2cab5475ce
1 changed files with 5 additions and 3 deletions
@@ -44,12 +44,14 @@ const CustomEmailTextField = ({
  return (
    <>
      <div
-        className={`border-default mt-2 flex w-full items-center rounded-[10px] border ${
-          inputFocus ? "ring-brand-default border-neutral-300 ring-2" : ""
+        className={`mt-2 flex w-full items-center rounded-[10px] border transition-all ${
+          inputFocus
+            ? "border-emphasis shadow-outline-gray-focused"
+            : "border-default hover:border-emphasis shadow-outline-gray-rested"
        }`}>
        <Input
          {...formMethods.register(formMethodFieldName)}
-          className="focus:ring-none! focus:shadow-none! flex-1 border-none bg-transparent px-3 py-1.5 text-sm outline-none"
+          className="ring-0 focus:ring-0 focus:shadow-none! flex-1 border-none bg-transparent px-3 py-1.5 text-sm outline-none"
          data-testid={dataTestId}
          onFocus={() => setInputFocus(true)}
          onBlur={() => setInputFocus(false)}