fix(slider): Remove margin block and align labels for vertical

AmadeusITGroup · Nov 8, 2023 · c9ba24b · c9ba24b
1 parent baa93b6
commit c9ba24b
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 7 deletions.
diff --git a/style-bootstrap/scss/_slider.scss b/style-bootstrap/scss/_slider.scss
@@ -9,8 +9,6 @@ $prefix: au-;
 	--#{$prefix}slider-margin-block-end: #{$slider-margin-block-end};
 	--#{$prefix}slider-vertical-margin-inline-start: #{$slider-vertical-margin-inline-start};
 	--#{$prefix}slider-vertical-margin-inline-end: #{$slider-vertical-margin-inline-end};
-	--#{$prefix}slider-vertical-margin-block: #{$slider-vertical-margin-block};
-
 	--#{$prefix}slider-translate-vertical: #{$slider-translate-vertical};
 	--#{$prefix}slider-translate-horizontal: #{$slider-translate-horizontal};
 
@@ -32,7 +30,8 @@ $prefix: au-;
 	--#{$prefix}slider-label-now-transform: #{$slider-label-now-transform};
 
 	--#{$prefix}slider-label-vertical-margin-inline-start: #{$slider-label-vertical-margin-inline-start};
-	--#{$prefix}slider-label-vertical-transform: #{$slider-label-vertical-transform};
+	--#{$prefix}slider-label-vertical-min-transform: #{$slider-label-vertical-min-transform};
+	--#{$prefix}slider-label-vertical-max-transform: #{$slider-label-vertical-max-transform};
 	--#{$prefix}slider-label-vertical-white-space: #{$slider-label-vertical-white-space};
 	--#{$prefix}slider-label-vertical-min-top: #{$slider-label-vertical-min-top};
 	--#{$prefix}slider-label-vertical-max-top: #{$slider-label-vertical-max-top};
@@ -66,7 +65,6 @@ $prefix: au-;
 		width: var(--#{$prefix}slider-secondary-size);
 		margin-inline-start: var(--#{$prefix}slider-vertical-margin-inline-start);
 		margin-inline-end: var(--#{$prefix}slider-vertical-margin-inline-end);
-		margin-block: var(--#{$prefix}slider-vertical-margin-block);
 		.au-slider-handle-vertical {
 			transform: var(--#{$prefix}slider-translate-vertical);
 		}
@@ -116,15 +114,16 @@ $prefix: au-;
 	.au-slider-label-vertical {
 		position: absolute;
 		margin-inline-start: var(--#{$prefix}slider-label-vertical-margin-inline-start);
-		transform: var(--#{$prefix}slider-label-vertical-transform);
 		white-space: var(--#{$prefix}slider-label-vertical-white-space);
 
 		&.au-slider-label-vertical-min {
 			top: var(--#{$prefix}slider-label-vertical-min-top);
+			transform: var(--#{$prefix}slider-label-vertical-min-transform);
 		}
 
 		&.au-slider-label-vertical-max {
 			top: var(--#{$prefix}slider-label-vertical-max-top);
+			transform: var(--#{$prefix}slider-label-vertical-max-transform);
 		}
 
 		&.au-slider-label-vertical-now {

diff --git a/style-bootstrap/scss/_variables.scss b/style-bootstrap/scss/_variables.scss
@@ -8,7 +8,6 @@ $slider-margin-block-start: 2rem !default;
 $slider-margin-block-end: 1rem !default;
 $slider-vertical-margin-inline-start: 1rem !default;
 $slider-vertical-margin-inline-end: 3rem !default;
-$slider-vertical-margin-block: 3rem !default;
 $slider-translate-vertical: translate(-40%, -50%) !default;
 $slider-translate-horizontal: translate(-50%, -40%) !default;
 $focus-ring-opacity: 0.25 !default;
@@ -28,7 +27,8 @@ $slider-label-min-left: 0;
 $slider-label-max-right: 0;
 $slider-label-now-transform: translateX(-50%) !default;
 $slider-label-vertical-margin-inline-start: 1rem !default;
-$slider-label-vertical-transform: translateY(-40%) !default;
+$slider-label-vertical-min-transform: translateY(-75%) !default;
+$slider-label-vertical-max-transform: translateY(-25%) !default;
 $slider-label-vertical-white-space: nowrap !default;
 $slider-label-vertical-min-top: 100% !default;
 $slider-label-vertical-max-top: 0% !default;