ns-base-module 1.0.0

package/style/variables.scss

@@ -0,0 +1,684 @@
+/**
+ * ==================================================
+ * 基本单位，作为各组件size的参考值
+ * ==================================================
+ */
+$lc_Hd: 2px;
+
+/**
+  * ==================================================
+  * 边框尺寸
+  * ==================================================
+  */
+$lc_Border_width_sm: 1px;
+$lc_Border_width_lg: $lc_Hd;
+
+/**
+  * ==================================================
+  * 分割线
+  * ==================================================
+  */
+$lc_Divider_height_sm: 1px;
+
+/**
+  * ==================================================
+  * 图标尺寸
+  * ==================================================
+  */
+$lc_Icon_size_xxxs: 4 * $lc_Hd;
+$lc_Icon_size_xxs: 5 * $lc_Hd;
+$lc_Icon_size_xs: 6 * $lc_Hd;
+$lc_Icon_size_sm: 8 * $lc_Hd;
+$lc_Icon_size_md: 10 * $lc_Hd;
+$lc_Icon_size_lg: 12 * $lc_Hd;
+$lc_Icon_size_xl: 16 * $lc_Hd;
+
+.lc_Icon_size_xxxs {
+  font-size: $lc_Icon_size_xxxs;
+}
+
+.lc_Icon_size_xxs {
+  font-size: $lc_Icon_size_xxs;
+}
+
+.lc_Icon_size_xs {
+  font-size: $lc_Icon_size_xs;
+}
+
+.lc_Icon_size_sm {
+  font-size: $lc_Icon_size_sm;
+}
+
+.lc_Icon_size_md {
+  font-size: $lc_Icon_size_md;
+}
+
+.lc_Icon_size_lg {
+  font-size: $lc_Icon_size_lg;
+}
+
+.lc_Icon_size_xl {
+  font-size: $lc_Icon_size_xl;
+}
+
+/**
+  * ==================================================
+  * 品牌色 BRAND COLOR
+  * ==================================================
+  */
+// 常规
+$lc_Color_brand_normal: var(--lc_Color_brand_normal, #0273b0);
+// 20%透明度
+$lc_Color_brand_normal_opacity20: var(
+  --lc_Color_brand_normal_opacity20,
+  rgba(70, 98, 230, 0.2)
+);
+// 悬浮
+$lc_Color_brand_hover: var(--lc_Color_brand_hover, #208bbd);
+// 点击
+$lc_Color_brand_click: var(--lc_Color_brand_click, #208bbd);
+// 禁用
+$lc_Color_brand_disable: var(--lc_Color_brand_disable, #d6defd);
+// 浅色背景
+$lc_Color_brand_lb: var(--lc_Color_brand_lb, #f5f7fe);
+// 特殊场景
+$lc_Color_brand_special: var(--lc_Color_brand_special, #208bbd);
+
+/**
+  * ==================================================
+  * 品牌渐变色 BRAND GRADIENT COLOR
+  * ==================================================
+  */
+// 水平左到右渐变
+$lc_Color_gradient_270deg_brand_normal: var(
+  --lc_Color_gradient_270deg_brand_normal,
+  linear-gradient(to right, $lc_Color_brand_special, $lc_Color_brand_normal)
+);
+// 悬停
+$lc_Color_gradient_270deg_brand_hover: var(
+  --lc_Color_gradient_270deg_brand_hover,
+  linear-gradient(to right, $lc_Color_brand_special, $lc_Color_brand_hover)
+);
+// 点击
+$lc_Color_gradient_270deg_brand_click: var(
+  --lc_Color_gradient_270deg_brand_click,
+  linear-gradient(to right, $lc_Color_brand_normal, $lc_Color_brand_click)
+);
+// 禁用
+$lc_Color_gradient_270deg_brand_disable: var(
+  --lc_Color_gradient_270deg_brand_disable,
+  linear-gradient(to right, #e6ebfe, #d6defd)
+);
+// 浅色背景
+$lc_Color_gradient_270deg_brand_lb: var(
+  --lc_Color_gradient_270deg_brand_lb,
+  linear-gradient(to right, #f5f7fe, #d6defd)
+);
+
+// 垂直左到右渐变
+$lc_Color_gradient_360deg_brand_normal: var(
+  --lc_Color_gradient_360deg_brand_normal,
+  linear-gradient(315deg, $lc_Color_brand_special, $lc_Color_brand_normal)
+);
+// 悬停
+$lc_Color_gradient_360deg_brand_hover: var(
+  --lc_Color_gradient_360deg_brand_hover,
+  linear-gradient(to bottom, $lc_Color_brand_special, $lc_Color_brand_hover)
+);
+// 点击
+$lc_Color_gradient_360deg_brand_click: var(
+  --lc_Color_gradient_360deg_brand_click,
+  linear-gradient(to bottom, $lc_Color_brand_normal, $lc_Color_brand_click)
+);
+// 禁用
+$lc_Color_gradient_360deg_brand_disable: var(
+  --lc_Color_gradient_360deg_brand_disable,
+  linear-gradient(to bottom, #e6ebfe, #d6defd)
+);
+// 浅色背景
+$lc_Color_gradient_360deg_brand_lb: var(
+  --lc_Color_gradient_360deg_brand_lb,
+  linear-gradient(to bottom, #f5f7fe, #d6defd)
+);
+
+// 垂直左到右渐变
+$lc_Color_gradient_315deg_brand_normal: var(
+  --lc_Color_gradient_315deg_brand_normal,
+  linear-gradient(-45deg, $lc_Color_brand_special, $lc_Color_brand_normal)
+);
+// 悬停
+$lc_Color_gradient_315deg_brand_hover: var(
+  --lc_Color_gradient_315deg_brand_hover,
+  linear-gradient(-45deg, $lc_Color_brand_special, $lc_Color_brand_hover)
+);
+// 点击
+$lc_Color_gradient_315deg_brand_click: var(
+  --lc_Color_gradient_315deg_brand_click,
+  linear-gradient(-45deg, $lc_Color_brand_normal, $lc_Color_brand_click)
+);
+// 禁用
+$lc_Color_gradient_315deg_brand_disable: var(
+  --lc_Color_gradient_315deg_brand_disable,
+  linear-gradient(-45deg, #e6ebfe, #d6defd)
+);
+// 浅色背景
+$lc_Color_gradient_315deg_brand_lb: var(
+  --lc_Color_gradient_315deg_brand_lb,
+  linear-gradient(-45deg, #f5f7fe, #d6defd)
+);
+
+/**
+  * ==================================================
+  * 中性色 NEUTRAL COLOR
+  * ==================================================
+  */
+
+// 黑色中性色
+
+// 强调，正文标题
+$lc_Color_neutral_1: var(--lc_Color_neutral_1, #333333);
+// 次强调，正文
+$lc_Color_neutral_2: var(--lc_Color_neutral_2, #666666);
+// 次要信息、禁用、描述文字色
+$lc_Color_neutral_3: var(--lc_Color_neutral_3, #999999);
+// 置灰提示信息
+$lc_Color_neutral_4: var(--lc_Color_neutral_4, #cccccc);
+// 表单深描边、悬停
+$lc_Color_neutral_5: var(--lc_Color_neutral_5, #d9d9d9);
+// 表单描边、深分割线色
+$lc_Color_neutral_6: var(--lc_Color_neutral_6, #e5e5e5);
+// 容器背景色
+$lc_Color_neutral_7: var(--lc_Color_neutral_7, #f7f7f7);
+// 浅分割线色、表头背景色
+$lc_Color_neutral_15: var(--lc_Color_neutral_15, #f0f0f0);
+
+// 白色中性色
+
+// 纯白文字
+$lc_Color_neutral_8: var(--lc_Color_neutral_8, #ffffff);
+// 强调，正文标题
+$lc_Color_neutral_9: var(--lc_Color_neutral_9, rgba(255, 255, 255, 0.8));
+// 次强调，正文
+$lc_Color_neutral_10: var(--lc_Color_neutral_10, rgba(255, 255, 255, 0.6));
+// 次要信息、禁用、描述文字色
+$lc_Color_neutral_11: var(--lc_Color_neutral_11, rgba(255, 255, 255, 0.4));
+// 置灰提示信息
+$lc_Color_neutral_12: var(--lc_Color_neutral_12, rgba(255, 255, 255, 0.2));
+// 边框描边色
+$lc_Color_neutral_13: var(--lc_Color_neutral_13, rgba(255, 255, 255, 0.15));
+// 分割线色
+$lc_Color_neutral_14: var(--lc_Color_neutral_14, rgba(255, 255, 255, 0.1));
+
+// 遮罩色
+$lc_Color_mask_1: var(--lc_Color_mask_1, rgba(0, 0, 0, 0.25));
+
+// 文字气泡提示色
+$lc_Color_tooltip: var(--lc_Color_tooltip, rgba(0, 0, 0, 0.8));
+
+/**
+  * ==================================================
+  * 功能色 FUNCTION COLOR
+  * ==================================================
+  */
+// 出错
+$lc_Color_error_normal: var(--lc_Color_error_normal, #e54747);
+// 20%透明度
+$lc_Color_error_normal_opacity20: var(
+  --lc_Color_error_normal_opacity20,
+  rgba(229, 71, 71, 0.2)
+);
+// 悬浮
+$lc_Color_error_hover: var(--lc_Color_error_hover, #e85959);
+// 点击
+$lc_Color_error_click: var(--lc_Color_error_click, #ce4040);
+// 禁用
+$lc_Color_error_disable: var(--lc_Color_error_disable, #fadada);
+// 浅色背景
+$lc_Color_error_lb: var(--lc_Color_error_lb, #fcecec);
+
+// 警告
+$lc_Color_warning_normal: var(--lc_Color_warning_normal, #ee8049);
+// 悬浮
+$lc_Color_warning_hover: var(--lc_Color_warning_hover, #f08d5b);
+// 点击
+$lc_Color_warning_click: var(--lc_Color_warning_click, #d67342);
+// 禁用
+$lc_Color_warning_disable: var(--lc_Color_warning_disable, #fce6db);
+// 浅色背景
+$lc_Color_warning_lb: var(--lc_Color_warning_lb, #fdf2ec);
+
+// 成功
+$lc_Color_success_normal: var(--lc_Color_success_normal, #3dba6d);
+// 悬浮
+$lc_Color_success_hover: var(--lc_Color_success_hover, #50c17c);
+// 点击
+$lc_Color_success_click: var(--lc_Color_success_click, #37a762);
+// 禁用
+$lc_Color_success_disable: var(--lc_Color_success_disable, #d8f1e2);
+// 浅色背景
+$lc_Color_success_lb: var(--lc_Color_success_lb, #ebf8f0);
+
+// 正常-进行中
+$lc_Color_info_normal: var(--lc_Color_info_normal, #149fec);
+// 悬浮
+$lc_Color_info_hover: var(--lc_Color_info_hover, #2ca9ee);
+// 点击
+$lc_Color_info_click: var(--lc_Color_info_click, #128fd4);
+// 禁用
+$lc_Color_info_disable: var(--lc_Color_info_disable, #d0ecfb);
+// 浅色背景
+$lc_Color_info_lb: var(--lc_Color_info_lb, #e7f5fd);
+
+/**
+  * ==================================================
+  * 辅助色 AUXILIARY COLOR
+  * ==================================================
+  */
+// 常规
+$lc_Color_aux_1_normal: var(--lc_Color_aux_1_normal, #0273b0);
+// 悬浮
+$lc_Color_aux_1_hover: var(--lc_Color_aux_1_hover, #466bf5);
+// 点击
+$lc_Color_aux_1_click: var(--lc_Color_aux_1_click, #2c52dc);
+// 禁用
+$lc_Color_aux_1_disable: var(--lc_Color_aux_1_disable, #d6defd);
+// 浅色背景
+$lc_Color_aux_1_lb: var(--lc_Color_aux_1_lb, #f5f7fe);
+
+// 正常
+$lc_Color_aux_2_normal: var(--lc_Color_aux_2_normal, #7f8fa4);
+// 悬浮
+$lc_Color_aux_2_hover: var(--lc_Color_aux_2_hover, #8c9aad);
+// 点击
+$lc_Color_aux_2_click: var(--lc_Color_aux_2_click, #728194);
+// 禁用
+$lc_Color_aux_2_disable: var(--lc_Color_aux_2_disable, #e5e9ed);
+// 浅色背景
+$lc_Color_aux_2_lb: var(--lc_Color_aux_2_lb, #f9f9fa);
+
+// 正常
+$lc_Color_aux_3_normal: var(--lc_Color_aux_3_normal, #ff6b00);
+// 悬浮
+$lc_Color_aux_3_hover: var(--lc_Color_aux_3_hover, #ff7a1a);
+// 点击
+$lc_Color_aux_3_click: var(--lc_Color_aux_3_click, #e56000);
+// 禁用
+$lc_Color_aux_3_disable: var(--lc_Color_aux_3_disable, #ffe1cc);
+// 浅色背景
+$lc_Color_aux_3_lb: var(--lc_Color_aux_3_lb, #fff7f2);
+
+// 正常
+$lc_Color_aux_4_normal: var(--lc_Color_aux_4_normal, #fea22b);
+// 悬浮
+$lc_Color_aux_4_hover: var(--lc_Color_aux_4_hover, #feab41);
+// 点击
+$lc_Color_aux_4_click: var(--lc_Color_aux_4_click, #e49127);
+// 禁用
+$lc_Color_aux_4_disable: var(--lc_Color_aux_4_disable, #ffecd5);
+// 浅色背景
+$lc_Color_aux_4_lb: var(--lc_Color_aux_4_lb, #fffaf4);
+
+// 正常
+$lc_Color_aux_5_normal: var(--lc_Color_aux_5_normal, #2cc48c);
+// 悬浮
+$lc_Color_aux_5_hover: var(--lc_Color_aux_5_hover, #50c17c);
+// 点击
+$lc_Color_aux_5_click: var(--lc_Color_aux_5_click, #28b07e);
+// 禁用
+$lc_Color_aux_5_disable: var(--lc_Color_aux_5_disable, #d5f3e8);
+// 浅色背景
+$lc_Color_aux_5_lb: var(--lc_Color_aux_5_lb, #f4fcf9);
+
+// 正常
+$lc_Color_aux_6_normal: var(--lc_Color_aux_6_normal, #149fec);
+// 悬浮
+$lc_Color_aux_6_hover: var(--lc_Color_aux_6_hover, #2ca9ee);
+// 点击
+$lc_Color_aux_6_click: var(--lc_Color_aux_6_click, #128fd4);
+// 禁用
+$lc_Color_aux_6_disable: var(--lc_Color_aux_6_disable, #d0ecfb);
+// 浅色背景
+$lc_Color_aux_6_lb: var(--lc_Color_aux_6_lb, #f3fafe);
+
+// 正常
+$lc_Color_aux_7_normal: var(--lc_Color_aux_7_normal, #8146e6);
+// 悬浮
+$lc_Color_aux_7_hover: var(--lc_Color_aux_7_hover, #8e59e9);
+// 点击
+$lc_Color_aux_7_click: var(--lc_Color_aux_7_click, #743fcf);
+// 禁用
+$lc_Color_aux_7_disable: var(--lc_Color_aux_7_disable, #e6dafa);
+// 浅色背景
+$lc_Color_aux_7_lb: var(--lc_Color_aux_7_lb, #f9f6fe);
+
+// 正常
+$lc_Color_aux_8_normal: var(--lc_Color_aux_8_normal, #f474ba);
+// 悬浮
+$lc_Color_aux_8_hover: var(--lc_Color_aux_8_hover, #f582c1);
+// 点击
+$lc_Color_aux_8_click: var(--lc_Color_aux_8_click, #f582c1);
+// 禁用
+$lc_Color_aux_8_disable: var(--lc_Color_aux_8_disable, #f582c1);
+// 浅色背景
+$lc_Color_aux_8_lb: var(--lc_Color_aux_8_lb, #fef8fb);
+
+/**
+  * ==================================================
+  * 背景色 BACKGROUND COLOR
+  * ==================================================
+  */
+// 垂直导航背景色
+$lc_Color_background_d1: var(--lc_Color_background_d1, #0273b0);
+// 垂直导航悬停颜色
+$lc_Color_background_d2: var(--lc_Color_background_d2, #4072f8);
+// 标准导航背景色
+$lc_Color_background_d3: var(--lc_Color_background_d3, #2748c3);
+// 垂直导航背景色
+$lc_Color_background_d4: var(--lc_Color_background_d4, #eaeefd);
+// 垂直导航背景色
+$lc_Color_background_d5: var(--lc_Color_background_d5, #f6f8fb);
+
+/**
+  * ==================================================
+  * 链接色 LINK COLOR
+  * ==================================================
+  */
+// 常规
+$lc_Color_link_normal: var(--lc_Color_link_normal, #0273b0);
+// 悬浮
+$lc_Color_link_hover: var(--lc_Color_link_hover, #466bf5);
+// 点击
+$lc_Color_link_click: var(--lc_Color_link_click, #2c52dc);
+// 禁用
+$lc_Color_link_disable: var(--lc_Color_link_disable, #d6defd);
+
+/**
+  * ==================================================
+  * 标签色 TAG COLOR
+  * ==================================================
+  */
+// 正常,待开始,警告提示,warming
+$lc_Color_tag1_normal: var(--lc_Color_tag1_normal, #ee8049);
+// 正常,进行中,进行中，info
+$lc_Color_tag2_normal: var(--lc_Color_tag2_normal, #0273b0);
+// 正常,成功,success
+$lc_Color_tag3_normal: var(--lc_Color_tag3_normal, #2cc48c);
+// 正常,失败,错提示 error
+$lc_Color_tag4_normal: var(--lc_Color_tag4_normal, #149fec);
+// 正常,禁用 disable
+$lc_Color_tag5_normal: var(--lc_Color_tag5_normal, #8146e6);
+
+// 悬浮,待开始
+$lc_Color_tag1_hover: var(--lc_Color_tag1_hover, #f08d5b);
+// 悬浮,进行中
+$lc_Color_tag2_hover: var(--lc_Color_tag2_hover, #466bf5);
+// 悬浮,成功
+$lc_Color_tag3_hover: var(--lc_Color_tag3_hover, #50c17c);
+// 悬浮,失败
+$lc_Color_tag4_hover: var(--lc_Color_tag4_hover, #2ca9ee);
+// 悬浮,禁用
+$lc_Color_tag5_hover: var(--lc_Color_tag5_hover, #8e59e9);
+
+// 点击,待开始
+$lc_Color_tag1_click: var(--lc_Color_tag1_click, #d67342);
+// 点击,进行中
+$lc_Color_tag2_click: var(--lc_Color_tag2_click, #2c52dc);
+// 点击,成功
+$lc_Color_tag3_click: var(--lc_Color_tag3_click, #28b07e);
+// 点击,失败
+$lc_Color_tag4_click: var(--lc_Color_tag4_click, #128fd4);
+// 点击,禁用
+$lc_Color_tag5_click: var(--lc_Color_tag5_click, #743fcf);
+
+// 浅色背景,待开始
+$lc_Color_tag1_lb: var(--lc_Color_tag1_lb, #fdf2ec);
+// 浅色背景,进行中
+$lc_Color_tag2_lb: var(--lc_Color_tag2_lb, #eaeefe);
+// 浅色背景,成功
+$lc_Color_tag3_lb: var(--lc_Color_tag3_lb, #e9f9f3);
+// 浅色背景,失败
+$lc_Color_tag4_lb: var(--lc_Color_tag4_lb, #e7f5fd);
+// 浅色背景,禁用
+$lc_Color_tag5_lb: var(--lc_Color_tag5_lb, #e6dafa);
+
+/**
+  * ==================================================
+  * 图标尺寸 ICON
+  * ==================================================
+  */
+$lc_Icon_size_xxxs: 4 * $lc_Hd;
+$lc_Icon_size_xxs: 5 * $lc_Hd;
+$lc_Icon_size_xs: 6 * $lc_Hd;
+$lc_Icon_size_sm: 8 * $lc_Hd;
+$lc_Icon_size_md: 10 * $lc_Hd;
+$lc_Icon_size_lg: 12 * $lc_Hd;
+$lc_Icon_size_xl: 16 * $lc_Hd;
+
+/**
+  * ==================================================
+  * 圆角 RADIUS
+  * ==================================================
+  */
+$lc_Radius_xs: $lc_Hd;
+$lc_Radius_sm: 2 * $lc_Hd;
+$lc_Radius_badge: 2 * $lc_Hd;
+$lc_Radius_md: 4 * $lc_Hd;
+$lc_Radius_lg: 8 * $lc_Hd;
+$lc_Radius_circle: 999px;
+$lcRadius_default: $lc_Hd;
+
+.lc_Radius_default {
+  border-radius: $lcRadius_default;
+}
+.lc_Radius_xs {
+  border-radius: $lc_Radius_xs;
+}
+
+.lc_Radius_sm {
+  border-radius: $lc_Radius_sm;
+}
+
+.lc_Radius_badge {
+  border-radius: $lc_Radius_badge;
+}
+
+.lc_Radius_md {
+  border-radius: $lc_Radius_md;
+}
+
+.lc_Radius_lg {
+  border-radius: $lc_Radius_lg;
+}
+
+.lc_Radius_circle {
+  border-radius: $lc_Radius_circle;
+}
+
+/**
+  * ==================================================
+  * 分隔线 Divider
+  * ==================================================
+  */
+.lc_Divider_xs {
+  display: inline-block;
+  width: 1px;
+  height: 12px;
+  background-color: $lc_Color_neutral_6;
+}
+
+.lc_Divider_sm {
+  display: inline-block;
+  width: 1px;
+  height: 14px;
+  background-color: $lc_Color_neutral_6;
+}
+
+.lc_Divider_md {
+  display: inline-block;
+  width: 1px;
+  height: 16px;
+  background-color: $lc_Color_neutral_6;
+}
+
+.lc_Divider_lg {
+  display: inline-block;
+  width: 1px;
+  height: 20px;
+  background-color: $lc_Color_neutral_6;
+}
+
+/**
+  * ==================================================
+  * 圆点 CIRCLE
+  * ==================================================
+  */
+.lc_Circle_xs {
+  width: 3 * $lc_Hd;
+  height: 3 * $lc_Hd;
+  border-radius: 50%;
+  background-color: $lc_Color_brand_normal;
+}
+
+.lc_Circle_sm {
+  width: 4 * $lc_Hd;
+  height: 4 * $lc_Hd;
+  border-radius: 50%;
+  background-color: $lc_Color_brand_normal;
+}
+
+.lc_Circle_badge {
+  width: 3 * $lc_Hd;
+  height: 3 * $lc_Hd;
+  border-radius: 50%;
+  background-color: $lc_Color_brand_normal;
+  border: solid 1px $lc_Color_neutral_8;
+}
+
+/**
+  * ==================================================
+  * 投影 SHADOW
+  * ==================================================
+  */
+// 常见的投影色
+$lc_Color_shadow_1: var(--lc_Color_shadow_1, rgba(0, 0, 0, 0.08));
+// 更深的投影色
+$lc_Color_shadow_2: var(--lc_Color_shadow_2, rgba(0, 0, 0, 0.16));
+// 浅色投影色
+$lc_Color_shadow_3: var(--lc_Color_shadow_3, rgba(0, 0, 0, 0.04));
+
+.lc_Shadow_click {
+  box-shadow: 0px 0px 0px 2px rgba(52, 91, 244, 0.2);
+}
+
+.lc_Shadow_float_L {
+  box-shadow: -4px 0px 8px 0px $lc_Color_shadow_1;
+}
+
+.lc_Shadow_float_R {
+  box-shadow: 4px 0px 8px 0px $lc_Color_shadow_1;
+}
+
+.lc_Shadow_float_D {
+  box-shadow: 0px 4px 8px 0px $lc_Color_shadow_1;
+}
+
+.lc_Shadow_card {
+  box-shadow: 0px 3px 6px 0px $lc_Color_shadow_3;
+}
+
+.lc_Shadow_popover_1 {
+  box-shadow: 0px 4px 16px 0px $lc_Color_shadow_1;
+}
+
+.lc_Shadow_popover_2 {
+  box-shadow: 0px 4px 16px 0px $lc_Color_shadow_2;
+}
+
+/**
+  * ==================================================
+  * 字体 Font
+  * ==================================================
+  */
+// 标签大小
+.lc_Font_tag_12h {
+  font-size: 12px;
+  line-height: 12px;
+}
+
+// 提示副文本
+.lc_Font_aux_12 {
+  font-size: 12px;
+  line-height: 20px;
+}
+
+// 正文常规-sm
+.lc_Font_text_12 {
+  font-size: 12px;
+  line-height: 20px;
+}
+// 正文常规
+.lc_Font_text_14 {
+  font-size: 14px;
+  line-height: 22px;
+}
+
+// 标题
+.lc_Font_h5_16 {
+  font-size: 16px;
+  line-height: 24px;
+}
+
+// 标题
+.lc_Font_h4_18 {
+  font-size: 18px;
+  line-height: 26px;
+}
+
+// 标题
+.lc_Font_h3_20 {
+  font-size: 20px;
+  line-height: 28px;
+}
+
+// 标题
+.lc_Font_h2_24 {
+  font-size: 24px;
+  line-height: 32px;
+}
+
+// 标题
+.lc_Font_h1_32 {
+  font-size: 32px;
+  line-height: 40px;
+}
+
+// 运营标题
+.lc_Font_t4_36 {
+  font-size: 36px;
+  line-height: 44px;
+}
+
+// 运营标题
+.lc_Font_t3_40 {
+  font-size: 40px;
+  line-height: 48px;
+}
+
+// 运营标题
+.lc_Font_t2_48 {
+  font-size: 48px;
+  line-height: 56px;
+}
+
+// 运营标题
+.lc_Font_t1_56 {
+  font-size: 56px;
+  line-height: 64px;
+}
+
+.ant-btn-sm {
+  @extend .lc_Font_text_12;
+  padding: 0px 7px;
+  line-height: 20px;
+  height: 24px;
+}

package/types/Action.d.ts

@@ -0,0 +1,43 @@
+/*
+ * @Date: 2023-03-24 18:07:50
+ * @description:
+ * @author chenchangfu
+ * Copyright (c) 2019, AUTHOR. All rights reserved.
+ * AUTHOR PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
+ */
+import { ButtonProps } from "antd";
+import { requestParam } from "../types/utils";
+type actionType = "jump" | "request" | "action" | "icon" | "postMsg";
+type ActionType = {
+  /* 按钮操作类型 */
+  actionType?: actionType = "action";
+  /* actionType：jump类型跳转地址*/
+  jumpUrl?: string;
+  /* actionType：request类型请求参数 */
+  requestParams?: requestParam;
+  /* 配合上下对标记按钮 */
+  actionKey?: string;
+  /* 执行点击事件后回调 */
+  callback?: Function;
+
+  /* 按钮类型为icon 时生效 */
+  iconSize?: number;
+  /* 当actionType是postMsg */
+  msg?: Record<string, any>;
+  /* name actionType 等于icon 的时候生效，指icon 名称 */
+  name?: string;
+
+  /* 数据清楚操作 */
+  clear?: clear;
+} & ButtonProps;
+
+type clear = {
+  localStorage?: string[];
+  data: ?string[];
+};
+type msg = {
+  /* type 支撑 jump */
+  type: string;
+  data: string;
+};
+export { ActionType, clear };