Fix validation color in the login layout (#14400)

OrchardCMS · Sep 27, 2023 · 57f6644 · 57f6644
1 parent f2c2d7b
commit 57f6644
Show file tree

Hide file tree

Showing 12 changed files with 76 additions and 17 deletions.
diff --git a/src/OrchardCore.Themes/TheAdmin/Assets.json b/src/OrchardCore.Themes/TheAdmin/Assets.json
@@ -20,6 +20,17 @@
     ],
     "output": "wwwroot/js/TheAdmin.js"
   },
+  {
+    "generateSourceMaps": false,
+    "generateRTL": false,
+    "inputs": [
+      "Assets/scss/login.scss"
+    ],
+    "watch": [
+      "Assets/scss/componenets/_validations.scss"
+    ],
+    "output": "wwwroot/css/login.css"
+  },
   {
     "generateSourceMaps": false,
     "inputs": [

diff --git a/src/OrchardCore.Themes/TheAdmin/Assets/js/toggleTheme.js b/src/OrchardCore.Themes/TheAdmin/Assets/js/toggleTheme.js
@@ -50,7 +50,6 @@
                     setStoredTheme(theme);
                     setTheme(theme);
                     showActiveTheme(theme, true);
-                    persistAdminPreferences(theme);
                 })
             })
     });

diff --git a/src/OrchardCore.Themes/TheAdmin/Assets/js/userPreferencesPersistor.js b/src/OrchardCore.Themes/TheAdmin/Assets/js/userPreferencesPersistor.js
@@ -1,7 +1,7 @@
 // Each time the sidebar status is modified, that is persisted to localStorage.
 // When the page is loaded again, userPreferencesLoader.js will read that info to 
 // restore the sidebar to the previous state.
-function persistAdminPreferences(theme) {
+function persistAdminPreferences() {
     setTimeout(function () {
         var adminPreferences = {};
         adminPreferences.leftSidebarCompact = document.body.classList.contains('left-sidebar-compact') ? true : false;

diff --git a/src/OrchardCore.Themes/TheAdmin/Assets/scss/components/_navbar.scss b/src/OrchardCore.Themes/TheAdmin/Assets/scss/components/_navbar.scss
@@ -57,6 +57,7 @@
 .ta-navbar-brand {
     white-space: nowrap;
     transition: width 0.2s ease-in-out;
+    color: var(--bs-navbar-brand-color);
 
     span {
         font-size: 14px;

diff --git a/src/OrchardCore.Themes/TheAdmin/Assets/scss/login.scss b/src/OrchardCore.Themes/TheAdmin/Assets/scss/login.scss
@@ -0,0 +1,11 @@
+body, html {
+    height: 100%;
+}
+
+.auth-wrapper {
+    width: 100%;
+    max-width: 800px;
+    margin: auto;
+}
+
+@import 'components/validations';
diff --git a/src/OrchardCore.Themes/TheAdmin/Views/Layout-Login.cshtml b/src/OrchardCore.Themes/TheAdmin/Views/Layout-Login.cshtml
@@ -17,22 +17,12 @@
 
     <!-- Bootstrap CSS -->
     <style asp-name="bootstrap" version="5"></style>
+    <style asp-name="TheAdminLogin" depends-on="bootstrap" asp-src="~/TheAdmin/css/login.min.css" debug-src="~/TheAdmin/css/login.css" at="Foot"></style>
 
     <script asp-name="font-awesome" at="Foot" version="6"></script>
 
     <resources type="Header" />
     @await RenderSectionAsync("HeadMeta", required: false)
-    <style>
-        body, html {
-            height: 100%;
-        }
-
-        .auth-wrapper {
-            width: 100%;
-            max-width: 800px;
-            margin: auto;
-        }
-    </style>
 </head>
 <body>
     <div class="d-flex align-items-center justify-content-center h-100">

diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/css/TheAdmin.css b/src/OrchardCore.Themes/TheAdmin/wwwroot/css/TheAdmin.css
@@ -8111,6 +8111,7 @@ div.editor-widget.find-widget .button.codicon:active {
 .ta-navbar-brand {
   white-space: nowrap;
   transition: width 0.2s ease-in-out;
+  color: var(--bs-navbar-brand-color);
 }
 .ta-navbar-brand span {
   font-size: 14px;

diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/css/TheAdmin.min.css b/src/OrchardCore.Themes/TheAdmin/wwwroot/css/TheAdmin.min.css
diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/css/login.css b/src/OrchardCore.Themes/TheAdmin/wwwroot/css/login.css
@@ -0,0 +1,46 @@
+body, html {
+  height: 100%;
+}
+
+.auth-wrapper {
+  width: 100%;
+  max-width: 800px;
+  margin: auto;
+}
+
+span.field-validation-error {
+  width: 100%;
+}
+
+.validation-summary-errors {
+  --bs-alert-color: var(--bs-danger-text-emphasis);
+  --bs-alert-bg: var(--bs-danger-bg-subtle);
+  --bs-alert-border-color: var(--bs-danger-border-subtle);
+  --bs-alert-link-color: var(--bs-danger-text-emphasis);
+  --bs-alert-padding-x: 1rem;
+  --bs-alert-padding-y: 1rem;
+  --bs-alert-margin-bottom: 1rem;
+  --bs-alert-border-color: transparent;
+  --bs-alert-border: var(--bs-border-width) solid var(--bs-alert-border-color);
+  --bs-alert-border-radius: var(--bs-border-radius);
+  --bs-alert-link-color: inherit;
+  position: relative;
+  padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
+  margin-bottom: var(--bs-alert-margin-bottom);
+  color: var(--bs-alert-color);
+  background-color: var(--bs-alert-bg);
+  border: var(--bs-alert-border);
+  border-radius: var(--bs-alert-border-radius);
+}
+
+.validation-summary-errors ul {
+  margin-bottom: 0 !important;
+}
+
+.field-validation-error {
+  color: var(--bs-text-danger) !important;
+}
+
+.field-validation-valid {
+  display: none;
+}
diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/css/login.min.css b/src/OrchardCore.Themes/TheAdmin/wwwroot/css/login.min.css
diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/js/TheAdmin.js b/src/OrchardCore.Themes/TheAdmin/wwwroot/js/TheAdmin.js
@@ -1630,15 +1630,14 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
         setStoredTheme(theme);
         setTheme(theme);
         showActiveTheme(theme, true);
-        persistAdminPreferences(theme);
       });
     });
   });
 })();
 // Each time the sidebar status is modified, that is persisted to localStorage.
 // When the page is loaded again, userPreferencesLoader.js will read that info to 
 // restore the sidebar to the previous state.
-function persistAdminPreferences(theme) {
+function persistAdminPreferences() {
   setTimeout(function () {
     var adminPreferences = {};
     adminPreferences.leftSidebarCompact = document.body.classList.contains('left-sidebar-compact') ? true : false;

diff --git a/src/OrchardCore.Themes/TheAdmin/wwwroot/js/TheAdmin.min.js b/src/OrchardCore.Themes/TheAdmin/wwwroot/js/TheAdmin.min.js