chore(styles): 补入设计 token 扩展与 toast Taro 化,修复重构提交的编译依赖
variables.scss 扩展的 token($shadow-card/$radius-circle/$color-danger-* 等) 被 device tab 与新首页的 SCSS 引用;toast.js 由 uni.* 改为 Taro.* 并补类型声明, 否则干净 checkout 下 build:weapp 编译必挂、告警卡片点击即 ReferenceError。
This commit is contained in:
parent
08abbb55e1
commit
0ca714bec5
|
|
@ -1,13 +1,46 @@
|
||||||
// 全局变量(与现状 uview-plus 配色对齐)
|
// ===== 设计 token =====
|
||||||
$color-primary: #2ccb98;
|
// designWidth=750,源码 px 编译为 rpx(1px=1rpx=0.5物理px)
|
||||||
|
|
||||||
|
// 品牌色(tabBar selectedColor 与此保持一致)
|
||||||
|
$color-primary: #2ccb98; // 主绿:按钮、选中态、强调
|
||||||
|
$color-primary-deep: #12a37a; // 深绿:主色上的文字、次级强调
|
||||||
|
$color-primary-grad: linear-gradient(135deg, #1fca97 0%, #2dbf9c 100%); // 品牌渐变
|
||||||
|
$color-primary-light-bg: #e9fff3; // 浅绿底:选中行、激活 chip
|
||||||
|
$color-primary-light-border: #9fdcc3; // 浅绿描边:禁用态按钮
|
||||||
|
|
||||||
|
// 功能色
|
||||||
$color-success: #52c41a;
|
$color-success: #52c41a;
|
||||||
|
$color-success-light-bg: #f6ffed;
|
||||||
$color-warning: #fa8c16;
|
$color-warning: #fa8c16;
|
||||||
$color-danger: #f5222d;
|
$color-danger: #f5222d;
|
||||||
$color-text: #2a2d33;
|
$color-danger-deep: #d33b1d; // 深红:错误提示文字
|
||||||
$color-text-secondary: #9ea1a6;
|
$color-danger-light-bg: #fff3f1;
|
||||||
$color-text-tertiary: #b5b9c0;
|
$color-info: #1677ff;
|
||||||
$color-bg: #f1f1f4;
|
$color-info-light: #2f7de1;
|
||||||
$color-bg-white: #ffffff;
|
|
||||||
|
// 文本灰阶(三级)
|
||||||
|
$color-text: #2a2d33; // 主文本
|
||||||
|
$color-text-secondary: #9ea1a6; // 次要文本、说明文字
|
||||||
|
$color-text-tertiary: #b5b9c0; // 弱化文本、单位
|
||||||
|
$color-text-placeholder: #c0c4cc; // 箭头、勾选框默认
|
||||||
|
|
||||||
|
// 背景与分割线
|
||||||
|
$color-bg: #f1f1f4; // 页面背景
|
||||||
|
$color-bg-white: #ffffff; // 卡片背景
|
||||||
|
$color-bg-gray: #f5f6f8; // 输入框/chip 灰底
|
||||||
|
$color-bg-press: #f7f8fa; // 按压态
|
||||||
|
$color-bg-disabled: #eef0f4; // 禁用/离线图标底
|
||||||
|
$color-border: #f0f1f3; // 分割线
|
||||||
|
$color-mask: rgba(0, 0, 0, 0.35); // 遮罩
|
||||||
|
|
||||||
|
// 圆角
|
||||||
$radius-sm: 8px;
|
$radius-sm: 8px;
|
||||||
$radius-md: 16px;
|
$radius-md: 16px;
|
||||||
$radius-lg: 24px;
|
$radius-lg: 24px;
|
||||||
|
$radius-pill: 999px; // 胶囊/徽标
|
||||||
|
$radius-circle: 50%; // 圆
|
||||||
|
|
||||||
|
// 阴影
|
||||||
|
$shadow-card: 0 4px 16px rgba(0, 0, 0, 0.04);
|
||||||
|
$shadow-popup: 0 12px 40px rgba(0, 0, 0, 0.08);
|
||||||
|
$shadow-fab: 0 8px 24px rgba(31, 202, 151, 0.4);
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
declare module '@/utils/toast' {
|
||||||
|
export function showToast(title?: string): void
|
||||||
|
}
|
||||||
|
|
@ -1,9 +1,11 @@
|
||||||
|
import Taro from '@tarojs/taro'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 统一的轻提示封装。
|
* 统一的轻提示封装。
|
||||||
* @param {string} title 提示文案
|
* @param {string} title 提示文案
|
||||||
*/
|
*/
|
||||||
export function showToast(title = '') {
|
export function showToast(title = '') {
|
||||||
uni.showToast({
|
Taro.showToast({
|
||||||
title,
|
title,
|
||||||
icon: 'none'
|
icon: 'none'
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue