@adobe/spectrum-css/dist/components/slider/vars.css

The Spectrum CSS top-level backwards compatible package

.spectrum-Slider {
  --spectrum-slider-m-handle-border-size: var(--spectrum-alias-border-size-thick);
  --spectrum-slider-m-handle-border-size-down: var(--spectrum-global-dimension-size-75);
  --spectrum-slider-m-track-border-radius: var(--spectrum-global-dimension-static-size-10);
  --spectrum-slider-m-track-height: var(--spectrum-alias-border-size-thick);
  --spectrum-slider-m-handle-gap: var(--spectrum-alias-border-size-thicker);
  --spectrum-slider-m-animation-duration: var(--spectrum-global-animation-duration-100);
  --spectrum-slider-m-height: var(--spectrum-alias-item-height-m);
  --spectrum-slider-m-min-width: var(--spectrum-global-dimension-size-1250);
  --spectrum-slider-m-handle-width: var(--spectrum-alias-item-control-2-size-l);
  --spectrum-slider-m-handle-height: var(--spectrum-alias-item-control-2-size-l);
  --spectrum-slider-m-handle-border-radius: var(--spectrum-global-dimension-size-100);
  --spectrum-slider-m-label-gap-x: var(--spectrum-alias-item-control-gap-m);
  --spectrum-slider-tick-m-mark-width: var(--spectrum-alias-border-size-thick);
  --spectrum-slider-tick-m-mark-border-radius: var(--spectrum-alias-border-radius-xsmall);
  --spectrum-slider-tick-m-mark-height: var(--spectrum-global-dimension-size-125);
  --spectrum-slider-ramp-track-height: var(--spectrum-global-dimension-static-size-200);
  --spectrum-alias-focus-ring-gap: var(--spectrum-global-dimension-static-size-25);
  --spectrum-fieldlabel-m-padding-top: var(--spectrum-global-dimension-size-50);
  --spectrum-alias-focus-ring-size: var(--spectrum-global-dimension-static-size-25);
  --spectrum-alias-focus-color: var(--spectrum-global-color-blue-400);
  --spectrum-alias-label-text-color: var(--spectrum-global-color-gray-700);
  --spectrum-alias-text-color-disabled: var(--spectrum-global-color-gray-500);
  --spectrum-slider-m-track-color: var(--spectrum-global-color-gray-400);
  --spectrum-slider-m-track-fill-color: var(--spectrum-global-color-gray-700);
  --spectrum-slider-m-handle-border-color: var(--spectrum-global-color-gray-700);
  --spectrum-slider-m-handle-background-color: var(--spectrum-alias-background-color-transparent);
  --spectrum-slider-m-handle-border-color-hover: var(--spectrum-global-color-gray-800);
  --spectrum-slider-m-handle-border-color-key-focus: var(--spectrum-global-color-gray-800);
  --spectrum-slider-m-focus-ring-size-key-focus: var(--spectrum-alias-focus-ring-size);
  --spectrum-slider-m-handle-border-color-down: var(--spectrum-global-color-gray-800);
  --spectrum-alias-background-color-default: var(--spectrum-global-color-gray-100);
  --spectrum-slider-tick-m-mark-color: var(--spectrum-alias-track-color-default);
  --spectrum-slider-m-handle-background-color-down: var(--spectrum-alias-background-color-transparent);
  --spectrum-slider-m-handle-border-color-disabled: var(--spectrum-global-color-gray-400);
  --spectrum-slider-m-track-color-disabled: var(--spectrum-global-color-gray-300);
  --spectrum-slider-m-track-fill-color-disabled: var(--spectrum-global-color-gray-300);
  --spectrum-slider-ramp-track-color-disabled: var(--spectrum-global-color-gray-200);
}