From 6a5a4d79ce60124fba2dc00d86b9e1a9b5f21c39 Mon Sep 17 00:00:00 2001
From: Emma Sauerborn <70536670+esauerbo@users.noreply.github.com>
Date: Mon, 18 Sep 2023 14:59:20 -0400
Subject: [PATCH] fix(ui): remove error border from disabled and quiet
 primitive fields  (#4457)

* fix(ui): removing red border from disabled text and select field with error

* Create five-ghosts-hug.md
---
 .changeset/five-ghosts-hug.md                 |  5 +++++
 .../theme/css/component/_fieldControl.scss    | 20 +++++++++----------
 2 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/five-ghosts-hug.md

diff --git a/.changeset/five-ghosts-hug.md b/.changeset/five-ghosts-hug.md
new file mode 100644
index 00000000000..698966d7f59
--- /dev/null
+++ b/.changeset/five-ghosts-hug.md
@@ -0,0 +1,5 @@
+---
+"@aws-amplify/ui": patch
+---
+
+fix(ui): remove error border from disabled and quiet primitive fields 
diff --git a/packages/ui/src/theme/css/component/_fieldControl.scss b/packages/ui/src/theme/css/component/_fieldControl.scss
index 577c08bee28..50393f577b9 100644
--- a/packages/ui/src/theme/css/component/_fieldControl.scss
+++ b/packages/ui/src/theme/css/component/_fieldControl.scss
@@ -71,16 +71,6 @@
     }
   }
 
-  // for disabled styles
-  &[disabled] {
-    color: var(--amplify-components-fieldcontrol-disabled-color);
-    cursor: var(--amplify-components-fieldcontrol-disabled-cursor);
-    border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
-    background-color: var(
-      --amplify-components-fieldcontrol-disabled-background-color
-    );
-  }
-
   // variation styles
   &--quiet {
     border-block-start: var(
@@ -110,4 +100,14 @@
       }
     }
   }
+
+  // for disabled styles
+  &[disabled] {
+    color: var(--amplify-components-fieldcontrol-disabled-color);
+    cursor: var(--amplify-components-fieldcontrol-disabled-cursor);
+    border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
+    background-color: var(
+      --amplify-components-fieldcontrol-disabled-background-color
+    );
+  }
 }