/* 颜色变量 */ /* Color 可以自定义相关配色 */ /* 标准色 */ $red: #F26A1B; $orange: #f37b1d; $yellow: #fbbd08; $olive: #76AC96; $green: #11A20D; // 健康打卡 绿 $cyan: #0897C7; // 按钮蓝 $blue: #6D99F2; $darkBlue: #0076FF; $purple: #677DBF; // 校园打卡 青 $mauve: #9c26b0; $pink: #e03997; $brown: #a5673f; $grey: #CDCDCD; $black: #333333; $darkGray: #666666; $gray: #808080; $ghostWhite: #f1f1f1; $white: #ffffff; /* 浅色 */ $redLight: #fadbd9; $orangeLight: #fde6d2; $yellowLight: #fef2ce; $oliveLight: #e8f4d9; $greenLight: #d7f0db; $cyanLight: #d2f1f0; $blueLight: #cce6ff; $purpleLight: #e1d7f0; $mauveLight: #ebd4ef; $pinkLight: #f9d7ea; $brownLight: #ede1d9; $greyLight: #F5f5f5; /* 渐变色 */ $gradualRed: linear-gradient(45deg, #f43f3b, #ec008c); $gradualOrange: linear-gradient(45deg, #ff9700, #ed1c24); $gradualGreen: linear-gradient(45deg, #39b54a, #8dc63f); $gradualPurple: linear-gradient(45deg, #ec008c, #5e00ff); $gradualPink: linear-gradient(45deg, #ec008c, #6739b6); $gradualBlue: linear-gradient(45deg, #0081ff, #1cbbb4); /* 阴影透明色 */ $ShadowSize: 6rpx 6rpx 8rpx; $redShadow: rgba(204, 69, 59, 0.2); $orangeShadow: rgba(217, 109, 26, 0.2); $yellowShadow: rgba(224, 170, 7, 0.2); $oliveShadow: rgba(124, 173, 55, 0.2); $greenShadow: rgba(48, 156, 63, 0.2); $cyanShadow: rgba(28, 187, 180, 0.2); $blueShadow: rgba(0, 102, 204, 0.2); $purpleShadow: rgba(88, 48, 156, 0.2); $mauveShadow: rgba(133, 33, 150, 0.2); $pinkShadow: rgba(199, 50, 134, 0.2); $brownShadow: rgba(140, 88, 53, 0.2); $greyShadow: rgba(114, 130, 138, 0.2); $grayShadow: rgba(114, 130, 138, 0.2); $blackShadow: rgba(26, 26, 26, 0.2); $whiteShadow: rgba(255, 255, 255, 0.2); /* 行为相关颜色 */ $uni-color-primary: #007aff; $uni-color-success: #4cd964; $uni-color-warning: #f0ad4e; $uni-color-error: #dd524d; /* 首页四个配色 */ $iconGreen: #62D4A6; $iconCyan: #9376F5; $iconBlue: #58C9D1; $iconPurple: #CF7FE6; /* 文字基本颜色 */ $uni-text-color: #101010; //基本色 $uni-text-color-inverse: #fff; //反色 $uni-text-color-grey: #747474; //辅助灰色,如加载更多的提示信息 $uni-text-color-placeholder: #808080; $uni-text-color-disable: #c0c0c0; /* 背景颜色 */ $uni-bg-color: #ffffff; $uni-bg-color-grey: #f8f8f8; $uni-bg-color-hover: #f1f1f1; //点击状态颜色 $uni-bg-color-mask: rgba(0, 0, 0, 0.4); //遮罩颜色 /* 边框颜色 */ $uni-border-color: #c8c7cc; /* 尺寸变量 */ /* 文字尺寸 */ $uni-font-size: 20rpx; $uni-font-size-sm: 24rpx; $uni-font-size-base: 28rpx; $uni-font-size-lg: 32rpx; $uni-font-size-xl: 36rpx; $uni-font-size-xxl: 44rpx; $uni-font-size-sl: 80rpx; $uni-font-size-xsl: 120rpx; /* 图片尺寸 */ $uni-img-size-sm: 40rpx; $uni-img-size-base: 52rpx; $uni-img-size-lg: 80rpx; /* Border Radius */ $uni-border-radius-sm: 4rpx; $uni-border-radius-base: 6rpx; $uni-border-radius-lg: 12rpx; $uni-border-radius-circle: 50%; /* 水平间距 */ $uni-spacing-row-sm: 10px; $uni-spacing-row-base: 20rpx; $uni-spacing-row-lg: 30rpx; /* 垂直间距 */ $uni-spacing-col-sm: 8rpx; $uni-spacing-col-base: 16rpx; $uni-spacing-col-lg: 24rpx; /* 透明度 */ $uni-opacity-disabled: 0.3; // 组件禁用态的透明度 /* 文章场景相关 */ $uni-color-title: #2c405a; // 文章标题颜色 $uni-font-size-title: 40rpx; $uni-color-subtitle: #555555; // 二级标题颜色 $uni-font-size-subtitle: 36rpx; $uni-color-paragraph: #3f536e; // 文章段落颜色 $uni-font-size-paragraph: 30rpx;