From 2895883e51239966df6f1f5e75fa717f65fa353d Mon Sep 17 00:00:00 2001
From: Zack Spear <hi@zackspear.com>
Date: Mon, 31 Mar 2025 18:42:40 -0700
Subject: [PATCH] style: update input and textarea border colors across themes
 and adjust textarea padding in default-base.css

---
 emhttp/plugins/dynamix/styles/default-base.css | 5 ++++-
 emhttp/plugins/dynamix/styles/themes/azure.css | 5 +++--
 emhttp/plugins/dynamix/styles/themes/black.css | 3 ++-
 emhttp/plugins/dynamix/styles/themes/gray.css  | 3 ++-
 emhttp/plugins/dynamix/styles/themes/white.css | 5 +++--
 5 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/emhttp/plugins/dynamix/styles/default-base.css b/emhttp/plugins/dynamix/styles/default-base.css
index 94e3d28b5..659fbb9de 100644
--- a/emhttp/plugins/dynamix/styles/default-base.css
+++ b/emhttp/plugins/dynamix/styles/default-base.css
@@ -198,7 +198,7 @@ input:focus[type="email"],
 input:focus[type="file"],
 textarea:focus,
 .sweet-alert button:focus {
-    background-color: var(--mild-background-color);
+    background-color: var(--focus-input-bg-color);
     outline: 0;
 }
 input:hover[type="button"],
@@ -353,6 +353,9 @@ input.trim {
 }
 textarea {
     resize: none;
+    padding: 6px;
+    border: 1px solid var(--textarea-border-color);
+    border-bottom: 1px solid var(--input-border-color);
 }
 #header {
     position: absolute;
diff --git a/emhttp/plugins/dynamix/styles/themes/azure.css b/emhttp/plugins/dynamix/styles/themes/azure.css
index 466085ebd..0bb2d11e2 100644
--- a/emhttp/plugins/dynamix/styles/themes/azure.css
+++ b/emhttp/plugins/dynamix/styles/themes/azure.css
@@ -44,8 +44,9 @@
     --border-color: var(--theme-azure--cyan-400);
     --alt-border-color: var(--theme-azure--cyan-700);
     --disabled-border-color: var(--gray-500);
-    --input-border-color: var(--gray-200);
+    --input-border-color: var(--border-color);
     --disabled-input-border-color: var(--gray-500);
+    --textarea-border-color: var(--input-border-color);
     --inverse-border-color: var(--gray-600); /* Originally #42453e */
     --table-border-color: var(--theme-azure--cyan-400);
     --table-alt-border-color: var(--theme-azure--gray-100);
@@ -82,8 +83,8 @@
     --hover-button-text-color: var(--theme-azure--gray-800);
     --hover-button-background: var(--mild-background-color);
 
-    --input-border-color: var(--blue-800); /* Condensed from: #0072c6 */
     --input-bg-color: var(--mild-background-color);
+    --focus-input-bg-color: var(--theme-azure--gray-150);
     /* /End vars used in default-base */
 
     /* Set vars for default-dynamix */
diff --git a/emhttp/plugins/dynamix/styles/themes/black.css b/emhttp/plugins/dynamix/styles/themes/black.css
index d47d8339d..c54e07437 100644
--- a/emhttp/plugins/dynamix/styles/themes/black.css
+++ b/emhttp/plugins/dynamix/styles/themes/black.css
@@ -27,6 +27,7 @@
     --disabled-border-color: var(--gray-500); 
     --input-border-color: var(--gray-200); 
     --disabled-input-border-color: var(--gray-500); 
+    --textarea-border-color: var(--gray-400);
     --inverse-border-color: var(--white-opacity-25); 
     --table-border-color: var(--gray-700); 
     --table-background-color: var(--gray-800);
@@ -67,8 +68,8 @@
     --hover-button-text-color: var(--white);
     --hover-button-background: linear-gradient(90deg,var(--brand-red) 0,var(--brand-orange));
 
-    --input-border-color: var(--gray-200);
     --input-bg-color: transparent;
+    --focus-input-bg-color: var(--mild-background-color);
     /* /End vars used in default-base */
 
     /* dynamix CSS var values set in base-dynamix.css */
diff --git a/emhttp/plugins/dynamix/styles/themes/gray.css b/emhttp/plugins/dynamix/styles/themes/gray.css
index ba7e9376f..99d12f3d1 100644
--- a/emhttp/plugins/dynamix/styles/themes/gray.css
+++ b/emhttp/plugins/dynamix/styles/themes/gray.css
@@ -38,8 +38,9 @@
     --border-color: var(--theme-gray--cyan-300);
     --alt-border-color: var(--theme-gray--cyan-600);
     --disabled-border-color: var(--gray-500); 
-    --input-border-color: var(--theme-gray--cyan-300); 
+    --input-border-color: var(--border-color); 
     --disabled-input-border-color: var(--gray-500); 
+    --textarea-border-color: var(--border-color);
     --inverse-border-color: var(--theme-gray--cyan-500);
     --table-border-color: var(--gray-700);
     --table-alt-border-color: var(--theme-gray--black-alt);
diff --git a/emhttp/plugins/dynamix/styles/themes/white.css b/emhttp/plugins/dynamix/styles/themes/white.css
index 8b2bac74e..4e15aba5a 100644
--- a/emhttp/plugins/dynamix/styles/themes/white.css
+++ b/emhttp/plugins/dynamix/styles/themes/white.css
@@ -25,8 +25,9 @@
 
     --border-color: var(--gray-200);
     --disabled-border-color: var(--gray-500);
-    --input-border-color: var(--gray-900);
+    --input-border-color: var(--black);
     --disabled-input-border-color: var(--gray-400);
+    --textarea-border-color: var(--gray-400);
     --inverse-border-color: var(--gray-000);
     --table-border-color: var(--gray-200);
     --table-background-color: var(--gray-150);
@@ -68,8 +69,8 @@
     --hover-button-text-color: var(--white);
     --hover-button-background: linear-gradient(90deg,var(--brand-red) 0,var(--brand-orange));
 
-    --input-border-color: var(--black);
     --input-bg-color: transparent;
+    --focus-input-bg-color: var(--gray-150);
     /* /End vars used in default-base */
 
     /* Set vars for default-dynamix */