minor #5809 Improve the design of global form errors in dark mode (ja…

…viereguiluz) This PR was merged into the 4.x branch. Discussion ---------- Improve the design of global form errors in dark mode ### Before <img width="955" alt="before" src="https://github.com/EasyCorp/EasyAdminBundle/assets/73419/9c2cd523-368f-4009-99de-af30eb5f232d"> ### After <img width="1018" alt="after" src="https://github.com/EasyCorp/EasyAdminBundle/assets/73419/e16393e6-8bc7-4be4-a551-826ef2873136"> Commits ------- 1420832 Improve the design of global form errors in dark mode
EasyCorp · Jun 29, 2023 · 8f25a8a · 8f25a8a
2 parents 5a60e3b + 1420832
commit 8f25a8a
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 8 deletions.
diff --git a/assets/css/easyadmin-theme/forms.scss b/assets/css/easyadmin-theme/forms.scss
@@ -503,9 +503,10 @@ fieldset .legend-help {
 }
 
 .global-invalid-feedback {
-    background: var(--red-100);
+    background: var(--form-global-error-bg);
+    border: var(--form-global-error-border);
     border-radius: var(--border-radius);
-    color: var(--color-danger);
+    color: var(--form-global-error-color);
     font-size:  14px;
     margin:  5px 0;
     padding: 6px 12px;

diff --git a/assets/css/easyadmin-theme/variables-theme.scss b/assets/css/easyadmin-theme/variables-theme.scss
@@ -172,6 +172,9 @@
     --form-type-autocomplete-multi-item-bg: var(--gray-100);
     --form-type-autocomplete-multi-item-border-color: var(--white);
     --form-type-autocomplete-multi-item-remove-button-hover-bg: var(--gray-200);
+    --form-global-error-bg: var(--red-100);
+    --form-global-error-color: var(--color-danger);
+    --form-global-error-border: 1px solid transparent;
     --form-help-color: var(--gray-600);
     --form-help-error-color: var(--gray-800);
     --form-help-active-color: var(--gray-800);
@@ -484,6 +487,9 @@
     --form-type-autocomplete-multi-item-bg: var(--true-gray-700);
     --form-type-autocomplete-multi-item-border-color: var(--true-gray-500);
     --form-type-autocomplete-multi-item-remove-button-hover-bg: var(--true-gray-800);
+    --form-global-error-bg: transparent;
+    --form-global-error-color: var(--red-400);
+    --form-global-error-border: 1px solid var(--red-400);
     --form-help-color: var(--true-gray-500);
     --form-help-error-color: var(--true-gray-200);
     --form-help-active-color: var(--true-gray-300);

diff --git a/src/Resources/public/app.404e52fc.css → src/Resources/public/app.c05014e9.css b/src/Resources/public/app.404e52fc.css → src/Resources/public/app.c05014e9.css
diff --git a/src/Resources/public/app.404e52fc.rtl.css → src/Resources/public/app.c05014e9.rtl.css b/src/Resources/public/app.404e52fc.rtl.css → src/Resources/public/app.c05014e9.rtl.css
diff --git a/src/Resources/public/entrypoints.json b/src/Resources/public/entrypoints.json
@@ -2,8 +2,8 @@
   "entrypoints": {
     "app": {
       "css": [
-        "/app.404e52fc.css",
-        "/app.404e52fc.rtl.css"
+        "/app.c05014e9.css",
+        "/app.c05014e9.rtl.css"
       ],
       "js": [
         "/app.914bb6ba.js"

diff --git a/src/Resources/public/manifest.json b/src/Resources/public/manifest.json
@@ -1,6 +1,6 @@
 {
-  "app.css": "app.404e52fc.css",
-  "app.rtl.css": "app.404e52fc.rtl.css",
+  "app.css": "app.c05014e9.css",
+  "app.rtl.css": "app.c05014e9.rtl.css",
   "app.js": "app.914bb6ba.js",
   "form.js": "form.fc39362b.js",
   "page-layout.js": "page-layout.3347892e.js",