Merge pull request joomla#7 from coolcat-creations/macjoom-dark-ccc

Add System Messages Panel
LadySolveig · Nov 19, 2023 · 928757d · 928757d
2 parents 4834f20 + 60999c5
commit 928757d
Show file tree

Hide file tree

Showing 9 changed files with 143 additions and 123 deletions.
diff --git a/administrator/templates/atum/templateDetails.xml b/administrator/templates/atum/templateDetails.xml
@@ -91,7 +91,7 @@
 					name="link-color-dark"
 					type="color"
 					label="TPL_ATUM_COLORS_SETTINGS_LINK_COLOR_DARK_LABEL"
-					default="#7fa5d4"
+					default="#249ec8"
 					filter="color"
 				/>
 				<field

diff --git a/build/media_source/templates/administrator/atum/scss/_variables-dark.scss b/build/media_source/templates/administrator/atum/scss/_variables-dark.scss
@@ -60,7 +60,7 @@ $atum-colors-dark: (
   success:                           $success-dark,
   successhvr:                        darken($success-dark, 15%),
 
-  danger-text:                       #dd4b47,
+  danger-text:                       #E0615C,
   danger:                            $danger-dark,
   dangerhvr:                         darken($danger-dark, 15%),
 
@@ -298,15 +298,17 @@ $atum-colors-dark: (
   dropdown-item-bg-hvr:                darken($btn-primary-dark, 10%),
 
   // Alerts
+  states-link-color:              #fff,
+
   state-success-text:             var(--text-normal),
   state-success-text-hvr:         var(--text-normal),
   state-success-bg:               $success-dark,
   state-success-bg-hvr:           darken($success-dark, 15%),
-  state-success-border:           1px solid var(--successhvr),
-  state-success-btn-border:       1px solid $success-dark,
+  state-success-border:           var(--state-success-bg),
+  state-success-btn-border:       var(--state-success-bg),
   state-success-icon:             var(--text-normal),
   state-success-icon-hvr:         var(--text-normal),
-  state-success-heading-bg:       var(--successhvr),
+  state-success-heading-bg:       $success-dark,
 
   state-info-text:                var(--text-normal),
   state-info-text-hvr:            var(--text-normal),
@@ -320,15 +322,15 @@ $atum-colors-dark: (
   state-warning-text-hvr:         var(--text-normal),
   state-warning-bg:               $warning-dark,
   state-warning-bg-hvr:           darken($warning-dark, 15%),
-  state-warning-border:           1px solid var(--warning),
+  state-warning-border:           var(--warning),
   state-warning-icon:             var(--text-normal),
   state-warning-heading-bg:       var(--warning),
 
   state-danger-text:              var(--text-normal),
   state-danger-text-hvr:          var(--text-normal),
   state-danger-bg:                $danger-dark,
   state-danger-bg-hvr:            darken($danger-dark, 15%),
-  state-danger-border:            1px solid var(--dangerhvr),
+  state-danger-border:            var(--dangerhvr),
   state-danger-icon:              var(--text-normal),
   state-danger-heading-bg:        var(--dangerhvr),
 

diff --git a/build/media_source/templates/administrator/atum/scss/_variables.scss b/build/media_source/templates/administrator/atum/scss/_variables.scss
@@ -81,6 +81,11 @@ $form-select-indicator-active-rtl: url("../../../images/select-bg-rtl.svg");
 $form-select-bg:                   var(--template-bg-light);
 $form-select-bg-size:              calc(max(100%, 116rem));
 $form-select-bg-size-sm:           75rem;
+
+// links
+$template-link-color:             var(--template-link-color);
+$template-link-hover-color:       var(--template-link-hover-color);
+
 //$form-select-background:           $form-select-bg $form-select-indicator no-repeat right center / $form-select-bg-size; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
 //$form-select-background-rtl:       $form-select-bg $form-select-indicator-rtl no-repeat left center / $form-select-bg-size; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
 
@@ -354,6 +359,8 @@ $atum-colors: (
   dropdown-item-bg-hvr:             var(--template-bg-dark),
 
   // Alerts
+  states-link-color:                var(--template-link-color),
+
   state-success-text:               $success,
   state-success-text-hvr:           lighten($success, 58%),
   state-success-bg:                 lighten($success, 58%),
@@ -914,9 +921,6 @@ $header-item-content-jversion-color: var(--header-item-content-jversion-color);
 $header-item-content-jversion-bg:    var(--header-item-content-jversion-bg);
 $header-logo-bg:                     var(--header-logo-bg);
 
-// links
-$template-link-color:             var(--template-link-color);
-$template-link-hover-color:       var(--template-link-hover-color);
 
 // Gutter
 $grid-gutter-width:                2rem;

diff --git a/build/media_source/templates/administrator/atum/scss/blocks/_alerts.scss b/build/media_source/templates/administrator/atum/scss/blocks/_alerts.scss
@@ -9,8 +9,9 @@
 }
 
 .alert-link {
-  font-weight: 700;
-  color: var(--alert-link-text-color);
+  font-weight: normal;
+  text-decoration: underline;
+  color: var(--states-link-color);
 }
 
 .alert {

diff --git a/build/media_source/templates/administrator/atum/scss/blocks/_form.scss b/build/media_source/templates/administrator/atum/scss/blocks/_form.scss
@@ -3,7 +3,7 @@
 .form-control {
   max-width: $input-max-width;
   background: $form-control-bg;
-  border: $form-control-border !important;
+  border: $form-control-border;
 
   &:disabled,
   &[readonly] {
@@ -20,6 +20,13 @@
     background-color: $file-selector-btn-bg-hvr;
   }
 
+  &.invalid {
+    border-color: var(--danger);
+  }
+
+  &.valid {
+    border-color: var(--success);
+  }
 
   &::placeholder {
     font-style: italic;
@@ -105,15 +112,21 @@ td .form-control {
 
 // Validation
 .invalid {
-  color: var(--danger-text);
   border-color: var(--danger);
 }
 
+label.invalid {
+  color: var(--danger-text);
+}
+
 .valid {
-  color: var(--success-text);
   border-color: var(--success);
 }
 
+label.valid {
+  color: var(--success-text);
+}
+
 .form-control-feedback {
   display: block;
 }

diff --git a/build/media_source/templates/administrator/atum/scss/vendor/bootstrap/_card.scss b/build/media_source/templates/administrator/atum/scss/vendor/bootstrap/_card.scss
@@ -22,15 +22,16 @@
 .content {
   .card {
     box-shadow: var(--atum-box-shadow);
+    background: var(--card-body-bg);
   }
 
   .card-header {
     display: flex;
     align-items: center;
     padding: 1rem 1rem .75rem;
     font-weight: $font-weight-bold;
-    color: $card-header-color;
-    background-color: $card-header-bg;
+    color: var(--card-header-color);
+    background-color: var(--card-bg);
 
     a {
       font-weight: normal;

diff --git a/build/media_source/templates/administrator/atum/scss/vendor/bootstrap/_form.scss b/build/media_source/templates/administrator/atum/scss/vendor/bootstrap/_form.scss
@@ -35,12 +35,10 @@ legend {
 
 // Validation
 .invalid {
-  color: var(--danger-text);
   border-color: var(--danger);
 }
 
 .valid {
-  color: var(--success-text);
   border-color: var(--success);
 }
 

diff --git a/..._source/templates/administrator/atum/scss/vendor/joomla-custom-elements/joomla-alert.scss b/..._source/templates/administrator/atum/scss/vendor/joomla-custom-elements/joomla-alert.scss
@@ -107,8 +107,9 @@
   }
 
   .alert-link {
-    color: var(--template-link-color);
+    font-weight: normal;
     text-decoration: underline;
+    color: var(--states-link-color);
   }
 
   .joomla-alert--close,