@arco-design/web-react/lib/Slider/style/token.less

Arco Design React UI Library.

@import '../../style/theme/default.less';

// road
@slider-size-road-width: 2px;
@slider-color-road-bg: var(~'@{arco-cssvars-prefix}-color-fill-3');
@slider-color-road-bg_disabled: var(~'@{arco-cssvars-prefix}-color-fill-2');

// bar
@slider-color-bar-bg: @color-primary-6;
@slider-color-bar-bg_disabled: var(~'@{arco-cssvars-prefix}-color-fill-3');

// button
@slider-color-button-bg: var(~'@{arco-cssvars-prefix}-color-bg-2');
@slider-border-size-button: @border-2;
@slider-color-button-border: @color-primary-6;
@slider-color-button-border_disabled: var(~'@{arco-cssvars-prefix}-color-fill-3');
@slider-shadow-button_active: @shadow1-down;
@slider-color-box-shadow-button_focus: var(~'@{arco-cssvars-prefix}-color-primary-light-3');
@slider-size-button-width: @size-3;
@slider-size-button-width_active: 14px;

// dot
@slider-color-dot-bg: var(~'@{arco-cssvars-prefix}-color-bg-2');
@slider-border-size-dot: @border-2;
@slider-font-size-dot: @font-size-body-1;
@slider-size-dot-width: @size-2;

// mark
@slider-spacing-margin-bottom_with-mark: @spacing-9;
@slider-spacing-padding_width-mark: @spacing-8;
@slider-spacing-padding_width-mark_vertical: @spacing-8;
@slider-font-size-mark: @font-size-body-3;
@slider-color-mark-font: var(~'@{arco-cssvars-prefix}-color-text-3');

// tick
@slider-size-tick-width: 1px;
@slider-size-tick-height: 3px;

// input
@slider-spacing-input-margin-left: @spacing-8;
@slider-size-input-width: @size-15;
@slider-size-input-height: @size-8;
@slider-size-input_range-width: @size-5;
@slider-size-input_range-height: @size-8;
@slider-size-input_range_content-width: @size-2;
@slider-size-input_range_content-height: 2px;
@slider-color-input_range_content-bg: rgb(var(~'@{arco-cssvars-prefix}-gray-6'));

// vertical
@slider-size-height_vertical: 200px;
@slider-spacing-mark-left: 3px; // mark 文本和滑动路径的距离