@awell-health/ui-library 0.1.35 → 0.1.38

package/dist/index.css

@@ -4232,6 +4232,7 @@ html {
   position: relative;
   transition: all 0.25s ease-in;
   margin-top: 0;
+  margin-top: var(--awell-spacing-8);
   /* min / max labels at the edges */
 }
 @media (min-width: 640px) {
@@ -4239,16 +4240,28 @@ html {
     --awell-thick-width: 2px;
   }
 }
-.awell__rangeInput_awell_range_input_wrapper.awell__rangeInput_with_tooltip {
-  margin-top: var(--awell-spacing-8);
+.awell__rangeInput_awell_range_input_wrapper .awell__rangeInput_tooltip_touched {
+  display: block;
+  position: absolute;
+  text-align: center;
+  background-color: var(--awell-secondary-color);
+  color: var(--awell-secondary-text-color);
+  padding: var(--awell-spacing-1) var(--awell-spacing-2);
+  font-size: var(--awell-font-size-xs);
+  border-radius: var(--awell-spacing-2);
+  top: -28px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+@media (min-width: 640px) {
+  .awell__rangeInput_awell_range_input_wrapper .awell__rangeInput_tooltip_touched {
+    top: -32px;
+    font-size: var(--awell-font-size-base);
+  }
 }
 .awell__rangeInput_awell_range_input_wrapper.awell__rangeInput_with_marks {
   --awell-thick-width: 1px;
-  --awell-ticks: linear-gradient(
-      to right,
-      var(--awell-thick-color) var(--awell-thick-width),
-      transparent 1px
-    )
+  --awell-ticks: linear-gradient(to right, var(--awell-thick-color) var(--awell-thick-width), transparent 1px)
     repeat-x;
   background: silver;
   background: var(--awell-ticks);
@@ -4322,6 +4335,7 @@ html {
   margin: 1.3px 0;
   background-color: transparent;
   appearance: none;
+  position: relative;
   /* TODO: Use one of the selectors from https://stackoverflow.com/a/20541859/7077589 and figure out
   how to remove the virtical space around the range input in IE */
 }
@@ -4329,6 +4343,7 @@ html {
   outline: none;
 }
 .awell__rangeInput_awell_range_input_wrapper .awell__rangeInput_awell_range_input::-webkit-slider-runnable-track {
+  position: relative;
   background: var(--awell-range-slider-background-color);
   border: 0;
   border-radius: 25px;
@@ -4363,6 +4378,7 @@ html {
   cursor: pointer;
 }
 .awell__rangeInput_awell_range_input_wrapper .awell__rangeInput_awell_range_input::-ms-track {
+  position: relative;
   background: transparent;
   border-color: transparent;
   border-width: 2.2px 0;
@@ -4424,6 +4440,30 @@ html {
     font-size: var(--awell-font-size-base);
   }
 }
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_hideThumb::-webkit-slider-thumb {
+  visibility: hidden;
+}
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_hideThumb::-moz-range-thumb {
+  visibility: hidden;
+}
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_hideThumb::-ms-thumb {
+  visibility: hidden;
+}
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_showThumb::-webkit-slider-thumb {
+  visibility: visible;
+}
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_showThumb::-moz-range-thumb {
+  visibility: visible;
+}
+
+.awell__rangeInput_awell_range_input.awell__rangeInput_showThumb::-ms-thumb {
+  visibility: visible;
+}
 @import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
 :root {
   --awell-accent100: #fdb833;
@@ -5479,6 +5519,9 @@ html {
   height: var(--awell-font-size-base);
   margin-top: var(--awell-spacing-4);
 }
+.awell__question_awell_question .awell__question_error.awell__question_slider_error {
+  margin-top: var(--awell-spacing-12);
+}
 .awell__phoneInputField_awell_input_field_wrapper {
   --awell-focus-ring-color: var(--awell-accent-ring-color-inputs);
   --awell-focus-ring-offset-width: 0px;