zkqh-lagrange-utils 0.0.40 → 0.0.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,84 +1,49 @@
1
1
  @import "./color.less";
2
- @import "./mixins.less";
3
2
 
4
3
  // =============================================================================
5
4
  // Buttons / 按钮
6
5
  // =============================================================================
7
6
 
8
- // -----------------------------------------------------------------------------
9
- // Mixins (Style Definitions) / 混合宏(样式定义)
10
- // -----------------------------------------------------------------------------
11
-
12
- // Size Mixins / 尺寸混合宏
13
- .lc-btn-size-s() {
14
- display: inline-block;
15
- height: 22px;
16
- line-height: 22px;
17
- padding: 0 8px;
18
- font-size: @lc_font_size_m;
19
- border-radius: @lc_br_4;
20
- cursor: pointer;
21
- text-align: center;
22
- }
23
-
24
- .lc-btn-size-m() {
25
- display: inline-block;
26
- height: 30px;
27
- line-height: 30px;
28
- padding: 0 16px;
29
- font-size: @lc_font_size_m;
30
- border-radius: @lc_br_4;
31
- cursor: pointer;
32
- text-align: center;
7
+ // Sizes
8
+ .lc_btn_s {
9
+ display: inline-block;
10
+ height: 22px;
11
+ line-height: 22px;
12
+ padding: 0 8px;
13
+ font-size: @lc_font_size_m;
14
+ border-radius: @lc_br_4;
15
+ cursor: pointer;
16
+ text-align: center;
33
17
  }
34
-
35
- // Type Mixins / 类型混合宏
36
- .lc-btn-primary() {
37
- background: @lc_btn_primary_bg;
38
- border: @lc_btn_primary_border;
39
- color: @lc_btn_primary_color;
40
-
41
- &:hover {
42
- background: @lc_color_brand_hover;
43
- border-color: @lc_color_brand_hover;
44
- }
18
+ .lc_btn_m {
19
+ display: inline-block;
20
+ height: 30px;
21
+ line-height: 30px;
22
+ padding: 0 16px;
23
+ font-size: @lc_font_size_m;
24
+ border-radius: @lc_br_4;
25
+ cursor: pointer;
26
+ text-align: center;
45
27
  }
46
28
 
47
- .lc-btn-cancel() {
48
- background: @lc_btn_cancel_bg;
49
- border: @lc_btn_cancel_border;
50
- color: @lc_btn_cancel_color;
51
-
52
- &:hover {
53
- background: rgba(255, 255, 255, 0.12);
54
- color: #fff;
55
- }
29
+ // Types
30
+ .lc_btn_primary {
31
+ background: @lc_btn_primary_bg;
32
+ border: @lc_btn_primary_border;
33
+ color: @lc_btn_primary_color;
34
+
35
+ &:hover {
36
+ background: @lc_color_brand_hover;
37
+ border-color: @lc_color_brand_hover;
38
+ }
56
39
  }
57
-
58
- // Variants (Backward Compatibility) / 变体(兼容旧设计)
59
- .lc-btn-primary-v1() {
60
- background: @lc_btn_primary_bg1;
61
- border: @lc_btn_primary_border1;
62
- color: @lc_btn_primary_color1;
40
+ .lc_btn_cancel {
41
+ background: @lc_btn_cancel_bg;
42
+ border: @lc_btn_cancel_border;
43
+ color: @lc_btn_cancel_color;
44
+
45
+ &:hover {
46
+ background: rgba(255, 255, 255, 0.12);
47
+ color: #fff;
48
+ }
63
49
  }
64
-
65
- .lc-btn-primary-v2() {
66
- background: @lc_btn_primary_bg2;
67
- border: @lc_btn_primary_border2;
68
- color: @lc_btn_primary_color2;
69
- }
70
-
71
-
72
- // -----------------------------------------------------------------------------
73
- // Utility Classes / 工具类
74
- // -----------------------------------------------------------------------------
75
-
76
- // Sizes
77
- .lc-btn-s { .lc-btn-size-s(); }
78
- .lc-btn-m { .lc-btn-size-m(); }
79
-
80
- // Types
81
- .lc-btn-primary { .lc-btn-primary(); }
82
- .lc-btn-cancel { .lc-btn-cancel(); }
83
- .lc-btn-primary-v1 { .lc-btn-primary-v1(); }
84
- .lc-btn-primary-v2 { .lc-btn-primary-v2(); }
@@ -121,9 +121,6 @@
121
121
  @lc_gradient_notice: linear-gradient(#b7cdff, #4b79e3); // 通知
122
122
  @lc_gradient_offline: linear-gradient(#e5effc, #c6c4c4); // 离线
123
123
 
124
- // Text
125
- @lc_gradient_text_primary: linear-gradient(#fff, #acddff); // 主要文字渐变
126
-
127
124
  // Components
128
125
  @lc_gradient_chart_bg: linear-gradient(rgba(14, 27, 36, 0.95), #0a1219); // 图表背景
129
126
  @lc_gradient_legend_bg: linear-gradient(#091d2e, #0c2a42); // 图例背景
@@ -199,7 +196,6 @@
199
196
  --lc_btn_primary_color2: @lc_btn_primary_color2;
200
197
 
201
198
  /* Borders / 边框 */
202
- --lc_border_nav_bottom: @lc_border_nav_bottom;
203
199
  --lc_border_framework: @lc_border_framework;
204
200
  --lc_border_panel_inner: @lc_border_panel_inner;
205
201
  --lc_border_panel_active: @lc_border_panel_active;
@@ -229,7 +225,6 @@
229
225
  --lc_gradient_warning: @lc_gradient_warning;
230
226
  --lc_gradient_notice: @lc_gradient_notice;
231
227
  --lc_gradient_offline: @lc_gradient_offline;
232
- --lc_gradient_text_primary: @lc_gradient_text_primary;
233
228
  --lc_gradient_chart_bg: @lc_gradient_chart_bg;
234
229
  --lc_gradient_legend_bg: @lc_gradient_legend_bg;
235
230
  --lc_gradient_nav_active: @lc_gradient_nav_active;
@@ -1,3 +1,54 @@
1
- @import "./mixins.less";
1
+ // =============================================================================
2
+ // Utility Classes / 实用类
3
+ // =============================================================================
2
4
 
5
+ .lc_text_center {
6
+ text-align: center;
7
+ }
8
+ .lc_text_left {
9
+ text-align: left;
10
+ }
11
+ .lc_text_right {
12
+ text-align: right;
13
+ }
3
14
 
15
+ // -----------------------------------------------------------------------------
16
+ // Layout / 布局
17
+ // -----------------------------------------------------------------------------
18
+ .lc_flex {
19
+ display: flex;
20
+ }
21
+ .lc_flex_center {
22
+ justify-content: center;
23
+ align-items: center;
24
+ }
25
+ .lc_flex_between {
26
+ justify-content: space-between;
27
+ align-items: center;
28
+ }
29
+ .lc_flex_column {
30
+ flex-direction: column;
31
+ }
32
+
33
+ // -----------------------------------------------------------------------------
34
+ // Utilities / 工具
35
+ // -----------------------------------------------------------------------------
36
+ .lc_ellipsis {
37
+ overflow: hidden;
38
+ text-overflow: ellipsis;
39
+ white-space: nowrap;
40
+ }
41
+ .lc_full_size {
42
+ width: 100%;
43
+ height: 100%;
44
+ }
45
+ .lc_absolute_full {
46
+ position: absolute;
47
+ top: 0;
48
+ left: 0;
49
+ right: 0;
50
+ bottom: 0;
51
+ }
52
+ .lc_pointer {
53
+ cursor: pointer;
54
+ }
@@ -1,9 +1,5 @@
1
1
  @import "./color.less";
2
- @import "./mixins.less";
3
2
 
4
- // =============================================================================
5
- // Typography / 排版与字体
6
- // =============================================================================
7
3
 
8
4
  // -----------------------------------------------------------------------------
9
5
  // Global Font Family / 全局字体
@@ -12,13 +8,9 @@
12
8
  font-family: DinRegular, "PingFang SC", Arial, Microsoft YaHei;
13
9
  }
14
10
 
15
- // -----------------------------------------------------------------------------
16
- // Mixins (Style Definitions) / 混合宏(样式定义)
17
- // -----------------------------------------------------------------------------
18
-
19
11
  // Gradient Core / 渐变核心
20
12
  // 必须在 background 属性之后调用
21
- .lc-text-clip() {
13
+ .lc_text_clip() {
22
14
  -webkit-background-clip: text;
23
15
  background-clip: text;
24
16
  color: transparent;
@@ -26,22 +18,22 @@
26
18
 
27
19
  // Text Gradient / 文字渐变
28
20
  // @param @bg: 渐变背景色
29
- .lc-gradient-text(@bg) {
21
+ .lc_gradient_text(@bg) {
30
22
  background: @bg;
31
- .lc-text-clip();
23
+ .lc_text_clip();
32
24
  }
33
25
 
34
26
  // Icon Gradient / 图标渐变
35
27
  // @param @bg: 渐变背景色
36
28
  // @param @shadow: 内发光/投影
37
- .lc-gradient-icon(@bg, @shadow: none) {
29
+ .lc_gradient_icon(@bg, @shadow: none) {
38
30
  background: @bg;
39
- .lc-text-clip();
31
+ .lc_text_clip();
40
32
  text-shadow: @shadow;
41
33
  }
42
34
 
43
35
  // Font Style / 字体样式
44
- .lc-italic() {
36
+ .lc_italic() {
45
37
  font-style: oblique 13deg;
46
38
  transform: skew(-13deg);
47
39
  display: inline-block;
@@ -55,25 +47,41 @@
55
47
  // -----------------------------------------------------------------------------
56
48
 
57
49
  // Font Sizes
58
- .lc-fs-s { font-size: 12px; }
59
- .lc-fs-m { font-size: 14px; }
60
- .lc-fs-l { font-size: 16px; }
61
- .lc-fs-xl { font-size: 22px; }
50
+ .lc_fs_s { font-size: 12px; }
51
+ .lc_fs_m { font-size: 14px; }
52
+ .lc_fs_l { font-size: 16px; }
53
+ .lc_fs_xl { font-size: 22px; }
62
54
 
63
55
  // Styles
64
- .lc-italic { .lc-italic(); }
56
+ .lc_italic { .lc_italic(); }
65
57
 
66
58
  // Text Gradients
67
- .lc-text-gradient-base { .lc-gradient-text(@lc_gradient_base); }
68
- .lc-text-gradient-normal { .lc-gradient-text(@lc_gradient_processed); }
69
- .lc-text-gradient-notice { .lc-gradient-text(@lc_gradient_notice); }
70
- .lc-text-gradient-warning { .lc-gradient-text(@lc_gradient_warning); }
71
- .lc-text-gradient-alarm { .lc-gradient-text(@lc_gradient_unread); }
72
- .lc-text-gradient-offline { .lc-gradient-text(@lc_gradient_offline); }
59
+ .lc_text_gradient_base { .lc_gradient_text(@lc_gradient_base); }
60
+ .lc_text_gradient_normal { .lc_gradient_text(@lc_gradient_processed); }
61
+ .lc_text_gradient_notice { .lc_gradient_text(@lc_gradient_notice); }
62
+ .lc_text_gradient_warning { .lc_gradient_text(@lc_gradient_warning); }
63
+ .lc_text_gradient_alarm { .lc_gradient_text(@lc_gradient_unread); }
64
+ .lc_text_gradient_offline { .lc_gradient_text(@lc_gradient_offline); }
73
65
 
74
66
  // Icon Gradients
75
- .lc-icon-gradient-normal { .lc-gradient-icon(@lc_gradient_processed, @lc_shadow_icon1); }
76
- .lc-icon-gradient-notice { .lc-gradient-icon(@lc_gradient_notice, @lc_shadow_icon1); }
77
- .lc-icon-gradient-warning { .lc-gradient-icon(@lc_gradient_warning, @lc_shadow_icon1); }
78
- .lc-icon-gradient-alarm { .lc-gradient-icon(@lc_gradient_unread, @lc_shadow_icon1); }
79
- .lc-icon-gradient-offline { .lc-gradient-icon(@lc_gradient_offline, @lc_shadow_icon1); }
67
+ .lc_icon_gradient_normal { .lc_gradient_icon(@lc_gradient_processed, @lc_shadow_icon1); }
68
+ .lc_icon_gradient_notice { .lc_gradient_icon(@lc_gradient_notice, @lc_shadow_icon1); }
69
+ .lc_icon_gradient_warning { .lc_gradient_icon(@lc_gradient_warning, @lc_shadow_icon1); }
70
+ .lc_icon_gradient_alarm { .lc_gradient_icon(@lc_gradient_unread, @lc_shadow_icon1); }
71
+ .lc_icon_gradient_offline { .lc_gradient_icon(@lc_gradient_offline, @lc_shadow_icon1); }
72
+
73
+
74
+
75
+ .lc_text_primary{ color: @lc_text_color_primary; }
76
+ .lc_text_secondary { color: @lc_text_color_secondary; }
77
+ .lc_text_inverse { color: @lc_text_color_inverse; }
78
+ .lc_text_brand { color: @lc_color_brand_primary; }
79
+ .lc_text_success { color: @lc_color_success; }
80
+ .lc_text_warning { color: @lc_color_warning; }
81
+ .lc_text_error { color: @lc_color_error; }
82
+ .lc_text_info { color: @lc_color_info; }
83
+
84
+ .lc_font_s { font-size: @lc_font_size_s; }
85
+ .lc_font_m { font-size: @lc_font_size_m; }
86
+ .lc_font_l { font-size: @lc_font_size_l; }
87
+ .lc_font_xl { font-size: @lc_font_size_xl; }
@@ -11,7 +11,7 @@
11
11
  // Custom Scrollbar / 自定义滚动条
12
12
  // @param @width: 滚动条宽度
13
13
  // @param @radius: 滚动条圆角
14
- .lc-scrollbar(@width: 6px, @radius: 2px) {
14
+ .lc_scrollbar(@width: 6px, @radius: 2px) {
15
15
  // Scrollbar Track
16
16
  &::-webkit-scrollbar,
17
17
  ::-webkit-scrollbar {
@@ -51,19 +51,19 @@
51
51
  // -----------------------------------------------------------------------------
52
52
 
53
53
  // Apply to a container to enable custom scrollbar
54
- .lc-scroll {
54
+ .lc_scroll {
55
55
  overflow: auto;
56
- .lc-scrollbar();
56
+ .lc_scrollbar();
57
57
  }
58
58
 
59
- .lc-scroll-x {
59
+ .lc_scroll_x {
60
60
  overflow-x: auto;
61
61
  overflow-y: hidden;
62
- .lc-scrollbar();
62
+ .lc_scrollbar();
63
63
  }
64
64
 
65
- .lc-scroll-y {
65
+ .lc_scroll_y {
66
66
  overflow-y: auto;
67
67
  overflow-x: hidden;
68
- .lc-scrollbar();
68
+ .lc_scrollbar();
69
69
  }
@@ -4,8 +4,6 @@
4
4
  @import "./font.less";
5
5
  @import "./button.less";
6
6
  @import "./scroller.less";
7
- @import "./mixins.less";
8
- @import "./utilities.less";
9
7
 
10
8
  // Font Faces / 字体声明
11
9
  @font-face {