@heycar-uikit/core/slider-with-histogram/styles/default.css

The React UI library from HeyCar

:root {
  /* heycar mint color */

  /* mica blue color */
  --color-mica-blue-700: #052962;

  /* sunbeam blue color */

  /* mustang yellow color */

  /* old ferrari red color */

  /* -- fantasy name of "green" color to be defined -- */

  /* -- fantasy name of "whatsapp" color to be defined -- */

  /* -- fantasy name of "red" color to be defined -- */

  /* tarmac grey color */
  --color-tarmac-grey-700: #303030;

  /* brand colors */
}
/* Depricated. Do Not Use */
:root {
  --spacing-1: 4px;
  --spacing-2: 8px;
}
:root {
  /* Font families */

  /* Font weights */
}
/*
  Heading
*/
/*
  Sub-Heading
*/
/*
  Body
*/
/*
  Caption
*/
/*
  Overline
*/
/*
  Button
*/
/*
  Button Old - DO NOT USE
*/
/* If this is ever changed please update breakpoints.json as well */
/* Mobile */
/* Tablet */
/* Desktop */
/* Default theme (light) */
:root {
  /*
    Colors
  */
  --color-primary-700: var(--color-mica-blue-700);
  --color-neutral-700: var(--color-tarmac-grey-700);

  /*
    Sizes
  */
}
body {
  color: var(--color-neutral-700);
}
:root {
  --histogram-height: 64px;
  --slider-height: 22px;
}
.slider-with-histogram__wrapper_uhjsd .slider-with-histogram__sliderWrapper_uhjsd {
    margin-top: -10px;
  }
.slider-with-histogram__histogramWrapper_uhjsd {
  position: relative;
  margin: 0 calc(var(--slider-height) / 2);
  height: var(--histogram-height);
}
.slider-with-histogram__loader_uhjsd {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin: 0 auto;
  color: var(--color-primary-700);
}
.slider-with-histogram__loader_uhjsd div {
    height: var(--spacing-2);
    width: var(--spacing-2);
    margin-right: var(--spacing-1);
    border-radius: 100%;
    background-color: currentColor;
    animation-name: slider-with-histogram__blink_uhjsd;
    animation-duration: 950ms;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    transform: scale(0);
  }
.slider-with-histogram__loader_uhjsd div:nth-child(1) {
    animation-delay: 0ms;
    transform-origin: 15% 50%;
  }
.slider-with-histogram__loader_uhjsd div:nth-child(2) {
    animation-delay: 150ms;
    transform-origin: 50% 50%;
  }
.slider-with-histogram__loader_uhjsd div:nth-child(3) {
    animation-delay: 300ms;
    transform-origin: 85% 50%;
  }
@keyframes slider-with-histogram__blink_uhjsd {
  21% {
    transform: scale(1);
  }

  47% {
    transform: scale(1);
  }

  68% {
    transform: scale(0);
  }
}