Apply ffoodd suggestions regarding spacings for between sm and lg

Orange-OpenSource · Feb 26, 2021 · f059e6d · f059e6d
1 parent 5a9c834
commit f059e6d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 11 deletions.
diff --git a/scss/_stepped-process.scss b/scss/_stepped-process.scss
@@ -68,7 +68,6 @@
 @include media-breakpoint-up(sm) {
   .stepped-process-item {
     position: relative;
-    max-width: $step-item-max-width;
     padding: $step-item-padding 0;
     margin: 0;
     filter: $step-item-drop-shadow;
@@ -77,10 +76,6 @@
       padding-left: $step-item-padding-end;
     }
 
-    &:last-child {
-      padding-right: $step-item-padding-end;
-    }
-
     &:not(:last-child)::after {
       position: absolute;
       top: 0;
@@ -92,10 +87,6 @@
       background-color: inherit;
       clip-path: $step-item-arrow-shape;
     }
-
-    &.active {
-      max-width: none;
-    }
   }
 
   @for $i from 1 through $stepped-process-max-items {
@@ -115,7 +106,6 @@
 }
 
 @include media-breakpoint-up(xl) {
-  .stepped-process-item,
   .stepped-process-link {
     max-width: none;
   }
@@ -124,3 +114,9 @@
     content: $step-link-marker-lg;
   }
 }
+
+@include media-breakpoint-between("sm", "lg") {
+  .stepped-process-item.active {
+    flex: $stepped-process-max-items - 1;
+  }
+}
diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -1649,7 +1649,6 @@ $back-to-top-icon-height:        subtract(1rem, 1px) !default;
 $stepped-process-max-items: 5 !default;
 $stepped-process-counter:   step !default; // Used as a counter name
 
-$step-item-max-width:    3.75rem !default;
 $step-item-margin-end:   $border-width !default;
 $step-item-padding:      $spacer / 2 !default;
 $step-item-bg:           $black !default;