59 lines
1.2 KiB
SCSS
59 lines
1.2 KiB
SCSS
|
/**
|
||
|
|
* 项目主题色配置
|
||
|
|
* 统一管理项目中使用的主题色
|
||
|
|
*/
|
||
|
|
|
||
|
|
// 主题色
|
||
|
|
$primary-color: #0877F1;
|
||
|
|
$primary-light: #e8f3ff;
|
||
|
|
$primary-dark: #0660c9;
|
||
|
|
$primary-gradient-start: #1b5cc8;
|
||
|
|
$primary-gradient-end: #0877F1;
|
||
|
|
|
||
|
|
// 辅助色
|
||
|
|
$success-color: #4cd964;
|
||
|
|
$warning-color: #f0ad4e;
|
||
|
|
$error-color: #dd524d;
|
||
|
|
$info-color: #909399;
|
||
|
|
|
||
|
|
// 文字颜色
|
||
|
|
$text-color-primary: #333;
|
||
|
|
$text-color-regular: #666;
|
||
|
|
$text-color-secondary: #999;
|
||
|
|
$text-color-placeholder: #c0c4cc;
|
||
|
|
$text-color-white: #fff;
|
||
|
|
|
||
|
|
// 背景颜色
|
||
|
|
$bg-color-white: #ffffff;
|
||
|
|
$bg-color-page: #f5f5f5;
|
||
|
|
$bg-color-hover: #f1f1f1;
|
||
|
|
$bg-color-mask: rgba(0, 0, 0, 0.4);
|
||
|
|
|
||
|
|
// 边框颜色
|
||
|
|
$border-color-base: #e4e7ed;
|
||
|
|
$border-color-light: #ebeef5;
|
||
|
|
$border-color-lighter: #f2f6fc;
|
||
|
|
|
||
|
|
// 圆角
|
||
|
|
$border-radius-small: 4rpx;
|
||
|
|
$border-radius-base: 8rpx;
|
||
|
|
$border-radius-large: 16rpx;
|
||
|
|
$border-radius-round: 999rpx;
|
||
|
|
|
||
|
|
// 间距
|
||
|
|
$spacing-small: 16rpx;
|
||
|
|
$spacing-base: 24rpx;
|
||
|
|
$spacing-large: 32rpx;
|
||
|
|
|
||
|
|
// 字体大小
|
||
|
|
$font-size-small: 24rpx;
|
||
|
|
$font-size-base: 28rpx;
|
||
|
|
$font-size-medium: 32rpx;
|
||
|
|
$font-size-large: 36rpx;
|
||
|
|
$font-size-xlarge: 40rpx;
|
||
|
|
|
||
|
|
// 阴影
|
||
|
|
$box-shadow-light: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||
|
|
$box-shadow-base: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
|
||
|
|
$box-shadow-dark: 0 8rpx 24rpx rgba(0, 0, 0, 0.12);
|