@antv/s2-vue 2.0.0-next.1 → 2.0.0-next.11

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.
package/esm/style.css CHANGED
@@ -1,50 +1,51 @@
1
1
  .antv-s2-tooltip-operator {
2
- color: rgba(0, 0, 0, 0.65);
2
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
3
+ background: var(--antv-s2-tooltip-operator-background, #f9f9f9);
3
4
  font-size: 12px;
4
- line-height: 32px;
5
- background: #f9f9f9;
6
- padding: 0 12px;
5
+ line-height: 36px;
7
6
  border: 0;
8
7
  cursor: pointer;
9
8
  }
9
+ .antv-s2-tooltip-operator .ant-menu-horizontal:not(.ant-menu-dark) {
10
+ background: transparent;
11
+ line-height: 36px;
12
+ }
10
13
  .antv-s2-tooltip-operator .ant-dropdown-trigger,
11
14
  .antv-s2-tooltip-operator-dropdown {
12
15
  padding: 0 6px 0 0;
13
16
  }
14
17
  .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu {
15
18
  font-size: 12px;
16
- line-height: 32px;
17
- color: rgba(0, 0, 0, 0.65);
19
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
18
20
  border: 0;
19
- margin: 0 -12px;
21
+ user-select: none;
22
+ padding: 4px;
23
+ width: 100%;
20
24
  }
21
25
  .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu .ant-menu-item {
22
- height: 30px;
23
- }
24
- .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu .ant-menu-item:not(:last-child) {
25
- margin: 0;
26
+ height: 36px;
26
27
  }
27
28
  .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu .ant-menu-submenu > .ant-menu-submenu-title {
28
- height: 30px;
29
+ height: 36px;
30
+ width: 100%;
29
31
  }
30
32
  .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu .ant-menu-submenu > .ant-menu-submenu-title .ant-menu-submenu-arrow {
31
- color: rgba(0, 0, 0, 0.65);
33
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
32
34
  }
33
35
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-dropdown-menu-item,
34
36
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-dropdown-menu-item,
35
37
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-menu-item,
36
38
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-item {
37
39
  font-size: 12px;
38
- line-height: 32px;
40
+ line-height: 36px;
39
41
  padding: 0 12px;
40
42
  border: 0;
41
- margin: 0;
42
43
  }
43
44
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-dropdown-menu-item:not(.ant-menu-item-active),
44
45
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-dropdown-menu-item:not(.ant-menu-item-active),
45
46
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-menu-item:not(.ant-menu-item-active),
46
47
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-item:not(.ant-menu-item-active) {
47
- color: rgba(0, 0, 0, 0.65);
48
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
48
49
  }
49
50
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-dropdown-menu-submenu .ant-menu-submenu-title,
50
51
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-dropdown-menu-submenu .ant-menu-submenu-title,
@@ -54,9 +55,9 @@
54
55
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu .ant-menu-submenu-title,
55
56
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title,
56
57
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title {
57
- padding: 0 12px;
58
+ padding: 0 0 0 12px;
58
59
  font-size: 12px;
59
- line-height: 32px;
60
+ line-height: 36px;
60
61
  margin: 0;
61
62
  }
62
63
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-dropdown-menu-submenu .ant-menu-submenu-title:not(.ant-menu-item-active),
@@ -67,7 +68,7 @@
67
68
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu .ant-menu-submenu-title:not(.ant-menu-item-active),
68
69
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title:not(.ant-menu-item-active),
69
70
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title:not(.ant-menu-item-active) {
70
- color: rgba(0, 0, 0, 0.65);
71
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
71
72
  }
72
73
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-dropdown-menu-submenu .ant-menu-submenu-title .ant-dropdown-menu-title-content,
73
74
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-dropdown-menu-submenu .ant-menu-submenu-title .ant-dropdown-menu-title-content,
@@ -90,28 +91,29 @@
90
91
  .antv-s2-tooltip-operator-submenu-popup .ant-dropdown-menu-item,
91
92
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-item {
92
93
  font-size: 12px;
93
- line-height: 32px;
94
+ line-height: 36px;
94
95
  padding: 0 12px;
95
96
  }
96
97
  .antv-s2-tooltip-operator-submenu-popup .ant-dropdown-menu-item:not(.ant-menu-item-active),
97
98
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-item:not(.ant-menu-item-active) {
98
- color: rgba(0, 0, 0, 0.65);
99
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
99
100
  }
100
101
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-vertical .ant-menu-item {
101
102
  margin: 0;
102
- height: 30px;
103
- line-height: 32px;
103
+ height: 36px;
104
+ line-height: 36px;
105
+ width: 100%;
104
106
  }
105
107
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-vertical .ant-menu-item:not(:last-child) {
106
108
  margin: 0;
107
109
  }
108
110
  .antv-s2-tooltip-operator-icon {
109
111
  vertical-align: middle;
110
- margin-right: 4px;
111
112
  }
112
113
  .antv-s2-tooltip-operator-icon svg {
113
114
  width: 12px;
114
115
  height: 12px;
116
+ fill: var(--antv-s2-font);
115
117
  }
116
118
  @media only screen and (max-device-width: 480px) {
117
119
  .antv-s2-tooltip-operator-menus.ant-menu-vertical.ant-menu {
@@ -144,7 +146,7 @@
144
146
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu .ant-menu-submenu-title:not(.ant-menu-item-active),
145
147
  .antv-s2-tooltip-operator-menus.ant-dropdown-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title:not(.ant-menu-item-active),
146
148
  .antv-s2-tooltip-operator-menus.ant-menu-vertical .ant-menu-submenu-vertical .ant-menu-submenu-title:not(.ant-menu-item-active) {
147
- color: rgba(0, 0, 0, 0.65);
149
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
148
150
  }
149
151
  .antv-s2-tooltip-operator-submenu-popup .ant-dropdown-menu-item,
150
152
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-item {
@@ -152,7 +154,7 @@
152
154
  }
153
155
  .antv-s2-tooltip-operator-submenu-popup .ant-dropdown-menu-item:not(.ant-menu-item-active),
154
156
  .antv-s2-tooltip-operator-submenu-popup .ant-menu-item:not(.ant-menu-item-active) {
155
- color: rgba(0, 0, 0, 0.65);
157
+ color: var(--antv-s2-font, rgba(0, 0, 0, 0.65));
156
158
  }
157
159
  .antv-s2-tooltip-operator-icon svg {
158
160
  width: 12px;
@@ -168,8 +170,8 @@
168
170
  overflow: auto;
169
171
  z-index: 1024;
170
172
  display: inline-block;
171
- background: rgba(255, 255, 255, 0.96);
172
- border-radius: 2px;
173
+ background: var(--antv-s2-tooltip-background, rgba(255, 255, 255, 0.95));
174
+ border-radius: 4px;
173
175
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
174
176
  font-size: 12px;
175
177
  font-family: Roboto, 'PingFang SC', 'Chinese Quote', BlinkMacSystemFont, 'Segoe UI', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
@@ -192,22 +194,22 @@
192
194
  padding: 12px;
193
195
  line-height: 16px;
194
196
  overflow-wrap: break-word;
195
- color: rgba(0, 0, 0, 0.85);
197
+ color: var(--antv-s2-font-85, rgba(0, 0, 0, 0.85));
196
198
  }
197
199
  .antv-s2-tooltip-description {
198
200
  padding: 0 12px 12px;
199
201
  line-height: 16px;
200
202
  overflow-wrap: break-word;
201
- color: rgba(0, 0, 0, 0.45);
203
+ color: var(--antv-s2-font-45, rgba(0, 0, 0, 0.45));
202
204
  }
203
205
  .antv-s2-tooltip-tips {
204
206
  padding: 4px 12px;
205
- color: rgba(0, 0, 0, 0.45);
207
+ color: var(--antv-s2-font-45, rgba(0, 0, 0, 0.45));
206
208
  }
207
209
  .antv-s2-tooltip-infos {
208
210
  padding: 4px 12px;
209
211
  line-height: 20px;
210
- color: rgba(0, 0, 0, 0.45);
212
+ color: var(--antv-s2-font-45, rgba(0, 0, 0, 0.45));
211
213
  overflow: hidden;
212
214
  text-overflow: ellipsis;
213
215
  -webkit-line-clamp: 2;
@@ -220,7 +222,7 @@
220
222
  }
221
223
  .antv-s2-tooltip-summary {
222
224
  line-height: 20px;
223
- color: rgba(0, 0, 0, 0.65);
225
+ color: var(--antv-s2-font-65, rgba(0, 0, 0, 0.65));
224
226
  overflow: hidden;
225
227
  padding: 12px;
226
228
  }
@@ -243,7 +245,7 @@
243
245
  padding: 12px;
244
246
  }
245
247
  .antv-s2-tooltip-interpretation + .antv-s2-tooltip-head-info-list {
246
- border-top: 1px solid #e9e9e9;
248
+ border-top: 1px solid var(--antv-s2-border, #e9e9e9);
247
249
  }
248
250
  .antv-s2-tooltip-interpretation .antv-s2-tooltip-interpretation-head {
249
251
  margin-bottom: 12px;
@@ -253,10 +255,10 @@
253
255
  height: 14px;
254
256
  }
255
257
  .antv-s2-tooltip-interpretation .antv-s2-tooltip-interpretation-head .antv-s2-tooltip-interpretation-name {
256
- color: #000;
258
+ color: var(--antv-s2-font, #000);
257
259
  }
258
260
  .antv-s2-tooltip-head-info-list {
259
- color: #a2a2a2;
261
+ color: var(--antv-s2-font-65, #a2a2a2);
260
262
  padding: 12px 12px 4px;
261
263
  line-height: 24px;
262
264
  word-break: break-word;
@@ -269,13 +271,13 @@
269
271
  margin-right: 5px;
270
272
  }
271
273
  .antv-s2-tooltip-highlight {
272
- color: rgba(0, 0, 0, 0.85);
274
+ color: var(--antv-s2-font-85, rgba(0, 0, 0, 0.85));
273
275
  }
274
276
  .antv-s2-tooltip-detail-list {
275
277
  padding: 2px 12px 8px;
276
278
  }
277
279
  .antv-s2-tooltip-detail-list .antv-s2-tooltip-detail-item {
278
- color: rgba(0, 0, 0, 0.65);
280
+ color: var(--antv-s2-font-65, rgba(0, 0, 0, 0.65));
279
281
  overflow: hidden;
280
282
  margin: 4px 0;
281
283
  display: flex;
@@ -324,19 +326,20 @@
324
326
  white-space: nowrap;
325
327
  max-width: 64px;
326
328
  }
327
- .antv-s2-drill-down[data-v-1a60f775] {
329
+ .antv-s2-drill-down[data-v-8dd920ec] {
328
330
  width: 260px;
329
331
  min-height: 20px;
330
332
  position: relative;
333
+ color: var(--antv-s2-font-70, #fff);
331
334
  }
332
- .antv-s2-drill-down-header[data-v-1a60f775] {
335
+ .antv-s2-drill-down-header[data-v-8dd920ec] {
333
336
  display: flex;
334
337
  height: 32px;
335
338
  font-size: 14px;
336
339
  padding: 0 16px;
337
340
  margin-top: 16px;
338
341
  }
339
- .antv-s2-drill-down-header button[data-v-1a60f775] {
342
+ .antv-s2-drill-down-header button[data-v-8dd920ec] {
340
343
  position: absolute;
341
344
  right: 0;
342
345
  top: -4px;
@@ -345,36 +348,47 @@
345
348
  letter-spacing: -0.2px;
346
349
  line-height: 20px;
347
350
  }
348
- .antv-s2-drill-down-search[data-v-1a60f775] {
351
+ .antv-s2-drill-down-search[data-v-8dd920ec] {
349
352
  height: 24px;
350
353
  width: 228px !important;
351
354
  margin: 0 16px;
352
355
  border: 1px solid rgba(0, 0, 0, 0.15);
353
356
  border-radius: 2px;
354
- background-color: #fff;
355
357
  }
356
- .antv-s2-drill-down-search input[data-v-1a60f775],
357
- .antv-s2-drill-down-search span[data-v-1a60f775] {
358
+ .antv-s2-drill-down-search input[data-v-8dd920ec],
359
+ .antv-s2-drill-down-search span[data-v-8dd920ec] {
358
360
  font-size: 12px;
359
361
  }
360
- .antv-s2-drill-down-menu[data-v-1a60f775] {
362
+ .antv-s2-drill-down-search[data-v-8dd920ec],
363
+ .antv-s2-drill-down-search .ant-input[data-v-8dd920ec]::placeholder {
364
+ background-color: var(--antv-s2-block-background, #fff);
365
+ }
366
+ .antv-s2-drill-down-extra[data-v-8dd920ec] {
367
+ margin: 4px 16px;
368
+ }
369
+ .antv-s2-drill-down-menu[data-v-8dd920ec] {
361
370
  max-height: 314px;
362
- overflow-y: auto;
363
- overflow-x: hidden;
371
+ overflow: hidden auto;
364
372
  }
365
- .antv-s2-drill-down-menu-item[data-v-1a60f775] {
373
+ .antv-s2-drill-down-menu.ant-menu[data-v-8dd920ec] {
374
+ background: var(--antv-s2-tooltip-background, #fff);
375
+ }
376
+ .antv-s2-drill-down-menu.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected[data-v-8dd920ec] {
377
+ background-color: var(--antv-s2-block-background, #e6f7ff);
378
+ }
379
+ .antv-s2-drill-down-menu-item[data-v-8dd920ec] {
366
380
  height: 32px !important;
367
381
  line-height: 32px !important;
368
382
  font-size: 12px;
369
383
  opacity: 0.65;
370
384
  }
371
- .antv-s2-drill-down-menu-item span[data-v-1a60f775]:last-child {
385
+ .antv-s2-drill-down-menu-item span[data-v-8dd920ec]:last-child {
372
386
  line-height: 32px;
373
387
  }
374
- .antv-s2-drill-down-menu-item svg[data-v-1a60f775] {
388
+ .antv-s2-drill-down-menu-item svg[data-v-8dd920ec] {
375
389
  margin-right: 8px;
376
390
  }
377
- .antv-s2-drill-down-empty[data-v-1a60f775] {
378
- padding: 18px 18px 0;
391
+ .antv-s2-drill-down-empty[data-v-8dd920ec] {
392
+ padding: 12px;
379
393
  font-size: 12px;
380
394
  }