zkqh-lagrange-utils 0.0.12 → 0.0.14

package/dist/assets/css/common/button.less

@@ -1,48 +1,80 @@
-@import "./color.less";
-// 取消按钮
-.lp_bt_cancel() {
-    background: @lc_btn_cancel_bg;
-    border: @lc_btn_cancel_border;
-    color: @lc_btn_cancel_color;
-}
-
-// 确认按钮
-.lp_bt_confirm() {
-    border: @lc_btn_primary_border;
-    color: @lc_btn_primary_color;
-    background: @lc_btn_primary_bg;
-}
-
-// 确认按钮1
-.lp_bt_confirm1() {
-    border: @lc_btn_primary_border1;
-    color: @lc_btn_primary_color1;
-    background: @lc_btn_primary_bg1;
-}
-
-// 确认按钮2
-.lp_bt_confirm2() {
-    border: @lc_btn_primary_border2;
-    color: @lc_btn_primary_color2;
-    background: @lc_btn_primary_bg2;
-}
-
-// 中等按钮
-.lp_bt_medium() {
-    height: 30px;
-    line-height: 30px;
-    cursor: pointer;
-    border-radius: @lc_br_4;
-    font-size: 14px;
-}
-
-// 小按钮
-.lp_bt_small() {
-    height: 22px;
-    line-height: 22px;
-    cursor: pointer;
-    border-radius: @lc_br_4;
-    font-size: 12px;
-}
-
-
+@import "./color.less";
+@import "./mixins.less";
+
+// =============================================================================
+// Buttons / 按钮
+// =============================================================================
+
+// -----------------------------------------------------------------------------
+// Mixins (Style Definitions) / 混合宏（样式定义）
+// -----------------------------------------------------------------------------
+
+// Size Mixins / 尺寸混合宏
+.lc-btn-size-s() {
+    height: 22px;
+    line-height: 22px;
+    font-size: @lc_font_size_s;
+    border-radius: @lc_br_4;
+    cursor: pointer;
+    text-align: center;
+}
+
+.lc-btn-size-m() {
+    height: 30px;
+    line-height: 30px;
+    font-size: @lc_font_size_m;
+    border-radius: @lc_br_4;
+    cursor: pointer;
+    text-align: center;
+}
+
+// Type Mixins / 类型混合宏
+.lc-btn-primary() {
+    background: @lc_btn_primary_bg;
+    border: @lc_btn_primary_border;
+    color: @lc_btn_primary_color;
+    
+    &:hover {
+        background: @lc_color_brand_hover;
+        border-color: @lc_color_brand_hover;
+    }
+}
+
+.lc-btn-cancel() {
+    background: @lc_btn_cancel_bg;
+    border: @lc_btn_cancel_border;
+    color: @lc_btn_cancel_color;
+    
+    &:hover {
+        background: rgba(255, 255, 255, 0.12);
+        color: #fff;
+    }
+}
+
+// Variants (Backward Compatibility) / 变体（兼容旧设计）
+.lc-btn-primary-v1() {
+    background: @lc_btn_primary_bg1;
+    border: @lc_btn_primary_border1;
+    color: @lc_btn_primary_color1;
+}
+
+.lc-btn-primary-v2() {
+    background: @lc_btn_primary_bg2;
+    border: @lc_btn_primary_border2;
+    color: @lc_btn_primary_color2;
+}
+
+
+// -----------------------------------------------------------------------------
+// Utility Classes / 工具类
+// -----------------------------------------------------------------------------
+
+// Sizes
+.lc-btn-s { .lc-btn-size-s(); }
+.lc-btn-m { .lc-btn-size-m(); }
+
+// Types
+.lc-btn-primary { .lc-btn-primary(); }
+.lc-btn-cancel { .lc-btn-cancel(); }
+.lc-btn-primary-v1 { .lc-btn-primary-v1(); }
+.lc-btn-primary-v2 { .lc-btn-primary-v2(); }

package/dist/assets/css/common/color.less

