tdesign-react/esm/style/web/components/back-top/_var.less

TDesign Component for React

// 组件变量
// 名称可按如下规则定义：
// <component>-[type]-[attrtype]-<attr>-[status]

// component:组件名，如button，
// type: 组件类型，如 button 的次要按钮（line）
// attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（border）等
// attr: 属性名称，如color、height、radius等
// status: 表示组件状态或尺寸，如 hover、disabled、s、l 等

// 如：@button-line-bg-color-hover
// 如：@button-line-height-s
@back-top-border-radius-circle: @border-radius-circle;
@back-top-border-radius-square: @border-radius-medium;

@back-top-width-small: @comp-size-xxl;
@back-top-height-small: @comp-size-xxl;

@back-top-text-display-small: none;
@back-top-text-display-medium: block;

@back-top-width-medium: @comp-size-xxxxl;
@back-top-height-medium: @comp-size-xxxxl;

@back-top-text-color-light: @text-color-secondary;
@back-top-text-color-primary: @text-color-anti;
@back-top-text-color-dark: @text-color-anti;
@back-top-text-color: @text-color-primary;

@back-top-icon-color-light: @text-color-primary;
@back-top-icon-color-primary: @text-color-anti;
@back-top-icon-color-dark: @text-color-anti;

@back-top-bg-color-light: @bg-color-container;
@back-top-bg-color-primary: @brand-color;
@back-top-bg-color-dark: rgba(0, 0, 0, .9);

@back-top-bg-color-light-hover: @bg-color-container-hover;
@back-top-bg-color-primary-hover: @brand-color-hover;
@back-top-bg-color-dark-hover: rgba(0, 0, 0, .6);

@back-top-border-color-light: @component-border;
@back-top-border-color-primary: @back-top-bg-color-primary;
@back-top-border-color-dark: @back-top-bg-color-dark;

@back-top-border-color-light-hover: @back-top-bg-color-light-hover;
@back-top-border-color-primary-hover: @back-top-bg-color-primary-hover;
@back-top-border-color-dark-hover: @back-top-bg-color-dark-hover;

@back-top-box-shadow: @shadow-3;