birdpaper-ui/lib/input/src/style/token.less

一个通用的 vue3 UI组件库。A common vue3 UI component library.

@input-size-mini-font-size: 12px;
@input-size-small-font-size: 13px;
@input-size-normal-font-size: 13px;
@input-size-large-font-size: 16px;

@input-size-mini-height: 22px;
@input-size-small-height: 28px;
@input-size-normal-height: 32px;
@input-size-large-height: 36px;

@input-size-mini-radius: 4px;
@input-size-small-radius: 4px;
@input-size-normal-radius: 4px;
@input-size-large-radius: 6px;

@input-size-mini-padding:0 4px 0 6px;
@input-size-small-padding:0 8px 0 10px;
@input-size-normal-padding: 0 8px 0 10px;
@input-size-large-padding:0 8px 0 10px;

@input-status-normal-color: @gary-10;
@input-status-normal-placeholder-color: @gary-7;
@input-status-normal-background: @gary-3;
@input-status-normal-border-color: @gary-3;
@input-status-normal-background-hover: @gary-4;
@input-status-normal-border-color-hover: @gary-4;
@input-status-normal-background-focus: @gary-1;
@input-status-normal-border-color-focus: @primary-6;

@input-status-readonly-color: @gary-10;
@input-status-readonly-placeholder-color: @gary-7;
@input-status-readonly-background: @gary-3;
@input-status-readonly-border-color: @gary-3;
@input-status-readonly-background-hover: @gary-4;
@input-status-readonly-border-color-hover: @gary-4;
@input-status-readonly-background-focus: @gary-1;
@input-status-readonly-border-color-focus: @primary-6;

// @input-status-readonly-color: @gary-10;
// @input-status-readonly-placeholder-color: @gary-7;
// @input-status-readonly-background: @gary-2;
// @input-status-readonly-border-color: @gary-2;
// @input-status-readonly-background-hover: @gary-2;
// @input-status-readonly-border-color-hover: @gary-2;
// @input-status-readonly-background-focus: @gary-2;
// @input-status-readonly-border-color-focus: @gary-2;

@input-status-disabled-color: @gary-8;
@input-status-disabled-placeholder-color: @gary-7;
@input-status-disabled-background: @gary-4;
@input-status-disabled-border-color: @gary-4;
@input-status-disabled-background-hover: @gary-4;
@input-status-disabled-border-color-hover: @gary-4;
@input-status-disabled-background-focus: @gary-4;
@input-status-disabled-border-color-focus: @gary-4;

@input-status-danger-color: @gary-10;
@input-status-danger-placeholder-color: @gary-7;
@input-status-danger-background: @danger-1;
@input-status-danger-border-color: @danger-1;
@input-status-danger-background-hover: @danger-2;
@input-status-danger-border-color-hover: @danger-2;
@input-status-danger-background-focus: @gary-1;
@input-status-danger-border-color-focus: @danger-6;