@@ -1,72 +1,284 @@
-// lc_变量定义（统一色值与渐变，便于跨项目维护）
-@lc_font_color1: #adc9e9;
-@lc_font_color2: #d5eaf8;
-@lc_font_color4: #a3afc2;
-@lc_font_color5: #64adff;
-@lc_font_color6: #f5f9ffa6;
-@lc_font_color7: #177edc;
-@lc_font_color8: #177ddc;
-@lc_font_color9: #14487b;
-@lc_font_color10: #dcdcdc;
-@home_font_base: #177ddc;
-@home_font_link: #177edc;
-@home_font_success: #73cd75;
-@home_font_wait: #f0b76c;
-@home_font_error: #db3f3f;
-
-@lc_fc_base: #ffffff;
-@lc_fc_main_title: #177edc;
-@lc_fc_main: #d5eaf8;
-
-@lc_border_base: 1px solid rgba(199, 199, 199, 0.493);
-@lc_border_base1: 1px solid #37698d;
-
-@lc_shadow_base: 0 2px 8px rgba(0, 0, 0, 0.507);
-@lc_shadow_icon: 0 0 4px rgba(255, 255, 255, 0.47), 0 0 10px rgba(129, 161, 186, 0.3);
-@lc_shadow_icon1: 0 0 6px rgba(203, 223, 255, 0.14);
-@lc_shadow_icon2: 1px 2px 0px rgba(17, 20, 22, 0.22);
-@lc_shadow_icon3: 0 2px 5px #000000;
-
-@lc_gradient_base: linear-gradient(#ffffff, #acddff);
-@lc_gradient_unread: linear-gradient(#ff9b9b, #db3f3f);
-@lc_gradient_unprocessed: linear-gradient(#f8cc92, #faad14);
-@lc_gradient_processing: linear-gradient(#31afff, #1677ff);
-@lc_gradient_processed: linear-gradient(#afffb1, #73cd75);
-@lc_gradient_ignored: linear-gradient(#9fa7b6, #7c8097);
-@lc_gradient_unknown: linear-gradient(#96a9c4, #5d7092);
-@lc_gradient_warning: linear-gradient(#ffddb0, #f0b76c);
-@lc_gradient_notice: linear-gradient(#b7cdff, #4b79e3);
-@lc_gradient_icon: linear-gradient(152deg, #81a1ba, #ffffff 20%, #81a1ba 40%, #ffffff 60%, #81a1ba 80%, #ffffff);
-@lc_gradient_offline: linear-gradient(#e5effc, #c6c4c4);
-@lc_gradient_background1: linear-gradient(to bottom, #1d496d 0%, #1e3549 100%);
-
-@lc_br_2: 2px;
-@lc_br_4: 4px;
-@lc_br_6: 6px;
-@lc_br_8: 8px;
-@lc_br_10: 10px;
-@lc_br_16: 16px;
-@lc_br_percent_50: 50%;
-
-@lc_btn_cancel_bg: rgba(255, 255, 255, 0.08);
-@lc_btn_cancel_border: 1px solid rgba(255, 255, 255, 0.2);
-@lc_btn_cancel_color: rgba(245, 249, 255, 0.65);
-
-@lc_btn_primary_bg: #177ddc;
-@lc_btn_primary_border: 1px solid #177ddc;
-@lc_btn_primary_color: #d5eaf8;
-
-@lc_btn_primary_bg1: #164eda;
-@lc_btn_primary_border1: 1px solid #164eda;
-@lc_btn_primary_color1: #d5eaf8;
-
-@lc_btn_primary_bg2: #1261e3;
-@lc_btn_primary_border2: 1px solid #1261e3;
-@lc_btn_primary_color2: #d5eaf8;
-
-@lc_scroll_thumb_bg: #2a96cd;
-@lc_scroll_thumb_hover_bg: #26a2e0;
-@lc_scroll_track_bg: #082f50;
-
-@lc_gradient_table_activate: linear-gradient(#76c8ff, #3498db);
-@lc_gradient_table_unactivate: linear-gradient(#a7b7b8, #95a5a6);
+// =============================================================================
+// Design Tokens / 设计变量
+// =============================================================================
+
+// -----------------------------------------------------------------------------
+// Palette: Brand & Functional Colors / 品牌与功能色
+// -----------------------------------------------------------------------------
+@lc_color_brand_primary: #177ddc;         // 品牌主色
+@lc_color_brand_hover:   #1677FF;         // 品牌辅助色
+
+@lc_color_success:       #52C41A;         // 成功色 (基础参考)
+@lc_color_warning:       #FFC53D;         // 警告色 (基础参考)
+@lc_color_error:         #FF4D4F;         // 错误色
+@lc_color_info:          #1677FF;         // 信息色 (基础参考)
+@lc_state_offline:       #c6c4c4;         // 离线色
+@lc_state_ignored:       #607395;         // 忽略色
+
+// -----------------------------------------------------------------------------
+// Typography / 排版
+// -----------------------------------------------------------------------------
+// Font Colors
+@lc_text_color_primary:   #d5eaf8;        // 主要文字
+@lc_text_color_secondary: #adc9e9;        // 次要文字
+@lc_text_color_inverse:   #ffffff;        // 反色文字
+
+// Font Sizes
+@lc_font_size_s:  12px;                   // 小号字体
+@lc_font_size_m:  14px;                   // 标准字体
+@lc_font_size_l:  16px;                   // 中号字体
+@lc_font_size_xl: 22px;                   // 大号字体
+
+// -----------------------------------------------------------------------------
+// Icons / 图标
+// -----------------------------------------------------------------------------
+@lc_icon_color_normal: #fafdff;           // 图标默认色
+@lc_icon_color_active: #2cb7ff;           // 图标激活/悬停色
+
+// -----------------------------------------------------------------------------
+// Backgrounds / 背景
+// -----------------------------------------------------------------------------
+@lc_bg_nav_gradient:        linear-gradient(#07243e, #092e4f); // 导航栏背景
+@lc_bg_modal:               #0a1d2c;      // 弹窗背景
+@lc_bg_popover:             #0d273c;      // Popover背景
+@lc_bg_card_base:           #1c3450;      // 卡片/枚举基础背景
+@lc_bg_overlay_title:       #000000b0;    // 3D视图标题背景
+@lc_bg_mask:                rgba(0, 0, 0, 0.5); // 遮罩背景
+
+// List / Table
+@lc_bg_list_unread:         #14232d;      // 列表未读
+@lc_bg_list_read_start:     #173b4e;      // 列表已读渐变始
+@lc_bg_list_read_end:       #122a3b;      // 列表已读渐变终
+@lc_bg_table_header:        #15365B;      // 表格表头
+@lc_bg_table_body:          rgba(31, 46, 73, 0.55); // 表格主体
+
+@lc_home_bg_event_unread: @lc_bg_list_unread;           // 首页右侧栏 event 枚举项 未读背景色
+@lc_home_bg_event_read_start: @lc_bg_list_read_start;       // 首页右侧栏 event 枚举项 已读起始背景色
+@lc_home_bg_event_read_end: @lc_bg_list_read_end;         // 首页右侧栏 event 枚举项 已读结束背景色
+
+@lc_home_bg_panel_start: @lc_bg_panel_gradient_start;  // 单机组告警 左侧 机组详情 起始 背景色
+@lc_home_bg_panel_end: @lc_bg_panel_gradient_end;    // 单机组告警 左侧 机组详情 结束 背景色
+
+@lc_home_bg_icon_collapse: @lc_bg_icon_collapse;         // 首页 左右侧边栏 收缩图标背景色
+@lc_home_bg_mask_dark: @lc_bg_mask;                  // 1.自定义弹窗 背景色 遮罩 2.应用商城 des 背景色
+@lc_home_bg_table_header: @lc_bg_table_header;          // 自定义弹窗 表格 表头背景色
+@lc_home_bg_table_body: @lc_bg_table_body;            // 表格 表主体背景色 故障录播 表格主背景色
+
+@lc_home_bg_3d_title:  @lc_bg_overlay_title;    // 3d视图 机组 title 背景色
+
+// Panel Gradients
+@lc_bg_panel_gradient_start: #0c2946;     // 单机组面板渐变始
+@lc_bg_panel_gradient_end:   rgba(12, 41, 70, 0); // 单机组面板渐变终
+@lc_bg_icon_collapse:        #101a23;     // 收缩图标背景
+
+// -----------------------------------------------------------------------------
+// Buttons / 按钮
+// -----------------------------------------------------------------------------
+@lc_btn_bg_cancel:       rgba(255, 255, 255, 0.08);              // 取消按钮背景
+@lc_btn_border_cancel:   1px solid rgba(255, 255, 255, 0.2);     // 取消按钮边框
+@lc_btn_cancel_bg:       @lc_btn_bg_cancel;                      // 取消按钮背景（别名）
+@lc_btn_cancel_border:   @lc_btn_border_cancel;                  // 取消按钮边框（别名）
+@lc_btn_cancel_color:    rgba(245, 249, 255, 0.65);              // 取消按钮文字颜色
+
+@lc_btn_primary_bg:      #177ddc;                                // 主按钮背景
+@lc_btn_primary_border:  1px solid #177ddc;                      // 主按钮边框
+@lc_btn_primary_color:   #d5eaf8;                                // 主按钮文字
+
+@lc_btn_primary_bg1:     #164eda;                                // 主按钮变体1背景
+@lc_btn_primary_border1: 1px solid #164eda;                      // 主按钮变体1边框
+@lc_btn_primary_color1:  #d5eaf8;                                // 主按钮变体1文字
+
+@lc_btn_primary_bg2:     #1261e3;                                // 主按钮变体2背景
+@lc_btn_primary_border2: 1px solid #1261e3;                      // 主按钮变体2边框
+@lc_btn_primary_color2:  #d5eaf8;                                // 主按钮变体2文字
+
+// -----------------------------------------------------------------------------
+// Borders / 边框
+// -----------------------------------------------------------------------------
+@lc_border_nav_bottom:   1px solid rgba(199, 199, 199, 0.493); // 导航下边框
+@lc_border_framework:    rgba(60, 68, 72, 0.68);  // 框架级边框
+@lc_border_panel_inner:  #1e2d34;                 // 面板内部边框
+@lc_border_panel_active: #46aeff;                 // 激活态边框
+@lc_border_table:        rgba(122, 159, 224, 0.10); // 表格边框
+
+@lc_home_border_nav_bottom:   @lc_border_nav_bottom; // 导航栏下边框线
+@lc_home_border_table: @lc_border_table;      // 表格边框色
+
+// -----------------------------------------------------------------------------
+// Scroller / 滚动条
+// -----------------------------------------------------------------------------
+@lc_scroll_track_bg:       #082f50; // 滚动条轨道
+@lc_scroll_thumb_bg:       #2a96cd; // 滚动块背景
+@lc_scroll_thumb_hover_bg: #26a2e0; // 滚动块悬停背景
+
+// -----------------------------------------------------------------------------
+// Shadows / 阴影
+// -----------------------------------------------------------------------------
+@lc_shadow_nav:         0 2px 8px rgba(0, 0, 0, 0.507); // 导航阴影
+@lc_shadow_panel_left:  20px 20px 29px rgba(9, 21, 32, 0.52); // 左面板阴影
+@lc_shadow_panel_right: -20px 0 29px rgba(9, 21, 32, 0.52); // 右面板阴影
+@lc_shadow_text_icon:   1px 2px 0px rgba(17, 20, 22, 0.22); // 文字/图标阴影
+@lc_shadow_card:        0 5px 12px #000000b0; // 卡片阴影
+@lc_shadow_icon1:       0 0 6px rgba(203, 223, 255, 0.14); // 图标内发光1
+
+@lc_home_shadow_panel_left:  @lc_shadow_panel_left;   // 左侧边栏阴影
+@lc_home_shadow_panel_right:  @lc_shadow_panel_right;  // 右侧边栏阴影
+@lc_home_shadow_sidebar_text:   @lc_shadow_text_icon;    // 左侧边栏 风场应用数量文字 阴影效果
+
+
+// -----------------------------------------------------------------------------
+// Gradients / 渐变
+// -----------------------------------------------------------------------------
+// Base & Status
+@lc_gradient_success:    linear-gradient(#8AE438, #52C41A); // 正常/成功
+@lc_gradient_base:        linear-gradient(#ffffff, #acddff); // 基础文字渐变
+@lc_gradient_unread:      linear-gradient(#ff9b9b, #db3f3f); // 未读/报警
+@lc_gradient_unprocessed: linear-gradient(#f8cc92, #faad14); // 未处理
+@lc_gradient_processing:  linear-gradient(#31AFFF, #1677FF); // 处理中/信息
+@lc_gradient_processed:   linear-gradient(#afffb1, #73cd75); // 已处理/成功
+@lc_gradient_ignored:     linear-gradient(#9fa7b6, #7c8097); // 忽略
+@lc_gradient_unknown:     linear-gradient(#96a9c4, #5d7092); // 未知
+@lc_gradient_warning:     linear-gradient(#FFE470, #FFC53D); // 警告/预警
+@lc_gradient_notice:      linear-gradient(#b7cdff, #4b79e3); // 通知
+@lc_gradient_icon:        linear-gradient(152deg, #81a1ba, #ffffff 20%, #81a1ba 40%, #ffffff 60%, #81a1ba 80%, #ffffff); // 图标渐变
+@lc_gradient_offline:     linear-gradient(#e5effc, #c6c4c4); // 离线
+
+// Text
+@lc_gradient_text_primary: linear-gradient(#fff, #acddff); // 主要文字渐变
+
+// Components
+@lc_gradient_chart_bg:    linear-gradient(rgba(14, 27, 36, 0.95), #0a1219); // 图表背景
+@lc_gradient_legend_bg:   linear-gradient(#091d2e, #0c2a42); // 图例背景
+@lc_gradient_nav_active:  linear-gradient(to right, #33B4F0, #177ddc); // 导航选中
+@lc_gradient_panel_bg:    linear-gradient(to top, rgba(44, 106, 233, 0.12), rgba(44, 106, 233, 0)); // 面板背景
+@lc_gradient_divider:     linear-gradient(to bottom, rgba(241, 249, 255, 0) 20%, rgba(241, 249, 255, 0.5) 50%, rgba(241, 249, 255, 0) 80%); // 分割线
+@lc_gradient_background1: linear-gradient(to bottom, #1d496d 0%, #1e3549 100%); // 背景渐变1
+
+@lc_home_gradient_divider:   @lc_gradient_divider;    // 故障详情 竖向分割线 / 导航栏右上角分割线
+@lc_home_gradient_chart_bg:  @lc_gradient_chart_bg;   // 分析页 图表背景颜色 框架级别模块背景色 包括首页左右两侧
+@lc_home_gradient_legend_bg:   @lc_gradient_legend_bg;  // 分析页 图表 legend 背景颜色
+@lc_home_gradient_nav_active:   @lc_gradient_nav_active; // 导航栏 nav 选中底部效果
+@lc_home_gradient_panel_bg:  @lc_gradient_panel_bg;   // 单机组 背景渐变
+
+// Masks
+@lc_mask_radial: radial-gradient(circle at center, rgb(0, 0, 0) 15%, #0000005e 70%); // 径向遮罩
+
+// 渐变遮罩
+@lc_home_mask_radial: @lc_mask_radial; // 渐变遮罩（首页/分析页通用）
+
+// -----------------------------------------------------------------------------
+// Radius / 圆角
+// -----------------------------------------------------------------------------
+@lc_br_2: 2px;   // 圆角-2
+@lc_br_4: 4px;   // 圆角-4
+@lc_br_6: 6px;   // 圆角-6
+@lc_br_8: 8px;   // 圆角-8
+@lc_br_10: 10px; // 圆角-10
+@lc_br_16: 16px; // 圆角-16
+
+
+:root {
+  /* Palette / 颜色 */
+  --lc_color_brand_primary: @lc_color_brand_primary;
+  --lc_color_brand_hover: @lc_color_brand_hover;
+  --lc_color_success: @lc_color_success;
+  --lc_color_warning: @lc_color_warning;
+  --lc_color_error: @lc_color_error;
+  --lc_color_info: @lc_color_info;
+
+  /* Typography / 排版 */
+  --lc_text_color_primary: @lc_text_color_primary;
+  --lc_text_color_secondary: @lc_text_color_secondary;
+  --lc_font_size_s: @lc_font_size_s;
+  --lc_font_size_m: @lc_font_size_m;
+  --lc_font_size_l: @lc_font_size_l;
+  --lc_font_size_xl: @lc_font_size_xl;
+
+  /* Icons / 图标 */
+  --lc_icon_color_normal: @lc_icon_color_normal;
+  --lc_icon_color_active: @lc_icon_color_active;
+
+  /* Backgrounds / 背景 */
+  --lc_bg_nav_gradient: @lc_bg_nav_gradient;
+  --lc_bg_modal: @lc_bg_modal;
+  --lc_bg_popover: @lc_bg_popover;
+  --lc_bg_card_base: @lc_bg_card_base;
+  --lc_bg_overlay_title: @lc_bg_overlay_title;
+  --lc_bg_mask: @lc_bg_mask;
+  --lc_bg_list_unread: @lc_bg_list_unread;
+  --lc_bg_list_read_start: @lc_bg_list_read_start;
+  --lc_bg_list_read_end: @lc_bg_list_read_end;
+  --lc_bg_table_header: @lc_bg_table_header;
+  --lc_bg_table_body: @lc_bg_table_body;
+  --lc_bg_panel_gradient_start: @lc_bg_panel_gradient_start;
+  --lc_bg_panel_gradient_end: @lc_bg_panel_gradient_end;
+  --lc_bg_icon_collapse: @lc_bg_icon_collapse;
+
+  /* Buttons / 按钮 */
+  --lc_btn_bg_cancel: @lc_btn_bg_cancel;
+  --lc_btn_border_cancel: @lc_btn_border_cancel;
+  --lc_btn_cancel_bg: @lc_btn_cancel_bg;
+  --lc_btn_cancel_border: @lc_btn_cancel_border;
+  --lc_btn_cancel_color: @lc_btn_cancel_color;
+
+  --lc_btn_primary_bg: @lc_btn_primary_bg;
+  --lc_btn_primary_border: @lc_btn_primary_border;
+  --lc_btn_primary_color: @lc_btn_primary_color;
+  --lc_btn_primary_bg1: @lc_btn_primary_bg1;
+  --lc_btn_primary_border1: @lc_btn_primary_border1;
+  --lc_btn_primary_color1: @lc_btn_primary_color1;
+  --lc_btn_primary_bg2: @lc_btn_primary_bg2;
+  --lc_btn_primary_border2: @lc_btn_primary_border2;
+  --lc_btn_primary_color2: @lc_btn_primary_color2;
+
+  /* Borders / 边框 */
+  --lc_border_nav_bottom: @lc_border_nav_bottom;
+  --lc_border_framework: @lc_border_framework;
+  --lc_border_panel_inner: @lc_border_panel_inner;
+  --lc_border_panel_active: @lc_border_panel_active;
+  --lc_border_table: @lc_border_table;
+
+  /* Scroller / 滚动条 */
+  --lc_scroll_track_bg: @lc_scroll_track_bg;
+  --lc_scroll_thumb_bg: @lc_scroll_thumb_bg;
+  --lc_scroll_thumb_hover_bg: @lc_scroll_thumb_hover_bg;
+
+  /* Shadows / 阴影 */
+  --lc_shadow_nav: @lc_shadow_nav;
+  --lc_shadow_panel_left: @lc_shadow_panel_left;
+  --lc_shadow_panel_right: @lc_shadow_panel_right;
+  --lc_shadow_text_icon: @lc_shadow_text_icon;
+  --lc_shadow_card: @lc_shadow_card;
+  --lc_shadow_icon1: @lc_shadow_icon1;
+
+  /* Gradients / 渐变 */
+  --lc_gradient_base: @lc_gradient_base;
+  --lc_gradient_unread: @lc_gradient_unread;
+  --lc_gradient_unprocessed: @lc_gradient_unprocessed;
+  --lc_gradient_processing: @lc_gradient_processing;
+  --lc_gradient_processed: @lc_gradient_processed;
+  --lc_gradient_ignored: @lc_gradient_ignored;
+  --lc_gradient_unknown: @lc_gradient_unknown;
+  --lc_gradient_warning: @lc_gradient_warning;
+  --lc_gradient_notice: @lc_gradient_notice;
+  --lc_gradient_icon: @lc_gradient_icon;
+  --lc_gradient_offline: @lc_gradient_offline;
+  --lc_gradient_text_primary: @lc_gradient_text_primary;
+  --lc_gradient_chart_bg: @lc_gradient_chart_bg;
+  --lc_gradient_legend_bg: @lc_gradient_legend_bg;
+  --lc_gradient_nav_active: @lc_gradient_nav_active;
+  --lc_gradient_panel_bg: @lc_gradient_panel_bg;
+  --lc_gradient_divider: @lc_gradient_divider;
+  --lc_gradient_background1: @lc_gradient_background1;
+
+  /* Masks / 遮罩 */
+  --lc_mask_radial: @lc_mask_radial;
+
+  /* Radius / 圆角 */
+  --lc_br_2: @lc_br_2;
+  --lc_br_4: @lc_br_4;
+  --lc_br_6: @lc_br_6;
+  --lc_br_8: @lc_br_8;
+  --lc_br_10: @lc_br_10;
+  --lc_br_16: @lc_br_16;
+}

package/dist/assets/css/common/common.less

@@ -1,18 +1,6 @@
-@import "./color.less";
-// #region mixin
-
-
-// 边框线 入参为边框宽度和边框颜色
-.lc_border(@width, @color) {
-    border: @width solid @color;
-}
-
-
-// #endregion
-
-// #region 直接使用
-// 文字渐变 必须在背景色之后才可生效
-
-
-// #endregion
-
+@import "./mixins.less";
+
+// =============================================================================
+// Legacy Common / 旧版通用 (Compatibility Layer)
+// =============================================================================
+// 此文件主要用于兼容旧版 .lc_border 写法，建议直接使用 mixins.less 中的 .lc-border