quarkd
Version:
Mobile UI Components built on Web Components.
107 lines (90 loc) • 2.56 kB
JavaScript
const brandPrimary = "#0088ff";
export default {
// 文字色
textWhiteColor: "#fff", // 白色
textBaseColor: "#242729", // 基本， 比如弹框的Title， Cell的Title等
textSecondaryColor: "#969799", // 辅助色， 比如Cell的desc
textDisabledColor: "#bbbbbb", // 失效
textPlaceHolderColor: "#ccc",
linkColor: brandPrimary, // 链接
// 背景色
fillBaseColor: "#ffffff", // 组件默认背景
fillDisabledColor: "#dddddd", // 通用失效背景
fillMaskColor: "rgba(0, 0, 0, 0.7)", // 遮罩背景
fillGreyColor: "#f7f7f7",
// 全局/品牌色
primaryColor: brandPrimary,
warningColor: "#FB990F",
dangerColor: "#F72626",
// warningColor: '#FF5526',
successColor: "#07C160",
// grayColor: "#879099",
// 品牌色浅色
primaryLightColor: "#E6F4FF",
dangerLightColor: "#FEE9E9",
// orangeLightColor: "#FFEEE9",
warningLightColor: "#FEF4E7",
successLightColor: "#E6F8EF",
// grayLightColor: "#E1E6EB",
// 边框色
borderBaseColor: "#dddddd",
borderPrimaryColor: "#7FC3FF",
borderWarningColor: "#FCCC87",
borderDangerColor: "#FB9292",
borderOrangeColor: "#FFAA92",
borderSuccessColor: "#83E0AF",
// 透明度
opacityDisabled: "0.7", // switch checkbox radio 等组件禁用的透明度
// 字体尺寸
fontSizeCaptionSsm: "11px",
fontSizeCaptionSm: "12px",
fontSizeBase: "14px",
fontSizeSubhead: "15px",
fontSizeCaption: "16px",
fontSizeHeading: "17px",
// 圆角
radiuXs: "2px",
radiusSm: "4px",
radiusMd: "6px",
radiusLg: "12px",
radiusBg: "16px",
// 边框尺寸
borderWidthSm: "0.5px",
borderWidthMd: "1px",
borderWidthLg: "2px",
// 间距
// 水平间距
hSpacingXs: "3px",
hSpacingS: "4px",
hSpacingSm: "5px",
hSpacingMd: "8px",
hSpacingLg: "15px",
// 垂直间距
vSpacingXxs: "2px",
vSpacingXs: "3px",
vSpacingSm: "5px",
vSpacingMd: "9px",
vSpacingLg: "15px",
vSpacingXl: "21px",
// 高度
lineHeightBase: "1px", // 单行行高
lineHeightParagraph: "1.5px", // 多行行高
// 图标尺寸
iconSizeXxs: "15px",
iconSizeXs: "18px",
iconSizeSm: "21px",
iconSizeMd: "22px",
iconSizeLg: "36px",
// 字体
sFontFamily: "PingFangSC-Regular, PingFang SC",
mFontFamily: "PingFangSC-Medium, PingFang SC",
// 表单相关的
formBaseColor: "#242729",
formDisabledColor: "#c8c9cc",
formPlaceholderColor: "#bcc4cc",
// 动画相关
animationDurationBase: ".3s",
animationDurationFast: ".25s",
animationTimingEnter: "ease-out",
animationTimingLeave: "ease-in",
};