zmp-ui/switch/styles/variables.less

Zalo Mini App framework

@switch-prefix-cls: ~"@{zaui-prefix}-switch";
/* == COMMON == */
@switch-border-radius: 20px;

@switch-label-line-height: 18px;
@switch-label-font-size: 14px;
@switch-label-font-size-small: 13px;
@switch-label-margin-left: 8px;
@switch-label-margin-left-small: 4px;

@switch-height-medium: 24px;
@switch-width-medium: 40px;
@switch-handler-size-medium: 20px;
@switch-handler-transform-medium: 16px;

@switch-height-small: 16px;
@switch-width-small: 28px;
@switch-handler-size-small: 12px;
@switch-handler-transform-small: 12px;

/* == LIGHT == */
@light-switch-bg-color: var(--zaui-light-switch-bg-color, @b60);
@light-switch-disabled-bg-color: var(--zaui-light-switch-disabled-bg-color, @b40);
@light-switch-off-bg-color: var(--zaui-light-switch-off-bg-color, @ng40);
@light-switch-off-disabled-bg-color: var(--zaui-light-switch-off-disabled-bg-color, @ng30);

@light-switch-handler-bg-color: var(--zaui-light-switch-handler-bg-color, @wht-a100);
@light-switch-handler-disabled-bg-color: var(--zaui-light-switch-handler-disabled-bg-color, @wht-a100);

@light-switch-label-color: var(--zaui-light-switch-label-color, @ng100);
@light-switch-label-disabled-color: var(--zaui-light-switch-label-disabled-color, @ng40);

/* == DARK == */
@dark-switch-bg-color: var(--zaui-dark-switch-bg-color, @b60);
@dark-switch-disabled-bg-color: var(--zaui-dark-switch-disabled-bg-color, @b80);
@dark-switch-off-bg-color: var(--zaui-dark-switch-off-bg-color, @ng70);
@dark-switch-off-disabled-bg-color: var(--zaui-dark-switch-off-disabled-bg-color, @ng80);

@dark-switch-handler-bg-color: var(--zaui-dark-switch-handler-bg-color, @wht-a100);
@dark-switch-handler-disabled-bg-color: var(--zaui-dark-switch-handler-disabled-bg-color, @wht-a60);

@dark-switch-label-color: var(--zaui-dark-switch-label-color, @ng10);
@dark-switch-label-disabled-color: var(--zaui-dark-switch-label-disabled-color, @ng70);