stepped-process dark mode (with no more dark-variant)

Orange-OpenSource · Sep 27, 2023 · a7695cf · a7695cf
1 parent faa9865
commit a7695cf
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 0 deletions.
diff --git a/scss/_stepped-process.scss b/scss/_stepped-process.scss
@@ -143,3 +143,15 @@
     flex: $stepped-process-max-items - 1;
   }
 }
+
+@if $enable-dark-mode {
+  @include color-mode(dark) {
+    .stepped-process {
+      --#{$prefix}stepped-process-item-bg: #{$step-item-dark-bg};
+      --#{$prefix}stepped-process-item-next-bg: #{$step-item-dark-next-bg};
+      --#{$prefix}stepped-process-item-drop-shadow: #{$step-item-dark-drop-shadow};
+      --#{$prefix}stepped-process-link-color: #{$step-link-dark-color};
+      --#{$prefix}stepped-process-link-next-color: #{$step-link-dark-next-color};
+    }
+  }
+}
diff --git a/scss/_variables-dark.scss b/scss/_variables-dark.scss
@@ -118,3 +118,13 @@ $form-invalid-border-color-dark:    $red-300 !default;
 // Boosted mod: no $accordion-button-icon-dark
 // Boosted mod: no $accordion-button-active-icon-dark
 // scss-docs-end sass-dark-mode-vars
+
+//
+// Stepped process
+//
+
+$step-item-dark-bg:           $white !default;
+$step-item-dark-next-bg:      $gray-700 !default;
+$step-item-dark-drop-shadow:  drop-shadow($step-item-shadow-size 0 0 $body-bg-dark) #{"/* rtl:"} drop-shadow(calc(-1 * #{$step-item-shadow-size}) 0 0 $body-bg-dark) #{"*/"} !default; // stylelint-disable-line function-disallowed-list
+$step-link-dark-color:        $black !default;
+$step-link-dark-next-color:   $body-color-dark !default;