fix(slider): Fix bug where value indicator container took space and c…

…ould be hovered over / clicked when hidden. PiperOrigin-RevId: 345699434
material-components · Dec 4, 2020 · 832668d · 832668d
1 parent 1c156d6
commit 832668d
Showing 1 changed file with 14 additions and 5 deletions.
diff --git a/packages/mdc-slider/_slider.scss b/packages/mdc-slider/_slider.scss
@@ -319,6 +319,7 @@ $_track-inactive-height: 4px;
       left: 50%;
       position: absolute;
       transform: translateX(-50%);
+      visibility: hidden;
     }
   }
 
@@ -355,13 +356,21 @@ $_track-inactive-height: 4px;
     }
   }
 
-  .mdc-slider__thumb--with-indicator .mdc-slider__value-indicator {
-    @include feature-targeting.targets($feat-animation) {
-      transition: animation.enter(transform, 100ms);
+  .mdc-slider__thumb--with-indicator {
+    .mdc-slider__value-indicator-container {
+      @include feature-targeting.targets($feat-structure) {
+        visibility: visible;
+      }
     }
 
-    @include feature-targeting.targets($feat-structure) {
-      transform: scale(1);
+    .mdc-slider__value-indicator {
+      @include feature-targeting.targets($feat-animation) {
+        transition: animation.enter(transform, 100ms);
+      }
+
+      @include feature-targeting.targets($feat-structure) {
+        transform: scale(1);
+      }
     }
   }