@eaera-com/eaera-widgets-v2 0.1.68 → 0.1.69
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.
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
|
|
69
69
|
.el-alert__content {
|
|
70
70
|
flex: 1;
|
|
71
|
-
@include typo.body-
|
|
71
|
+
@include typo.body-md;
|
|
72
72
|
color: var(--er-text-secondary);
|
|
73
73
|
}
|
|
74
74
|
|
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
.el-alert__description {
|
|
81
|
-
@include typo.body-
|
|
81
|
+
@include typo.body-md;
|
|
82
82
|
color: var(--er-text-secondary);
|
|
83
83
|
}
|
|
84
84
|
|
|
@@ -2,19 +2,16 @@
|
|
|
2
2
|
// Popper background — force dark surface in dark mode. EP defaults to
|
|
3
3
|
// --el-bg-color-overlay (#ffffff) and wallet-selector-popper sets the inner
|
|
4
4
|
// .el-dropdown-menu to transparent, so the popper itself MUST carry the bg.
|
|
5
|
-
background-color: var(--er-surface-
|
|
5
|
+
background-color: var(--er-surface-elevated) !important;
|
|
6
6
|
border-color: var(--er-border-subtle) !important;
|
|
7
7
|
border-radius: var(--er-shape-corner-150);
|
|
8
|
+
min-width: 200px;
|
|
8
9
|
|
|
9
10
|
.el-popper__arrow::before {
|
|
10
11
|
border-color: var(--er-border-default);
|
|
11
12
|
background-color: var(--el-bg-color-overlay);
|
|
12
13
|
}
|
|
13
14
|
|
|
14
|
-
li {
|
|
15
|
-
min-width: 200px;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
15
|
// Inner menu — wallet-selector-popper sets this to transparent, so inherit
|
|
19
16
|
// the popper background above. Ensure no leak-through.
|
|
20
17
|
.el-dropdown-menu {
|
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
@use '../themes/aurora/typography/typography-utils' as typo;
|
|
2
2
|
|
|
3
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
4
|
+
// ICONS — exact SVG glyphs exported from Figma (Super-App Design, node
|
|
5
|
+
// 8962-162657, `number input`): 16×16 icon box, glyph 10.67×10.67 centred,
|
|
6
|
+
// stroke 1.33, round caps. Rendered 1:1 via mask (same technique as the
|
|
7
|
+
// checkbox icons) so strokes keep the designed weight, and the Element Plus
|
|
8
|
+
// default arrow svg inside the steppers is hidden (see `.el-icon` below —
|
|
9
|
+
// this intentionally applies to every caller, slotted icons included).
|
|
10
|
+
// ─────────────────────────────────────────────────────────────────────────────
|
|
11
|
+
$inum-minus-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.66667 8H13.33333' stroke='black' stroke-width='1.33333' stroke-linecap='round'/%3E%3C/svg%3E");
|
|
12
|
+
$inum-plus-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 2.66667V13.33333M2.66667 8H13.33333' stroke='black' stroke-width='1.33333' stroke-linecap='round'/%3E%3C/svg%3E");
|
|
13
|
+
|
|
3
14
|
// ─── Reusable base styles (can be included in other components) ───────────────
|
|
4
15
|
@mixin input-number-base {
|
|
5
16
|
border: 1px solid var(--er-border-default);
|
|
@@ -63,16 +74,37 @@
|
|
|
63
74
|
.el-icon {
|
|
64
75
|
width: var(--er-control-height-sm);
|
|
65
76
|
height: var(--er-control-height-sm);
|
|
77
|
+
|
|
78
|
+
// Figma −/+ glyphs replace the Element Plus default arrow svg.
|
|
79
|
+
// `background-color: currentColor` keeps the mask in sync with the
|
|
80
|
+
// button's existing color / hover / disabled logic.
|
|
81
|
+
svg {
|
|
82
|
+
display: none;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
background-color: currentColor;
|
|
86
|
+
-webkit-mask: $inum-minus-icon center / 16px 16px no-repeat;
|
|
87
|
+
mask: $inum-minus-icon center / 16px 16px no-repeat;
|
|
66
88
|
}
|
|
67
89
|
}
|
|
68
90
|
|
|
69
91
|
.el-input-number__decrease {
|
|
70
92
|
order: 1;
|
|
71
93
|
left: 0px;
|
|
94
|
+
|
|
95
|
+
.el-icon {
|
|
96
|
+
-webkit-mask-image: $inum-minus-icon;
|
|
97
|
+
mask-image: $inum-minus-icon;
|
|
98
|
+
}
|
|
72
99
|
}
|
|
73
100
|
.el-input-number__increase {
|
|
74
101
|
right: 0px;
|
|
75
102
|
order: 3;
|
|
103
|
+
|
|
104
|
+
.el-icon {
|
|
105
|
+
-webkit-mask-image: $inum-plus-icon;
|
|
106
|
+
mask-image: $inum-plus-icon;
|
|
107
|
+
}
|
|
76
108
|
}
|
|
77
109
|
|
|
78
110
|
&.is-disabled {
|
|
@@ -100,7 +132,7 @@
|
|
|
100
132
|
}
|
|
101
133
|
}
|
|
102
134
|
|
|
103
|
-
@mixin input-number-size($height, $button-size, $
|
|
135
|
+
@mixin input-number-size($height, $button-size, $button-radius) {
|
|
104
136
|
height: $height !important;
|
|
105
137
|
min-height: $height !important;
|
|
106
138
|
|
|
@@ -109,11 +141,6 @@
|
|
|
109
141
|
border-radius: $button-radius;
|
|
110
142
|
width: $button-size;
|
|
111
143
|
height: $button-size;
|
|
112
|
-
|
|
113
|
-
svg {
|
|
114
|
-
width: $icon-size;
|
|
115
|
-
height: $icon-size;
|
|
116
|
-
}
|
|
117
144
|
}
|
|
118
145
|
}
|
|
119
146
|
|
|
@@ -178,7 +205,6 @@
|
|
|
178
205
|
@include input-number-size(
|
|
179
206
|
var(--er-control-height-sm),
|
|
180
207
|
var(--er-control-height-sm),
|
|
181
|
-
var(--er-control-height-xxs),
|
|
182
208
|
var(--er-shape-corner-50)
|
|
183
209
|
);
|
|
184
210
|
|
|
@@ -198,7 +224,6 @@
|
|
|
198
224
|
@include input-number-size(
|
|
199
225
|
var(--er-control-height-md),
|
|
200
226
|
var(--er-control-height-md),
|
|
201
|
-
var(--er-control-height-xs),
|
|
202
227
|
var(--er-shape-corner-100)
|
|
203
228
|
);
|
|
204
229
|
|
|
@@ -217,7 +242,6 @@
|
|
|
217
242
|
@include input-number-size(
|
|
218
243
|
var(--er-control-height-lg),
|
|
219
244
|
var(--er-control-height-lg),
|
|
220
|
-
var(--er-control-height-xs),
|
|
221
245
|
var(--er-shape-corner-150)
|
|
222
246
|
);
|
|
223
247
|
|