variables.scss 3.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. $color-carousel_indicator_theme_dark-bg-default: rgba(var(--semi-black), .5); // 深色主题指示器背景颜色 - 默认
  2. $color-carousel_indicator_theme_dark-bg-hover: rgba(var(--semi-black), .7); // 深色主题指示器背景颜色 - 悬浮
  3. $color-carousel_indicator_theme_dark-bg-active: rgba(var(--semi-black), 1); // 深色主题指示器背景颜色 - 选中
  4. $color-carousel_indicator_theme_primary-bg-default: rgba(var(--semi-blue-6), .4); // 主要主题指示器背景颜色 - 默认
  5. $color-carousel_indicator_theme_primary-bg-hover: rgba(var(--semi-blue-6), .7); // 主要主题指示器背景颜色 - 悬浮
  6. $color-carousel_indicator_theme_primary-bg-active: rgba(var(--semi-blue-6), 1); // 主要主题指示器背景颜色 - 选中
  7. $color-carousel_indicator_theme_light-bg-default: rgba(var(--semi-white), .4); // 浅色主题指示器背景颜色 - 默认
  8. $color-carousel_indicator_theme_light-bg-hover: rgba(var(--semi-white), .7); // 浅色主题指示器背景颜色 - 悬浮
  9. $color-carousel_indicator_theme_light-bg-active: rgba(var(--semi-white), 1); // 浅色主题指示器背景颜色 - 选中
  10. $color-carousel_arrow_theme_dark-bg-default: rgba(var(--semi-black), .5); // 深色主题箭头背景颜色 - 默认
  11. $color-carousel_arrow_theme_dark-bg-hover: rgba(var(--semi-black), 1); // 深色主题箭头背景颜色 - 悬浮
  12. $color-carousel_arrow_theme_primary-bg-default: rgba(var(--semi-blue-6), .4); // 主要主题箭头背景颜色 - 默认
  13. $color-carousel_arrow_theme_primary-bg-hover: rgba(var(--semi-blue-6), 1); // 主要主题箭头背景颜色 - 悬浮
  14. $color-carousel_arrow_theme_light-bg-default: rgba(var(--semi-white), .4); // 浅色主题箭头背景颜色 - 默认
  15. $color-carousel_arrow_theme_light-bg-hover: rgba(var(--semi-white), 1); // 浅色主题箭头背景颜色 - 悬浮
  16. $width-carousel_indicator_line: 240px; // 条状指示器最大宽度
  17. $width-carousel_indicator_columnar_small: 4px; // 小尺寸柱状指示器宽度
  18. $width-carousel_indicator_columnar_medium: 6px; // 中等尺寸柱状指示器宽度
  19. $width-carousel_indicator_dot_small:8px; // 小尺寸点状指示器宽度
  20. $width-carousel_indicator_dot_medium: 12px; // 中等尺寸点状指示器宽度
  21. $width-carousel_arrow: 32px; // 箭头宽度
  22. $height-carousel_indicator_columnar_small_default: 12px; // 小尺寸柱状指示器高度 - 默认
  23. $height-carousel_indicator_columnar_small_active: 20px; // 小尺寸柱状指示器高度 - 选中
  24. $height-carousel_indicator_columnar_medium_default: 20px; // 中等尺寸柱状指示器高度 - 默认
  25. $height-carousel_indicator_columnar_medium_active: 28px; // 中等尺寸柱状指示器高度 - 选中
  26. $height-carousel_indicator_line_small: 4px; // 小尺寸条状指示器高度
  27. $height-carousel_indicator_line_medium: 6px; // 中等尺寸条状指示器高度
  28. $radius-carousel_indicator_dot: 50%; // 点状指示器圆角
  29. $spacing-carousel_indicator-padding: 32px; // 指示器内边距
  30. $spacing-carousel_indicator_columnar-marginX: 4px; // 柱状指示器水平外边距
  31. $spacing-carousel_indicator_line-marginX: 4px; // 条状指示器水平外边距
  32. $spacing-carousel_indicator_dot-marginX: 8px; // 点状指示器水平外边距
  33. $spacing-carousel_arrow-left: 20px; // 左侧箭头绝对定位 - left
  34. $spacing-carousel_arrow-right: 20px; // 右侧箭头绝对定位 - right