@empathyco/x-components 6.0.0-alpha.29 → 6.0.0-alpha.30
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/CHANGELOG.md +9 -0
- package/design-system/deprecated-full-theme.css +454 -454
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js +1 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue3.js +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,15 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [6.0.0-alpha.30](https://github.com/empathyco/x/compare/@empathyco/x-components@6.0.0-alpha.29...@empathyco/x-components@6.0.0-alpha.30) (2025-01-15)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* replace `x-w-[calc(100%)]` with a custom one (#1690) ([ecff709](https://github.com/empathyco/x/commit/ecff709280ea8716414439107dc017b396ffc0b4))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
6
15
|
## [6.0.0-alpha.29](https://github.com/empathyco/x/compare/@empathyco/x-components@6.0.0-alpha.28...@empathyco/x-components@6.0.0-alpha.29) (2025-01-13)
|
|
7
16
|
|
|
8
17
|
|
|
@@ -1,39 +1,5 @@
|
|
|
1
1
|
|
|
2
2
|
|
|
3
|
-
.x-uppercase {
|
|
4
|
-
text-transform: uppercase;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.x-lowercase {
|
|
8
|
-
text-transform: lowercase;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.x-capitalize {
|
|
12
|
-
text-transform: capitalize;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
.x-normal-case {
|
|
16
|
-
text-transform: none;
|
|
17
|
-
}
|
|
18
|
-
.x-underline {
|
|
19
|
-
-webkit-text-decoration-line: underline;
|
|
20
|
-
text-decoration-line: underline;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.x-overline {
|
|
24
|
-
-webkit-text-decoration-line: overline;
|
|
25
|
-
text-decoration-line: overline;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
.x-line-through {
|
|
29
|
-
-webkit-text-decoration-line: line-through;
|
|
30
|
-
text-decoration-line: line-through;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
.x-no-underline {
|
|
34
|
-
-webkit-text-decoration-line: none;
|
|
35
|
-
text-decoration-line: none;
|
|
36
|
-
}
|
|
37
3
|
.x-static {
|
|
38
4
|
position: static !important;
|
|
39
5
|
}
|
|
@@ -1022,6 +988,21 @@
|
|
|
1022
988
|
.x-font-weight--bold {
|
|
1023
989
|
font-weight: var(--x-number-font-weight-base-bold) !important;
|
|
1024
990
|
}
|
|
991
|
+
.x-uppercase {
|
|
992
|
+
text-transform: uppercase;
|
|
993
|
+
}
|
|
994
|
+
|
|
995
|
+
.x-lowercase {
|
|
996
|
+
text-transform: lowercase;
|
|
997
|
+
}
|
|
998
|
+
|
|
999
|
+
.x-capitalize {
|
|
1000
|
+
text-transform: capitalize;
|
|
1001
|
+
}
|
|
1002
|
+
|
|
1003
|
+
.x-normal-case {
|
|
1004
|
+
text-transform: none;
|
|
1005
|
+
}
|
|
1025
1006
|
.x-font-size--01 {
|
|
1026
1007
|
font-size: var(--x-size-base-01) !important;
|
|
1027
1008
|
line-height: 1.5;
|
|
@@ -1299,139 +1280,6 @@
|
|
|
1299
1280
|
--x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
|
|
1300
1281
|
0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
|
|
1301
1282
|
}
|
|
1302
|
-
/* Material Elevations extracted from:
|
|
1303
|
-
https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
|
|
1304
|
-
*/
|
|
1305
|
-
:root {
|
|
1306
|
-
/* Shadow none */
|
|
1307
|
-
--x-string-box-shadow-00: none;
|
|
1308
|
-
/* Shadow 1dp */
|
|
1309
|
-
--x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
|
|
1310
|
-
0 1px 3px 0 rgba(0, 0, 0, 0.2);
|
|
1311
|
-
/* Shadow 2dp */
|
|
1312
|
-
--x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
|
|
1313
|
-
0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
|
1314
|
-
/* Shadow 3dp */
|
|
1315
|
-
--x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
|
|
1316
|
-
0 1px 8px 0 rgba(0, 0, 0, 0.2);
|
|
1317
|
-
/* Shadow 4dp */
|
|
1318
|
-
--x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
|
|
1319
|
-
0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
|
1320
|
-
/* Shadow 6dp */
|
|
1321
|
-
--x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
|
|
1322
|
-
0 3px 5px -1px rgba(0, 0, 0, 0.2);
|
|
1323
|
-
/* Shadow 8dp */
|
|
1324
|
-
--x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
|
|
1325
|
-
0 5px 5px -3px rgba(0, 0, 0, 0.2);
|
|
1326
|
-
/* Shadow 9dp */
|
|
1327
|
-
--x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
|
|
1328
|
-
0 5px 6px -3px rgba(0, 0, 0, 0.2);
|
|
1329
|
-
/* Shadow 12dp */
|
|
1330
|
-
--x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
|
|
1331
|
-
0 7px 8px -4px rgba(0, 0, 0, 0.2);
|
|
1332
|
-
/* Shadow 16dp */
|
|
1333
|
-
--x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
|
|
1334
|
-
0 8px 10px -5px rgba(0, 0, 0, 0.2);
|
|
1335
|
-
/* Shadow 24dp */
|
|
1336
|
-
--x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
|
|
1337
|
-
0 11px 15px -7px rgba(0, 0, 0, 0.2);
|
|
1338
|
-
/* BOTTOM ONLY SHADOW (not overflows on top of the element) */
|
|
1339
|
-
/* Shadow 1dp */
|
|
1340
|
-
--x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
|
|
1341
|
-
0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
|
|
1342
|
-
/* Shadow 2dp */
|
|
1343
|
-
--x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
|
|
1344
|
-
0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
|
|
1345
|
-
/* Shadow 3dp */
|
|
1346
|
-
--x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
|
|
1347
|
-
0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
|
|
1348
|
-
/* Shadow 4dp */
|
|
1349
|
-
--x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
|
|
1350
|
-
0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
|
|
1351
|
-
/* Shadow 6dp */
|
|
1352
|
-
--x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
|
|
1353
|
-
0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
|
|
1354
|
-
/* Shadow 8dp */
|
|
1355
|
-
--x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
|
|
1356
|
-
0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
|
|
1357
|
-
/* Shadow 9dp */
|
|
1358
|
-
--x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
|
|
1359
|
-
0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
|
|
1360
|
-
/* Shadow 12dp */
|
|
1361
|
-
--x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
|
|
1362
|
-
0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
|
|
1363
|
-
/* Shadow 16dp */
|
|
1364
|
-
--x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
|
|
1365
|
-
0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
|
|
1366
|
-
/* Shadow 24dp */
|
|
1367
|
-
--x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
|
|
1368
|
-
0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
|
|
1369
|
-
}
|
|
1370
|
-
|
|
1371
|
-
.x-shadow--none {
|
|
1372
|
-
box-shadow: none !important;
|
|
1373
|
-
}
|
|
1374
|
-
|
|
1375
|
-
.x-shadow--01 {
|
|
1376
|
-
box-shadow: var(--x-string-box-shadow-01) !important;
|
|
1377
|
-
}
|
|
1378
|
-
.x-shadow--bottom-01 {
|
|
1379
|
-
box-shadow: var(--x-string-box-shadow-bottom-01) !important;
|
|
1380
|
-
}
|
|
1381
|
-
.x-shadow--02 {
|
|
1382
|
-
box-shadow: var(--x-string-box-shadow-02) !important;
|
|
1383
|
-
}
|
|
1384
|
-
.x-shadow--bottom-02 {
|
|
1385
|
-
box-shadow: var(--x-string-box-shadow-bottom-02) !important;
|
|
1386
|
-
}
|
|
1387
|
-
.x-shadow--03 {
|
|
1388
|
-
box-shadow: var(--x-string-box-shadow-03) !important;
|
|
1389
|
-
}
|
|
1390
|
-
.x-shadow--bottom-03 {
|
|
1391
|
-
box-shadow: var(--x-string-box-shadow-bottom-03) !important;
|
|
1392
|
-
}
|
|
1393
|
-
.x-shadow--04 {
|
|
1394
|
-
box-shadow: var(--x-string-box-shadow-04) !important;
|
|
1395
|
-
}
|
|
1396
|
-
.x-shadow--bottom-04 {
|
|
1397
|
-
box-shadow: var(--x-string-box-shadow-bottom-04) !important;
|
|
1398
|
-
}
|
|
1399
|
-
.x-shadow--05 {
|
|
1400
|
-
box-shadow: var(--x-string-box-shadow-05) !important;
|
|
1401
|
-
}
|
|
1402
|
-
.x-shadow--bottom-05 {
|
|
1403
|
-
box-shadow: var(--x-string-box-shadow-bottom-05) !important;
|
|
1404
|
-
}
|
|
1405
|
-
.x-shadow--06 {
|
|
1406
|
-
box-shadow: var(--x-string-box-shadow-06) !important;
|
|
1407
|
-
}
|
|
1408
|
-
.x-shadow--bottom-06 {
|
|
1409
|
-
box-shadow: var(--x-string-box-shadow-bottom-06) !important;
|
|
1410
|
-
}
|
|
1411
|
-
.x-shadow--07 {
|
|
1412
|
-
box-shadow: var(--x-string-box-shadow-07) !important;
|
|
1413
|
-
}
|
|
1414
|
-
.x-shadow--bottom-07 {
|
|
1415
|
-
box-shadow: var(--x-string-box-shadow-bottom-07) !important;
|
|
1416
|
-
}
|
|
1417
|
-
.x-shadow--08 {
|
|
1418
|
-
box-shadow: var(--x-string-box-shadow-08) !important;
|
|
1419
|
-
}
|
|
1420
|
-
.x-shadow--bottom-08 {
|
|
1421
|
-
box-shadow: var(--x-string-box-shadow-bottom-08) !important;
|
|
1422
|
-
}
|
|
1423
|
-
.x-shadow--09 {
|
|
1424
|
-
box-shadow: var(--x-string-box-shadow-09) !important;
|
|
1425
|
-
}
|
|
1426
|
-
.x-shadow--bottom-09 {
|
|
1427
|
-
box-shadow: var(--x-string-box-shadow-bottom-09) !important;
|
|
1428
|
-
}
|
|
1429
|
-
.x-shadow--10 {
|
|
1430
|
-
box-shadow: var(--x-string-box-shadow-10) !important;
|
|
1431
|
-
}
|
|
1432
|
-
.x-shadow--bottom-10 {
|
|
1433
|
-
box-shadow: var(--x-string-box-shadow-bottom-10) !important;
|
|
1434
|
-
}
|
|
1435
1283
|
*[class*=x-border-width--] {
|
|
1436
1284
|
border-width: 0;
|
|
1437
1285
|
}
|
|
@@ -1766,15 +1614,148 @@
|
|
|
1766
1614
|
.x-border-width--left-10 {
|
|
1767
1615
|
border-style: solid !important;
|
|
1768
1616
|
}
|
|
1769
|
-
|
|
1770
|
-
|
|
1617
|
+
/* Material Elevations extracted from:
|
|
1618
|
+
https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
|
|
1619
|
+
*/
|
|
1620
|
+
:root {
|
|
1621
|
+
/* Shadow none */
|
|
1622
|
+
--x-string-box-shadow-00: none;
|
|
1623
|
+
/* Shadow 1dp */
|
|
1624
|
+
--x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
|
|
1625
|
+
0 1px 3px 0 rgba(0, 0, 0, 0.2);
|
|
1626
|
+
/* Shadow 2dp */
|
|
1627
|
+
--x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
|
|
1628
|
+
0 1px 5px 0 rgba(0, 0, 0, 0.2);
|
|
1629
|
+
/* Shadow 3dp */
|
|
1630
|
+
--x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
|
|
1631
|
+
0 1px 8px 0 rgba(0, 0, 0, 0.2);
|
|
1632
|
+
/* Shadow 4dp */
|
|
1633
|
+
--x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
|
|
1634
|
+
0 2px 4px -1px rgba(0, 0, 0, 0.2);
|
|
1635
|
+
/* Shadow 6dp */
|
|
1636
|
+
--x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
|
|
1637
|
+
0 3px 5px -1px rgba(0, 0, 0, 0.2);
|
|
1638
|
+
/* Shadow 8dp */
|
|
1639
|
+
--x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
|
|
1640
|
+
0 5px 5px -3px rgba(0, 0, 0, 0.2);
|
|
1641
|
+
/* Shadow 9dp */
|
|
1642
|
+
--x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
|
|
1643
|
+
0 5px 6px -3px rgba(0, 0, 0, 0.2);
|
|
1644
|
+
/* Shadow 12dp */
|
|
1645
|
+
--x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
|
|
1646
|
+
0 7px 8px -4px rgba(0, 0, 0, 0.2);
|
|
1647
|
+
/* Shadow 16dp */
|
|
1648
|
+
--x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
|
|
1649
|
+
0 8px 10px -5px rgba(0, 0, 0, 0.2);
|
|
1650
|
+
/* Shadow 24dp */
|
|
1651
|
+
--x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
|
|
1652
|
+
0 11px 15px -7px rgba(0, 0, 0, 0.2);
|
|
1653
|
+
/* BOTTOM ONLY SHADOW (not overflows on top of the element) */
|
|
1654
|
+
/* Shadow 1dp */
|
|
1655
|
+
--x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
|
|
1656
|
+
0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
|
|
1657
|
+
/* Shadow 2dp */
|
|
1658
|
+
--x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
|
|
1659
|
+
0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
|
|
1660
|
+
/* Shadow 3dp */
|
|
1661
|
+
--x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
|
|
1662
|
+
0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
|
|
1663
|
+
/* Shadow 4dp */
|
|
1664
|
+
--x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
|
|
1665
|
+
0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
|
|
1666
|
+
/* Shadow 6dp */
|
|
1667
|
+
--x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
|
|
1668
|
+
0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
|
|
1669
|
+
/* Shadow 8dp */
|
|
1670
|
+
--x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
|
|
1671
|
+
0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
|
|
1672
|
+
/* Shadow 9dp */
|
|
1673
|
+
--x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
|
|
1674
|
+
0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
|
|
1675
|
+
/* Shadow 12dp */
|
|
1676
|
+
--x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
|
|
1677
|
+
0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
|
|
1678
|
+
/* Shadow 16dp */
|
|
1679
|
+
--x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
|
|
1680
|
+
0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
|
|
1681
|
+
/* Shadow 24dp */
|
|
1682
|
+
--x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
|
|
1683
|
+
0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
|
|
1771
1684
|
}
|
|
1772
1685
|
|
|
1773
|
-
.x-
|
|
1774
|
-
|
|
1686
|
+
.x-shadow--none {
|
|
1687
|
+
box-shadow: none !important;
|
|
1775
1688
|
}
|
|
1776
1689
|
|
|
1777
|
-
.x-
|
|
1690
|
+
.x-shadow--01 {
|
|
1691
|
+
box-shadow: var(--x-string-box-shadow-01) !important;
|
|
1692
|
+
}
|
|
1693
|
+
.x-shadow--bottom-01 {
|
|
1694
|
+
box-shadow: var(--x-string-box-shadow-bottom-01) !important;
|
|
1695
|
+
}
|
|
1696
|
+
.x-shadow--02 {
|
|
1697
|
+
box-shadow: var(--x-string-box-shadow-02) !important;
|
|
1698
|
+
}
|
|
1699
|
+
.x-shadow--bottom-02 {
|
|
1700
|
+
box-shadow: var(--x-string-box-shadow-bottom-02) !important;
|
|
1701
|
+
}
|
|
1702
|
+
.x-shadow--03 {
|
|
1703
|
+
box-shadow: var(--x-string-box-shadow-03) !important;
|
|
1704
|
+
}
|
|
1705
|
+
.x-shadow--bottom-03 {
|
|
1706
|
+
box-shadow: var(--x-string-box-shadow-bottom-03) !important;
|
|
1707
|
+
}
|
|
1708
|
+
.x-shadow--04 {
|
|
1709
|
+
box-shadow: var(--x-string-box-shadow-04) !important;
|
|
1710
|
+
}
|
|
1711
|
+
.x-shadow--bottom-04 {
|
|
1712
|
+
box-shadow: var(--x-string-box-shadow-bottom-04) !important;
|
|
1713
|
+
}
|
|
1714
|
+
.x-shadow--05 {
|
|
1715
|
+
box-shadow: var(--x-string-box-shadow-05) !important;
|
|
1716
|
+
}
|
|
1717
|
+
.x-shadow--bottom-05 {
|
|
1718
|
+
box-shadow: var(--x-string-box-shadow-bottom-05) !important;
|
|
1719
|
+
}
|
|
1720
|
+
.x-shadow--06 {
|
|
1721
|
+
box-shadow: var(--x-string-box-shadow-06) !important;
|
|
1722
|
+
}
|
|
1723
|
+
.x-shadow--bottom-06 {
|
|
1724
|
+
box-shadow: var(--x-string-box-shadow-bottom-06) !important;
|
|
1725
|
+
}
|
|
1726
|
+
.x-shadow--07 {
|
|
1727
|
+
box-shadow: var(--x-string-box-shadow-07) !important;
|
|
1728
|
+
}
|
|
1729
|
+
.x-shadow--bottom-07 {
|
|
1730
|
+
box-shadow: var(--x-string-box-shadow-bottom-07) !important;
|
|
1731
|
+
}
|
|
1732
|
+
.x-shadow--08 {
|
|
1733
|
+
box-shadow: var(--x-string-box-shadow-08) !important;
|
|
1734
|
+
}
|
|
1735
|
+
.x-shadow--bottom-08 {
|
|
1736
|
+
box-shadow: var(--x-string-box-shadow-bottom-08) !important;
|
|
1737
|
+
}
|
|
1738
|
+
.x-shadow--09 {
|
|
1739
|
+
box-shadow: var(--x-string-box-shadow-09) !important;
|
|
1740
|
+
}
|
|
1741
|
+
.x-shadow--bottom-09 {
|
|
1742
|
+
box-shadow: var(--x-string-box-shadow-bottom-09) !important;
|
|
1743
|
+
}
|
|
1744
|
+
.x-shadow--10 {
|
|
1745
|
+
box-shadow: var(--x-string-box-shadow-10) !important;
|
|
1746
|
+
}
|
|
1747
|
+
.x-shadow--bottom-10 {
|
|
1748
|
+
box-shadow: var(--x-string-box-shadow-bottom-10) !important;
|
|
1749
|
+
}
|
|
1750
|
+
.x-border-radius--00 {
|
|
1751
|
+
border-radius: 0 !important;
|
|
1752
|
+
}
|
|
1753
|
+
|
|
1754
|
+
.x-border-radius--pill {
|
|
1755
|
+
border-radius: 99999px !important;
|
|
1756
|
+
}
|
|
1757
|
+
|
|
1758
|
+
.x-border-radius--01 {
|
|
1778
1759
|
border-radius: var(--x-size-base-01) !important;
|
|
1779
1760
|
}
|
|
1780
1761
|
[dir="ltr"] .x-border-radius--top-01 {
|
|
@@ -3375,12 +3356,12 @@
|
|
|
3375
3356
|
.x-text--stroke.x-small {
|
|
3376
3357
|
--x-string-text-decoration-small: line-through;
|
|
3377
3358
|
}
|
|
3378
|
-
:root {
|
|
3379
|
-
--x-color-text-secondary: var(--x-color-base-neutral-35);
|
|
3380
|
-
}
|
|
3381
3359
|
.x-text--secondary {
|
|
3382
3360
|
--x-color-text-default: var(--x-color-text-secondary);
|
|
3383
3361
|
}
|
|
3362
|
+
:root {
|
|
3363
|
+
--x-color-text-secondary: var(--x-color-base-neutral-35);
|
|
3364
|
+
}
|
|
3384
3365
|
.x-text--light.x-text {
|
|
3385
3366
|
--x-number-font-weight-text: var(--x-number-font-weight-base-light);
|
|
3386
3367
|
}
|
|
@@ -3436,6 +3417,21 @@
|
|
|
3436
3417
|
--x-size-line-height-small: var(--x-size-line-height-base-s);
|
|
3437
3418
|
--x-string-text-decoration-small: none;
|
|
3438
3419
|
}
|
|
3420
|
+
.x-text--bold.x-text {
|
|
3421
|
+
--x-number-font-weight-text: var(--x-number-font-weight-base-bold);
|
|
3422
|
+
}
|
|
3423
|
+
.x-text--bold.x-title1 {
|
|
3424
|
+
--x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
|
|
3425
|
+
}
|
|
3426
|
+
.x-text--bold.x-title2 {
|
|
3427
|
+
--x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
|
|
3428
|
+
}
|
|
3429
|
+
.x-text--bold.x-title3 {
|
|
3430
|
+
--x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
|
|
3431
|
+
}
|
|
3432
|
+
.x-text--bold.x-small {
|
|
3433
|
+
--x-number-font-weight-small: var(--x-number-font-weight-base-bold);
|
|
3434
|
+
}
|
|
3439
3435
|
:root {
|
|
3440
3436
|
--x-font-family-base: "Montserrat", sans-serif;
|
|
3441
3437
|
--x-size-font-base-xs: 12px;
|
|
@@ -3538,27 +3534,9 @@
|
|
|
3538
3534
|
overflow: hidden;
|
|
3539
3535
|
white-space: nowrap;
|
|
3540
3536
|
}
|
|
3541
|
-
.x-text--bold.x-text {
|
|
3542
|
-
--x-number-font-weight-text: var(--x-number-font-weight-base-bold);
|
|
3543
|
-
}
|
|
3544
|
-
.x-text--bold.x-title1 {
|
|
3545
|
-
--x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
|
|
3546
|
-
}
|
|
3547
|
-
.x-text--bold.x-title2 {
|
|
3548
|
-
--x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
|
|
3549
|
-
}
|
|
3550
|
-
.x-text--bold.x-title3 {
|
|
3551
|
-
--x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
|
|
3552
|
-
}
|
|
3553
|
-
.x-text--bold.x-small {
|
|
3554
|
-
--x-number-font-weight-small: var(--x-number-font-weight-base-bold);
|
|
3555
|
-
}
|
|
3556
3537
|
:root {
|
|
3557
3538
|
--x-color-text-accent: var(--x-color-base-accent);
|
|
3558
3539
|
}
|
|
3559
|
-
.x-text--accent {
|
|
3560
|
-
--x-color-text-default: var(--x-color-text-accent);
|
|
3561
|
-
}
|
|
3562
3540
|
:root {
|
|
3563
3541
|
--x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
|
|
3564
3542
|
--x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
|
|
@@ -3566,18 +3544,6 @@
|
|
|
3566
3544
|
--x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
|
|
3567
3545
|
--x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
|
|
3568
3546
|
}
|
|
3569
|
-
:root {
|
|
3570
|
-
--x-color-background-tag-ghost: transparent;
|
|
3571
|
-
--x-color-border-tag-ghost: transparent;
|
|
3572
|
-
--x-color-background-tag-selected-ghost: transparent;
|
|
3573
|
-
--x-color-border-tag-selected-ghost: transparent;
|
|
3574
|
-
--x-color-background-tag-curated-ghost: transparent;
|
|
3575
|
-
--x-color-border-tag-curated-ghost: transparent;
|
|
3576
|
-
--x-color-background-tag-curated-selected-ghost: transparent;
|
|
3577
|
-
--x-color-border-tag-curated-selected-ghost: transparent;
|
|
3578
|
-
--x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3579
|
-
--x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3580
|
-
}
|
|
3581
3547
|
:root {
|
|
3582
3548
|
--x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
|
|
3583
3549
|
--x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
|
|
@@ -3608,23 +3574,8 @@
|
|
|
3608
3574
|
--x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3609
3575
|
--x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3610
3576
|
}
|
|
3611
|
-
|
|
3612
|
-
|
|
3613
|
-
.x-tag--ghost .x-tag {
|
|
3614
|
-
--x-color-background-tag-default: var(--x-color-background-tag-ghost);
|
|
3615
|
-
--x-color-border-tag-default: var(--x-color-border-tag-ghost);
|
|
3616
|
-
--x-color-background-tag-default-curated: var(--x-color-background-tag-curated-ghost);
|
|
3617
|
-
--x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
|
|
3618
|
-
--x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
|
|
3619
|
-
--x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
|
|
3620
|
-
--x-color-background-tag-default-curated-selected: var(
|
|
3621
|
-
--x-color-background-tag-curated-selected-ghost
|
|
3622
|
-
);
|
|
3623
|
-
--x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
|
|
3624
|
-
--x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
|
|
3625
|
-
--x-number-font-weight-tag-default-curated-selected: var(
|
|
3626
|
-
--x-number-font-weight-tag-curated-selected-ghost
|
|
3627
|
-
);
|
|
3577
|
+
.x-text--accent {
|
|
3578
|
+
--x-color-text-default: var(--x-color-text-accent);
|
|
3628
3579
|
}
|
|
3629
3580
|
:root {
|
|
3630
3581
|
--x-color-background-tag-default: var(--x-color-base-neutral-100);
|
|
@@ -3672,6 +3623,36 @@
|
|
|
3672
3623
|
--x-number-font-weight-tag-default-selected
|
|
3673
3624
|
);
|
|
3674
3625
|
}
|
|
3626
|
+
:root {
|
|
3627
|
+
--x-color-background-tag-ghost: transparent;
|
|
3628
|
+
--x-color-border-tag-ghost: transparent;
|
|
3629
|
+
--x-color-background-tag-selected-ghost: transparent;
|
|
3630
|
+
--x-color-border-tag-selected-ghost: transparent;
|
|
3631
|
+
--x-color-background-tag-curated-ghost: transparent;
|
|
3632
|
+
--x-color-border-tag-curated-ghost: transparent;
|
|
3633
|
+
--x-color-background-tag-curated-selected-ghost: transparent;
|
|
3634
|
+
--x-color-border-tag-curated-selected-ghost: transparent;
|
|
3635
|
+
--x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3636
|
+
--x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
|
|
3637
|
+
}
|
|
3638
|
+
|
|
3639
|
+
.x-tag--ghost.x-tag,
|
|
3640
|
+
.x-tag--ghost .x-tag {
|
|
3641
|
+
--x-color-background-tag-default: var(--x-color-background-tag-ghost);
|
|
3642
|
+
--x-color-border-tag-default: var(--x-color-border-tag-ghost);
|
|
3643
|
+
--x-color-background-tag-default-curated: var(--x-color-background-tag-curated-ghost);
|
|
3644
|
+
--x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
|
|
3645
|
+
--x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
|
|
3646
|
+
--x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
|
|
3647
|
+
--x-color-background-tag-default-curated-selected: var(
|
|
3648
|
+
--x-color-background-tag-curated-selected-ghost
|
|
3649
|
+
);
|
|
3650
|
+
--x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
|
|
3651
|
+
--x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
|
|
3652
|
+
--x-number-font-weight-tag-default-curated-selected: var(
|
|
3653
|
+
--x-number-font-weight-tag-curated-selected-ghost
|
|
3654
|
+
);
|
|
3655
|
+
}
|
|
3675
3656
|
:root {
|
|
3676
3657
|
--x-color-background-tag-default: var(--x-color-base-neutral-100);
|
|
3677
3658
|
--x-color-border-tag-default: var(--x-color-text-tag-default);
|
|
@@ -4165,6 +4146,12 @@
|
|
|
4165
4146
|
--x-number-font-weight-suggestion-default-matching
|
|
4166
4147
|
);
|
|
4167
4148
|
}
|
|
4149
|
+
:root {
|
|
4150
|
+
--x-color-background-sliding-panel: var(--x-color-base-neutral-100);
|
|
4151
|
+
--x-size-width-sliding-panel-gradient: var(--x-size-base-09);
|
|
4152
|
+
--x-size-padding-sliding-panel-button: var(--x-size-base-03);
|
|
4153
|
+
--x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
|
|
4154
|
+
}
|
|
4168
4155
|
:root {
|
|
4169
4156
|
--x-string-align-items-suggestion-default: center;
|
|
4170
4157
|
--x-color-text-suggestion-default: var(--x-color-text-default);
|
|
@@ -4387,12 +4374,6 @@
|
|
|
4387
4374
|
--x-color-text-suggestion-default-matching-curated
|
|
4388
4375
|
);
|
|
4389
4376
|
}
|
|
4390
|
-
:root {
|
|
4391
|
-
--x-color-background-sliding-panel: var(--x-color-base-neutral-100);
|
|
4392
|
-
--x-size-width-sliding-panel-gradient: var(--x-size-base-09);
|
|
4393
|
-
--x-size-padding-sliding-panel-button: var(--x-size-base-03);
|
|
4394
|
-
--x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
|
|
4395
|
-
}
|
|
4396
4377
|
.x-sliding-panel {
|
|
4397
4378
|
z-index: 0;
|
|
4398
4379
|
background-color: var(--x-color-background-sliding-panel);
|
|
@@ -4661,6 +4642,84 @@
|
|
|
4661
4642
|
--x-size-span-row-item: 1;
|
|
4662
4643
|
--x-size-start-row-item: 0;
|
|
4663
4644
|
}
|
|
4645
|
+
:root {
|
|
4646
|
+
--x-color-border-result-default: var(--x-color-base-lead);
|
|
4647
|
+
--x-color-border-result-overlay-default: var(--x-color-border-result-default);
|
|
4648
|
+
--x-color-border-result-description-default: var(--x-color-border-result-default);
|
|
4649
|
+
--x-color-border-result-picture-default: var(--x-color-border-result-default);
|
|
4650
|
+
--x-color-background-result-default: transparent;
|
|
4651
|
+
--x-size-padding-result-default: 0;
|
|
4652
|
+
--x-size-padding-result-overlay-default: 0;
|
|
4653
|
+
--x-size-padding-result-description-default: 0;
|
|
4654
|
+
--x-size-gap-result-default: var(--x-size-base-03);
|
|
4655
|
+
--x-size-padding-result-picture-default: 0;
|
|
4656
|
+
--x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
|
|
4657
|
+
--x-size-border-width-result-default: 0;
|
|
4658
|
+
--x-size-border-width-result-overlay-default: 0;
|
|
4659
|
+
--x-size-border-width-result-description-default: 0;
|
|
4660
|
+
--x-size-border-width-result-picture-default: 0;
|
|
4661
|
+
}
|
|
4662
|
+
|
|
4663
|
+
.x-result {
|
|
4664
|
+
display: grid;
|
|
4665
|
+
grid-template-columns: [result-start] 1fr [result-end];
|
|
4666
|
+
grid-template-rows: [picture-start] auto [overlay-start] auto [picture-end overlay-end description-start] 1fr [description-end];
|
|
4667
|
+
box-sizing: border-box;
|
|
4668
|
+
background-color: var(--x-color-background-result-default);
|
|
4669
|
+
border-color: var(--x-color-border-result-default);
|
|
4670
|
+
padding: var(--x-size-padding-result-default);
|
|
4671
|
+
gap: var(--x-size-gap-result-default);
|
|
4672
|
+
border-style: solid;
|
|
4673
|
+
border-width: var(--x-size-border-width-result-default);
|
|
4674
|
+
border-radius: var(--x-size-border-radius-result-default);
|
|
4675
|
+
}
|
|
4676
|
+
.x-result > * {
|
|
4677
|
+
min-width: 0;
|
|
4678
|
+
}
|
|
4679
|
+
.x-result__picture {
|
|
4680
|
+
grid-column: result;
|
|
4681
|
+
grid-row: picture;
|
|
4682
|
+
}
|
|
4683
|
+
.x-result__overlay {
|
|
4684
|
+
grid-column: result;
|
|
4685
|
+
grid-row: overlay;
|
|
4686
|
+
z-index: 1;
|
|
4687
|
+
border-color: var(--x-color-border-result-overlay-default);
|
|
4688
|
+
padding: var(--x-size-padding-result-overlay-default);
|
|
4689
|
+
border-style: solid;
|
|
4690
|
+
border-width: var(--x-size-border-width-result-overlay-default);
|
|
4691
|
+
opacity: 0;
|
|
4692
|
+
}
|
|
4693
|
+
.x-result__description {
|
|
4694
|
+
grid-column: result;
|
|
4695
|
+
grid-row: description;
|
|
4696
|
+
border-color: var(--x-color-border-result-description-default);
|
|
4697
|
+
padding: var(--x-size-padding-result-description-default);
|
|
4698
|
+
border-style: solid;
|
|
4699
|
+
border-width: var(--x-size-border-width-result-description-default);
|
|
4700
|
+
}
|
|
4701
|
+
.x-result__picture {
|
|
4702
|
+
border-color: var(--x-color-border-result-picture-default);
|
|
4703
|
+
padding: var(--x-size-padding-result-picture-default);
|
|
4704
|
+
border-style: solid;
|
|
4705
|
+
border-width: var(--x-size-border-width-result-picture-default);
|
|
4706
|
+
}
|
|
4707
|
+
.x-result:hover .x-result__overlay {
|
|
4708
|
+
opacity: 1;
|
|
4709
|
+
}
|
|
4710
|
+
@media (hover: none) {
|
|
4711
|
+
.x-result .x-result__overlay {
|
|
4712
|
+
opacity: 1;
|
|
4713
|
+
}
|
|
4714
|
+
}
|
|
4715
|
+
:root {
|
|
4716
|
+
--x-size-gap-row: 0;
|
|
4717
|
+
--x-size-padding-row: 0;
|
|
4718
|
+
--x-size-justify-row: stretch;
|
|
4719
|
+
--x-size-align-row: center;
|
|
4720
|
+
--x-size-span-row-item: 1;
|
|
4721
|
+
--x-size-start-row-item: 0;
|
|
4722
|
+
}
|
|
4664
4723
|
|
|
4665
4724
|
.x-row {
|
|
4666
4725
|
display: grid;
|
|
@@ -4782,29 +4841,7 @@
|
|
|
4782
4841
|
--x-size-align-row: stretch;
|
|
4783
4842
|
}
|
|
4784
4843
|
:root {
|
|
4785
|
-
--x-size-
|
|
4786
|
-
--x-size-padding-row: 0;
|
|
4787
|
-
--x-size-justify-row: stretch;
|
|
4788
|
-
--x-size-align-row: center;
|
|
4789
|
-
--x-size-span-row-item: 1;
|
|
4790
|
-
--x-size-start-row-item: 0;
|
|
4791
|
-
}
|
|
4792
|
-
:root {
|
|
4793
|
-
--x-color-border-result-default: var(--x-color-base-lead);
|
|
4794
|
-
--x-color-border-result-overlay-default: var(--x-color-border-result-default);
|
|
4795
|
-
--x-color-border-result-description-default: var(--x-color-border-result-default);
|
|
4796
|
-
--x-color-border-result-picture-default: var(--x-color-border-result-default);
|
|
4797
|
-
--x-color-background-result-default: transparent;
|
|
4798
|
-
--x-size-padding-result-default: 0;
|
|
4799
|
-
--x-size-padding-result-overlay-default: 0;
|
|
4800
|
-
--x-size-padding-result-description-default: 0;
|
|
4801
|
-
--x-size-gap-result-default: var(--x-size-base-03);
|
|
4802
|
-
--x-size-padding-result-picture-default: 0;
|
|
4803
|
-
--x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
|
|
4804
|
-
--x-size-border-width-result-default: 0;
|
|
4805
|
-
--x-size-border-width-result-overlay-default: 0;
|
|
4806
|
-
--x-size-border-width-result-description-default: 0;
|
|
4807
|
-
--x-size-border-width-result-picture-default: 0;
|
|
4844
|
+
--x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
|
|
4808
4845
|
}
|
|
4809
4846
|
:root {
|
|
4810
4847
|
--x-color-border-result-default: var(--x-color-base-lead);
|
|
@@ -4823,62 +4860,6 @@
|
|
|
4823
4860
|
--x-size-border-width-result-description-default: 0;
|
|
4824
4861
|
--x-size-border-width-result-picture-default: 0;
|
|
4825
4862
|
}
|
|
4826
|
-
|
|
4827
|
-
.x-result {
|
|
4828
|
-
display: grid;
|
|
4829
|
-
grid-template-columns: [result-start] 1fr [result-end];
|
|
4830
|
-
grid-template-rows: [picture-start] auto [overlay-start] auto [picture-end overlay-end description-start] 1fr [description-end];
|
|
4831
|
-
box-sizing: border-box;
|
|
4832
|
-
background-color: var(--x-color-background-result-default);
|
|
4833
|
-
border-color: var(--x-color-border-result-default);
|
|
4834
|
-
padding: var(--x-size-padding-result-default);
|
|
4835
|
-
gap: var(--x-size-gap-result-default);
|
|
4836
|
-
border-style: solid;
|
|
4837
|
-
border-width: var(--x-size-border-width-result-default);
|
|
4838
|
-
border-radius: var(--x-size-border-radius-result-default);
|
|
4839
|
-
}
|
|
4840
|
-
.x-result > * {
|
|
4841
|
-
min-width: 0;
|
|
4842
|
-
}
|
|
4843
|
-
.x-result__picture {
|
|
4844
|
-
grid-column: result;
|
|
4845
|
-
grid-row: picture;
|
|
4846
|
-
}
|
|
4847
|
-
.x-result__overlay {
|
|
4848
|
-
grid-column: result;
|
|
4849
|
-
grid-row: overlay;
|
|
4850
|
-
z-index: 1;
|
|
4851
|
-
border-color: var(--x-color-border-result-overlay-default);
|
|
4852
|
-
padding: var(--x-size-padding-result-overlay-default);
|
|
4853
|
-
border-style: solid;
|
|
4854
|
-
border-width: var(--x-size-border-width-result-overlay-default);
|
|
4855
|
-
opacity: 0;
|
|
4856
|
-
}
|
|
4857
|
-
.x-result__description {
|
|
4858
|
-
grid-column: result;
|
|
4859
|
-
grid-row: description;
|
|
4860
|
-
border-color: var(--x-color-border-result-description-default);
|
|
4861
|
-
padding: var(--x-size-padding-result-description-default);
|
|
4862
|
-
border-style: solid;
|
|
4863
|
-
border-width: var(--x-size-border-width-result-description-default);
|
|
4864
|
-
}
|
|
4865
|
-
.x-result__picture {
|
|
4866
|
-
border-color: var(--x-color-border-result-picture-default);
|
|
4867
|
-
padding: var(--x-size-padding-result-picture-default);
|
|
4868
|
-
border-style: solid;
|
|
4869
|
-
border-width: var(--x-size-border-width-result-picture-default);
|
|
4870
|
-
}
|
|
4871
|
-
.x-result:hover .x-result__overlay {
|
|
4872
|
-
opacity: 1;
|
|
4873
|
-
}
|
|
4874
|
-
@media (hover: none) {
|
|
4875
|
-
.x-result .x-result__overlay {
|
|
4876
|
-
opacity: 1;
|
|
4877
|
-
}
|
|
4878
|
-
}
|
|
4879
|
-
:root {
|
|
4880
|
-
--x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
|
|
4881
|
-
}
|
|
4882
4863
|
:root {
|
|
4883
4864
|
--x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
|
|
4884
4865
|
}
|
|
@@ -5051,12 +5032,6 @@
|
|
|
5051
5032
|
--x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5052
5033
|
--x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5053
5034
|
}
|
|
5054
|
-
:root {
|
|
5055
|
-
--x-color-background-picture-colored: var(--x-color-base-neutral-95);
|
|
5056
|
-
--x-mix-blend-mode-picture-colored: multiply;
|
|
5057
|
-
--x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5058
|
-
--x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5059
|
-
}
|
|
5060
5035
|
|
|
5061
5036
|
.x-picture--colored.x-picture {
|
|
5062
5037
|
--x-color-background-picture-default: var(--x-color-background-picture-colored);
|
|
@@ -5070,6 +5045,12 @@
|
|
|
5070
5045
|
.x-picture--colored.x-picture .x-picture--placeholder {
|
|
5071
5046
|
--x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
|
|
5072
5047
|
}
|
|
5048
|
+
:root {
|
|
5049
|
+
--x-color-background-picture-colored: var(--x-color-base-neutral-95);
|
|
5050
|
+
--x-mix-blend-mode-picture-colored: multiply;
|
|
5051
|
+
--x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5052
|
+
--x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
|
|
5053
|
+
}
|
|
5073
5054
|
:root {
|
|
5074
5055
|
--x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
|
|
5075
5056
|
--x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
|
|
@@ -5142,80 +5123,35 @@
|
|
|
5142
5123
|
--x-size-border-width-right-option-list-item-default: var(
|
|
5143
5124
|
--x-size-border-width-option-list-item-default
|
|
5144
5125
|
);
|
|
5145
|
-
--x-size-border-width-bottom-option-list-item-default: 0;
|
|
5146
|
-
--x-size-border-width-left-option-list-item-default: 0;
|
|
5147
|
-
--x-size-border-width-top-option-list-item-default-selected: var(
|
|
5148
|
-
--x-size-border-width-top-option-list-item-default
|
|
5149
|
-
);
|
|
5150
|
-
--x-size-border-width-right-option-list-item-default-selected: var(
|
|
5151
|
-
--x-size-border-width-right-option-list-item-default
|
|
5152
|
-
);
|
|
5153
|
-
--x-size-border-width-bottom-option-list-item-default-selected: var(
|
|
5154
|
-
--x-size-border-width-bottom-option-list-item-default
|
|
5155
|
-
);
|
|
5156
|
-
--x-size-border-width-left-option-list-item-default-selected: var(
|
|
5157
|
-
--x-size-border-width-left-option-list-item-default
|
|
5158
|
-
);
|
|
5159
|
-
--x-size-padding-option-list-button-default: var(--x-size-base-02);
|
|
5160
|
-
--x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
|
|
5161
|
-
--x-size-padding-right-option-list-button-default: var(
|
|
5162
|
-
--x-size-padding-option-list-button-default
|
|
5163
|
-
);
|
|
5164
|
-
--x-size-padding-bottom-option-list-button-default: var(
|
|
5165
|
-
--x-size-padding-option-list-button-default
|
|
5166
|
-
);
|
|
5167
|
-
--x-size-padding-left-option-list-button-default: var(
|
|
5168
|
-
--x-size-padding-option-list-button-default
|
|
5169
|
-
);
|
|
5170
|
-
--x-font-decoration-option-list-button-default-hover: underline;
|
|
5171
|
-
--x-size-font-option-list-button-default: var(--x-size-font-text);
|
|
5172
|
-
--x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
|
|
5173
|
-
--x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
|
|
5174
|
-
}
|
|
5175
|
-
:root {
|
|
5176
|
-
--x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
|
|
5177
|
-
--x-color-text-option-list-button-bottom-selected-hover: var(
|
|
5178
|
-
--x-color-text-option-list-button-bottom-selected
|
|
5179
|
-
);
|
|
5180
|
-
--x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
|
|
5181
|
-
--x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
|
|
5182
|
-
--x-color-border-option-list-item-bottom: transparent;
|
|
5183
|
-
--x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5184
|
-
--x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5185
|
-
--x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5186
|
-
--x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5187
|
-
--x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
|
|
5188
|
-
--x-color-border-top-option-list-item-bottom-selected: var(
|
|
5189
|
-
--x-color-border-option-list-item-bottom
|
|
5126
|
+
--x-size-border-width-bottom-option-list-item-default: 0;
|
|
5127
|
+
--x-size-border-width-left-option-list-item-default: 0;
|
|
5128
|
+
--x-size-border-width-top-option-list-item-default-selected: var(
|
|
5129
|
+
--x-size-border-width-top-option-list-item-default
|
|
5190
5130
|
);
|
|
5191
|
-
--x-
|
|
5192
|
-
--x-
|
|
5131
|
+
--x-size-border-width-right-option-list-item-default-selected: var(
|
|
5132
|
+
--x-size-border-width-right-option-list-item-default
|
|
5193
5133
|
);
|
|
5194
|
-
--x-
|
|
5195
|
-
--x-
|
|
5134
|
+
--x-size-border-width-bottom-option-list-item-default-selected: var(
|
|
5135
|
+
--x-size-border-width-bottom-option-list-item-default
|
|
5196
5136
|
);
|
|
5197
|
-
--x-
|
|
5198
|
-
--x-
|
|
5137
|
+
--x-size-border-width-left-option-list-item-default-selected: var(
|
|
5138
|
+
--x-size-border-width-left-option-list-item-default
|
|
5199
5139
|
);
|
|
5200
|
-
--x-size-
|
|
5201
|
-
--x-size-
|
|
5202
|
-
--x-size-
|
|
5203
|
-
|
|
5204
|
-
--x-size-border-width-option-list-item-bottom
|
|
5140
|
+
--x-size-padding-option-list-button-default: var(--x-size-base-02);
|
|
5141
|
+
--x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
|
|
5142
|
+
--x-size-padding-right-option-list-button-default: var(
|
|
5143
|
+
--x-size-padding-option-list-button-default
|
|
5205
5144
|
);
|
|
5206
|
-
--x-size-
|
|
5207
|
-
|
|
5208
|
-
--x-size-border-width-right-option-list-item-bottom-selected: 0;
|
|
5209
|
-
--x-size-border-width-bottom-option-list-item-bottom-selected: var(
|
|
5210
|
-
--x-size-border-width-option-list-item-bottom
|
|
5145
|
+
--x-size-padding-bottom-option-list-button-default: var(
|
|
5146
|
+
--x-size-padding-option-list-button-default
|
|
5211
5147
|
);
|
|
5212
|
-
--x-size-
|
|
5213
|
-
|
|
5214
|
-
--x-font-decoration-option-list-button-bottom-hover: none;
|
|
5215
|
-
--x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
|
|
5216
|
-
--x-number-font-weight-option-list-button-bottom-selected: var(
|
|
5217
|
-
--x-number-font-weight-base-regular
|
|
5148
|
+
--x-size-padding-left-option-list-button-default: var(
|
|
5149
|
+
--x-size-padding-option-list-button-default
|
|
5218
5150
|
);
|
|
5151
|
+
--x-font-decoration-option-list-button-default-hover: underline;
|
|
5152
|
+
--x-size-font-option-list-button-default: var(--x-size-font-text);
|
|
5153
|
+
--x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
|
|
5154
|
+
--x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
|
|
5219
5155
|
}
|
|
5220
5156
|
:root {
|
|
5221
5157
|
--x-color-background-option-list-button-default: transparent;
|
|
@@ -5454,6 +5390,51 @@
|
|
|
5454
5390
|
--x-number-font-weight-base-regular
|
|
5455
5391
|
);
|
|
5456
5392
|
}
|
|
5393
|
+
:root {
|
|
5394
|
+
--x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
|
|
5395
|
+
--x-color-text-option-list-button-bottom-selected-hover: var(
|
|
5396
|
+
--x-color-text-option-list-button-bottom-selected
|
|
5397
|
+
);
|
|
5398
|
+
--x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
|
|
5399
|
+
--x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
|
|
5400
|
+
--x-color-border-option-list-item-bottom: transparent;
|
|
5401
|
+
--x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5402
|
+
--x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5403
|
+
--x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5404
|
+
--x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
|
|
5405
|
+
--x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
|
|
5406
|
+
--x-color-border-top-option-list-item-bottom-selected: var(
|
|
5407
|
+
--x-color-border-option-list-item-bottom
|
|
5408
|
+
);
|
|
5409
|
+
--x-color-border-right-option-list-item-bottom-selected: var(
|
|
5410
|
+
--x-color-border-option-list-item-bottom
|
|
5411
|
+
);
|
|
5412
|
+
--x-color-border-bottom-option-list-item-bottom-selected: var(
|
|
5413
|
+
--x-color-border-option-list-item-bottom-selected
|
|
5414
|
+
);
|
|
5415
|
+
--x-color-border-left-option-list-item-bottom-selected: var(
|
|
5416
|
+
--x-color-border-option-list-item-bottom
|
|
5417
|
+
);
|
|
5418
|
+
--x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
|
|
5419
|
+
--x-size-border-width-top-option-list-item-bottom: 0;
|
|
5420
|
+
--x-size-border-width-right-option-list-item-bottom: 0;
|
|
5421
|
+
--x-size-border-width-bottom-option-list-item-bottom: var(
|
|
5422
|
+
--x-size-border-width-option-list-item-bottom
|
|
5423
|
+
);
|
|
5424
|
+
--x-size-border-width-left-option-list-item-bottom: 0;
|
|
5425
|
+
--x-size-border-width-top-option-list-item-bottom-selected: 0;
|
|
5426
|
+
--x-size-border-width-right-option-list-item-bottom-selected: 0;
|
|
5427
|
+
--x-size-border-width-bottom-option-list-item-bottom-selected: var(
|
|
5428
|
+
--x-size-border-width-option-list-item-bottom
|
|
5429
|
+
);
|
|
5430
|
+
--x-size-border-width-left-option-list-item-bottom-selected: 0;
|
|
5431
|
+
--x-size-font-option-list-button-bottom: var(--x-size-font-text);
|
|
5432
|
+
--x-font-decoration-option-list-button-bottom-hover: none;
|
|
5433
|
+
--x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
|
|
5434
|
+
--x-number-font-weight-option-list-button-bottom-selected: var(
|
|
5435
|
+
--x-number-font-weight-base-regular
|
|
5436
|
+
);
|
|
5437
|
+
}
|
|
5457
5438
|
|
|
5458
5439
|
.x-option-list--bottom.x-option-list,
|
|
5459
5440
|
.x-option-list--bottom .x-option-list {
|
|
@@ -7064,6 +7045,13 @@
|
|
|
7064
7045
|
--x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
|
|
7065
7046
|
--x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
|
|
7066
7047
|
}
|
|
7048
|
+
:root {
|
|
7049
|
+
--x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
|
|
7050
|
+
--x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
|
|
7051
|
+
--x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
|
|
7052
|
+
--x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
|
|
7053
|
+
--x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
|
|
7054
|
+
}
|
|
7067
7055
|
|
|
7068
7056
|
.x-input--pill.x-input,
|
|
7069
7057
|
.x-input--pill .x-input {
|
|
@@ -7074,11 +7062,14 @@
|
|
|
7074
7062
|
--x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
|
|
7075
7063
|
}
|
|
7076
7064
|
:root {
|
|
7077
|
-
--x-size-
|
|
7078
|
-
--x-size-
|
|
7079
|
-
--x-size-
|
|
7080
|
-
--x-size-
|
|
7081
|
-
--x-size-border-
|
|
7065
|
+
--x-size-padding-top-input-line: var(--x-size-base-03);
|
|
7066
|
+
--x-size-padding-right-input-line: 0;
|
|
7067
|
+
--x-size-padding-bottom-input-line: var(--x-size-base-03);
|
|
7068
|
+
--x-size-padding-left-input-line: 0;
|
|
7069
|
+
--x-size-border-width-top-input-line: 0;
|
|
7070
|
+
--x-size-border-width-right-input-line: 0;
|
|
7071
|
+
--x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
|
|
7072
|
+
--x-size-border-width-left-input-line: 0;
|
|
7082
7073
|
}
|
|
7083
7074
|
:root {
|
|
7084
7075
|
--x-size-padding-top-input-line: var(--x-size-base-03);
|
|
@@ -7102,16 +7093,6 @@
|
|
|
7102
7093
|
--x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
|
|
7103
7094
|
--x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
|
|
7104
7095
|
}
|
|
7105
|
-
:root {
|
|
7106
|
-
--x-size-padding-top-input-line: var(--x-size-base-03);
|
|
7107
|
-
--x-size-padding-right-input-line: 0;
|
|
7108
|
-
--x-size-padding-bottom-input-line: var(--x-size-base-03);
|
|
7109
|
-
--x-size-padding-left-input-line: 0;
|
|
7110
|
-
--x-size-border-width-top-input-line: 0;
|
|
7111
|
-
--x-size-border-width-right-input-line: 0;
|
|
7112
|
-
--x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
|
|
7113
|
-
--x-size-border-width-left-input-line: 0;
|
|
7114
|
-
}
|
|
7115
7096
|
:root {
|
|
7116
7097
|
--x-color-background-input-default: var(--x-color-base-neutral-100);
|
|
7117
7098
|
--x-color-border-input-default: var(--x-color-base-neutral-70);
|
|
@@ -7279,6 +7260,10 @@
|
|
|
7279
7260
|
--x-size-width-icon-xl: var(--x-size-base-07);
|
|
7280
7261
|
--x-size-height-icon-xl: var(--x-size-base-07);
|
|
7281
7262
|
}
|
|
7263
|
+
:root {
|
|
7264
|
+
--x-size-width-icon-s: var(--x-size-base-03);
|
|
7265
|
+
--x-size-height-icon-s: var(--x-size-base-03);
|
|
7266
|
+
}
|
|
7282
7267
|
:root {
|
|
7283
7268
|
--x-size-width-icon-xl: var(--x-size-base-07);
|
|
7284
7269
|
--x-size-height-icon-xl: var(--x-size-base-07);
|
|
@@ -7292,10 +7277,6 @@
|
|
|
7292
7277
|
--x-size-width-icon-s: var(--x-size-base-03);
|
|
7293
7278
|
--x-size-height-icon-s: var(--x-size-base-03);
|
|
7294
7279
|
}
|
|
7295
|
-
:root {
|
|
7296
|
-
--x-size-width-icon-s: var(--x-size-base-03);
|
|
7297
|
-
--x-size-height-icon-s: var(--x-size-base-03);
|
|
7298
|
-
}
|
|
7299
7280
|
|
|
7300
7281
|
.x-icon--s {
|
|
7301
7282
|
--x-size-width-icon-default: var(--x-size-width-icon-s);
|
|
@@ -7336,11 +7317,6 @@
|
|
|
7336
7317
|
--x-string-stroke-linejoin-icon-default: mitter;
|
|
7337
7318
|
--x-size-stroke-width-icon-default: 1px;
|
|
7338
7319
|
}
|
|
7339
|
-
:root {
|
|
7340
|
-
--x-size-padding-grid: 0;
|
|
7341
|
-
--x-size-gap-grid: var(--x-size-base-03);
|
|
7342
|
-
--x-size-min-width-grid-item: 150px;
|
|
7343
|
-
}
|
|
7344
7320
|
:root {
|
|
7345
7321
|
--x-color-stroke-icon-default: currentColor;
|
|
7346
7322
|
--x-color-fill-icon-default: none;
|
|
@@ -7376,6 +7352,11 @@
|
|
|
7376
7352
|
--x-size-gap-grid: var(--x-size-base-03);
|
|
7377
7353
|
--x-size-min-width-grid-item: 150px;
|
|
7378
7354
|
}
|
|
7355
|
+
:root {
|
|
7356
|
+
--x-size-padding-grid: 0;
|
|
7357
|
+
--x-size-gap-grid: var(--x-size-base-03);
|
|
7358
|
+
--x-size-min-width-grid-item: 150px;
|
|
7359
|
+
}
|
|
7379
7360
|
|
|
7380
7361
|
.x-grid-list {
|
|
7381
7362
|
margin: 0;
|
|
@@ -8448,17 +8429,6 @@
|
|
|
8448
8429
|
--x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
|
|
8449
8430
|
--x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
|
|
8450
8431
|
}
|
|
8451
|
-
|
|
8452
|
-
.x-button--secondary.x-button,
|
|
8453
|
-
.x-button--secondary .x-button {
|
|
8454
|
-
--x-color-background-button-default: var(--x-color-background-button-secondary);
|
|
8455
|
-
--x-color-border-button-default: var(--x-color-border-button-secondary);
|
|
8456
|
-
--x-color-text-button-default: var(--x-color-text-button-secondary);
|
|
8457
|
-
--x-size-border-width-top-button-default: var(--x-size-border-width-top-button-secondary);
|
|
8458
|
-
--x-size-border-width-right-button-default: var(--x-size-border-width-right-button-secondary);
|
|
8459
|
-
--x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-secondary);
|
|
8460
|
-
--x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
|
|
8461
|
-
}
|
|
8462
8432
|
:root {
|
|
8463
8433
|
--x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
|
|
8464
8434
|
--x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
|
|
@@ -8476,6 +8446,17 @@
|
|
|
8476
8446
|
--x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
|
|
8477
8447
|
--x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
|
|
8478
8448
|
}
|
|
8449
|
+
|
|
8450
|
+
.x-button--secondary.x-button,
|
|
8451
|
+
.x-button--secondary .x-button {
|
|
8452
|
+
--x-color-background-button-default: var(--x-color-background-button-secondary);
|
|
8453
|
+
--x-color-border-button-default: var(--x-color-border-button-secondary);
|
|
8454
|
+
--x-color-text-button-default: var(--x-color-text-button-secondary);
|
|
8455
|
+
--x-size-border-width-top-button-default: var(--x-size-border-width-top-button-secondary);
|
|
8456
|
+
--x-size-border-width-right-button-default: var(--x-size-border-width-right-button-secondary);
|
|
8457
|
+
--x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-secondary);
|
|
8458
|
+
--x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
|
|
8459
|
+
}
|
|
8479
8460
|
:root {
|
|
8480
8461
|
--x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
|
|
8481
8462
|
--x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
|
|
@@ -8511,6 +8492,16 @@
|
|
|
8511
8492
|
--x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
|
|
8512
8493
|
--x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
|
|
8513
8494
|
}
|
|
8495
|
+
:root {
|
|
8496
|
+
--x-color-background-button-primary: var(--x-color-background-button-default);
|
|
8497
|
+
--x-color-border-button-primary: var(--x-color-border-button-default);
|
|
8498
|
+
--x-color-text-button-primary: var(--x-color-text-button-default);
|
|
8499
|
+
--x-size-border-width-button-primary: var(--x-size-border-width-base);
|
|
8500
|
+
--x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
|
|
8501
|
+
--x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
|
|
8502
|
+
--x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
|
|
8503
|
+
--x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
|
|
8504
|
+
}
|
|
8514
8505
|
|
|
8515
8506
|
.x-button--primary.x-button,
|
|
8516
8507
|
.x-button--primary .x-button {
|
|
@@ -8522,16 +8513,6 @@
|
|
|
8522
8513
|
--x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-primary);
|
|
8523
8514
|
--x-size-border-width-left-button-default: var(--x-size-border-width-left-button-primary);
|
|
8524
8515
|
}
|
|
8525
|
-
:root {
|
|
8526
|
-
--x-color-background-button-primary: var(--x-color-background-button-default);
|
|
8527
|
-
--x-color-border-button-primary: var(--x-color-border-button-default);
|
|
8528
|
-
--x-color-text-button-primary: var(--x-color-text-button-default);
|
|
8529
|
-
--x-size-border-width-button-primary: var(--x-size-border-width-base);
|
|
8530
|
-
--x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
|
|
8531
|
-
--x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
|
|
8532
|
-
--x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
|
|
8533
|
-
--x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
|
|
8534
|
-
}
|
|
8535
8516
|
:root {
|
|
8536
8517
|
--x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
|
|
8537
8518
|
--x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
|
|
@@ -8611,29 +8592,6 @@
|
|
|
8611
8592
|
--x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
|
|
8612
8593
|
--x-size-line-height-button-default: var(--x-size-line-height-text);
|
|
8613
8594
|
}
|
|
8614
|
-
:root {
|
|
8615
|
-
--x-color-background-button-default: var(--x-color-base-lead);
|
|
8616
|
-
--x-color-border-button-default: var(--x-color-background-button-default);
|
|
8617
|
-
--x-color-text-button-default: var(--x-color-base-neutral-100);
|
|
8618
|
-
--x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
|
|
8619
|
-
--x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
|
|
8620
|
-
--x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
|
|
8621
|
-
--x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
|
|
8622
|
-
--x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
|
|
8623
|
-
--x-size-border-width-button-default: var(--x-size-border-width-base);
|
|
8624
|
-
--x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
|
|
8625
|
-
--x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
|
|
8626
|
-
--x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
|
|
8627
|
-
--x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
|
|
8628
|
-
--x-size-height-button-default: var(--x-size-base-08);
|
|
8629
|
-
--x-size-padding-right-button-default: var(--x-size-base-05);
|
|
8630
|
-
--x-size-padding-left-button-default: var(--x-size-base-05);
|
|
8631
|
-
--x-size-gap-button-default: var(--x-size-base-03);
|
|
8632
|
-
--x-font-family-button-default: var(--x-font-family-text);
|
|
8633
|
-
--x-size-font-button-default: var(--x-size-font-text);
|
|
8634
|
-
--x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
|
|
8635
|
-
--x-size-line-height-button-default: var(--x-size-line-height-text);
|
|
8636
|
-
}
|
|
8637
8595
|
|
|
8638
8596
|
[dir="ltr"] .x-button {
|
|
8639
8597
|
padding-right: var(--x-size-padding-right-button-default);
|
|
@@ -8696,6 +8654,29 @@
|
|
|
8696
8654
|
margin-right: var(--x-size-gap-button-default);
|
|
8697
8655
|
}
|
|
8698
8656
|
}
|
|
8657
|
+
:root {
|
|
8658
|
+
--x-color-background-button-default: var(--x-color-base-lead);
|
|
8659
|
+
--x-color-border-button-default: var(--x-color-background-button-default);
|
|
8660
|
+
--x-color-text-button-default: var(--x-color-base-neutral-100);
|
|
8661
|
+
--x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
|
|
8662
|
+
--x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
|
|
8663
|
+
--x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
|
|
8664
|
+
--x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
|
|
8665
|
+
--x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
|
|
8666
|
+
--x-size-border-width-button-default: var(--x-size-border-width-base);
|
|
8667
|
+
--x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
|
|
8668
|
+
--x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
|
|
8669
|
+
--x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
|
|
8670
|
+
--x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
|
|
8671
|
+
--x-size-height-button-default: var(--x-size-base-08);
|
|
8672
|
+
--x-size-padding-right-button-default: var(--x-size-base-05);
|
|
8673
|
+
--x-size-padding-left-button-default: var(--x-size-base-05);
|
|
8674
|
+
--x-size-gap-button-default: var(--x-size-base-03);
|
|
8675
|
+
--x-font-family-button-default: var(--x-font-family-text);
|
|
8676
|
+
--x-size-font-button-default: var(--x-size-font-text);
|
|
8677
|
+
--x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
|
|
8678
|
+
--x-size-line-height-button-default: var(--x-size-line-height-text);
|
|
8679
|
+
}
|
|
8699
8680
|
:root {
|
|
8700
8681
|
--x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
|
|
8701
8682
|
--x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
|
|
@@ -8797,6 +8778,13 @@
|
|
|
8797
8778
|
--x-color-base-disable: #e11f26;
|
|
8798
8779
|
--x-color-base-transparent: transparent;
|
|
8799
8780
|
}
|
|
8781
|
+
:root {
|
|
8782
|
+
--x-size-border-radius-base-none: 0;
|
|
8783
|
+
--x-size-border-radius-base-s: var(--x-size-base-02);
|
|
8784
|
+
--x-size-border-radius-base-m: var(--x-size-base-06);
|
|
8785
|
+
--x-size-border-radius-base-pill: 99999px;
|
|
8786
|
+
--x-size-border-width-base: 1px;
|
|
8787
|
+
}
|
|
8800
8788
|
:root {
|
|
8801
8789
|
--x-size-base-01: 2px;
|
|
8802
8790
|
--x-size-base-02: 4px;
|
|
@@ -8819,10 +8807,22 @@
|
|
|
8819
8807
|
--x-size-base-19: 280px;
|
|
8820
8808
|
--x-size-base-20: 344px;
|
|
8821
8809
|
}
|
|
8822
|
-
|
|
8823
|
-
|
|
8824
|
-
|
|
8825
|
-
|
|
8826
|
-
|
|
8827
|
-
|
|
8810
|
+
.x-underline {
|
|
8811
|
+
-webkit-text-decoration-line: underline;
|
|
8812
|
+
text-decoration-line: underline;
|
|
8813
|
+
}
|
|
8814
|
+
|
|
8815
|
+
.x-overline {
|
|
8816
|
+
-webkit-text-decoration-line: overline;
|
|
8817
|
+
text-decoration-line: overline;
|
|
8818
|
+
}
|
|
8819
|
+
|
|
8820
|
+
.x-line-through {
|
|
8821
|
+
-webkit-text-decoration-line: line-through;
|
|
8822
|
+
text-decoration-line: line-through;
|
|
8823
|
+
}
|
|
8824
|
+
|
|
8825
|
+
.x-no-underline {
|
|
8826
|
+
-webkit-text-decoration-line: none;
|
|
8827
|
+
text-decoration-line: none;
|
|
8828
8828
|
}
|
|
@@ -25,7 +25,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
25
25
|
"div",
|
|
26
26
|
{
|
|
27
27
|
ref: "slidingPanelContent",
|
|
28
|
-
class: normalizeClass(["x-related-prompt__sliding-panel-content", { "x-
|
|
28
|
+
class: normalizeClass(["x-related-prompt__sliding-panel-content", { "x-related-prompt__sliding-panel-content-selected": _ctx.selectedPrompt !== -1 }])
|
|
29
29
|
},
|
|
30
30
|
[
|
|
31
31
|
(openBlock(true), createElementBlock(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-prompts-tag-list.vue.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n <div>\n <template v-if=\"$slots.header\">\n <slot name=\"header\" />\n </template>\n <SlidingPanel\n :reset-on-content-change=\"true\"\n :button-class=\"buttonClass\"\n :scroll-container-class=\"\n selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n \"\n >\n <template #sliding-panel-left-button>\n <slot name=\"sliding-panel-left-button\" />\n </template>\n\n <slot name=\"sliding-panel-content\">\n <div\n ref=\"slidingPanelContent\"\n class=\"x-related-prompt__sliding-panel-content\"\n :class=\"{ 'x-
|
|
1
|
+
{"version":3,"file":"related-prompts-tag-list.vue.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n <div>\n <template v-if=\"$slots.header\">\n <slot name=\"header\" />\n </template>\n <SlidingPanel\n :reset-on-content-change=\"true\"\n :button-class=\"buttonClass\"\n :scroll-container-class=\"\n selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n \"\n >\n <template #sliding-panel-left-button>\n <slot name=\"sliding-panel-left-button\" />\n </template>\n\n <slot name=\"sliding-panel-content\">\n <div\n ref=\"slidingPanelContent\"\n class=\"x-related-prompt__sliding-panel-content\"\n :class=\"{ 'x-related-prompt__sliding-panel-content-selected': selectedPrompt !== -1 }\"\n >\n <div\n v-for=\"(suggestion, index) in relatedPrompts\"\n :key=\"index\"\n :style=\"{\n animationDelay: `${index * 0.4 + 0.05}s`\n }\"\n class=\"x-related-prompt x-staggered-initial\"\n :class=\"[\n { 'x-staggered-animation': arePromptsVisible },\n { 'x-hidden': hidePrompt(index) },\n { 'x-related-prompt-selected': isSelected(index) }\n ]\"\n data-test=\"related-prompt-item\"\n >\n <slot\n name=\"related-prompt-button\"\n v-bind=\"{ suggestion, index, arePromptsVisible, isSelected }\"\n >\n <RelatedPrompt\n :related-prompt=\"suggestion\"\n :index=\"index\"\n :is-prompt-visible=\"arePromptsVisible\"\n :is-selected=\"isSelected(index)\"\n />\n </slot>\n </div>\n </div>\n </slot>\n\n <template #sliding-panel-right-button>\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n </div>\n</template>\n<script lang=\"ts\">\n import { defineComponent, onMounted, onUnmounted, ref } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { useState } from '../../../composables/index';\n import RelatedPrompt from './related-prompt.vue';\n\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { RelatedPrompt, SlidingPanel },\n props: {\n buttonClass: String\n },\n setup() {\n const { relatedPrompts, selectedPrompt } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const slidingPanelContent = ref<Element>();\n const arePromptsVisible = ref(false);\n\n const observer = new IntersectionObserver(([entry]) => {\n arePromptsVisible.value = entry.isIntersecting;\n });\n\n onMounted(() => {\n observer.observe(slidingPanelContent.value as Element);\n });\n\n onUnmounted(() => {\n observer.disconnect();\n });\n\n const isSelected = (index: number): boolean => selectedPrompt.value === index;\n\n const hidePrompt = (index: number): boolean =>\n selectedPrompt.value !== -1 && selectedPrompt.value !== index;\n\n return {\n arePromptsVisible,\n hidePrompt,\n isSelected,\n relatedPrompts,\n selectedPrompt,\n slidingPanelContent\n };\n }\n });\n</script>\n\n<style lang=\"css\">\n .x-related-prompt__sliding-panel-content {\n display: flex;\n gap: 8px;\n }\n\n .x-related-prompt__sliding-panel-content-selected {\n width: calc(100%);\n }\n\n .x-related-prompt {\n display: flex;\n flex-direction: column;\n border-radius: 12px;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 500ms;\n min-height: 112px;\n height: 100%;\n width: 303px;\n }\n\n .x-related-prompt-selected {\n width: 100% !important;\n min-height: 0;\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n &__button {\n width: 100% !important;\n }\n }\n\n .x-related-prompt__button {\n display: flex;\n flex-direction: row;\n gap: 12px;\n justify-content: space-between;\n align-items: start;\n text-align: start;\n padding: 16px;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 500ms;\n flex-grow: 1;\n width: 303px;\n }\n\n .x-related-prompt__button-info {\n display: flex;\n min-height: 32px;\n }\n\n @media (max-width: 743px) {\n .x-related-prompt {\n width: 204px;\n &__button {\n width: 204px;\n }\n }\n }\n\n .x-no-scrollbar::-webkit-scrollbar {\n display: none;\n }\n\n .x-no-scrollbar {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n }\n\n .x-typewritter-initial {\n color: #0000;\n background: linear-gradient(-90deg, transparent 5px, #0000 0) 10px 0,\n linear-gradient(#575757 0 0) 0 0;\n background-size: 0 200%;\n -webkit-background-clip: padding-box, text;\n background-clip: padding-box, text;\n background-repeat: no-repeat;\n }\n\n .x-typewritter-animation {\n animation: typewritter calc(var(--suggestion-text-length) * 0.05s)\n steps(var(--suggestion-text-length)) forwards;\n }\n\n @keyframes typewritter {\n from {\n background-size: 0 200%;\n }\n to {\n background-size: calc(var(--suggestion-text-length) * 1ch) 200%;\n }\n }\n\n .x-staggered-initial {\n opacity: 0;\n transform: translateY(20px);\n }\n\n .x-staggered-animation {\n animation: fadeInUp 0.6s forwards;\n }\n\n @keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n</style>\n"],"names":["_resolveComponent","_openBlock","_createElementBlock","_renderSlot","_createCommentVNode","_createVNode","selectedPrompt","_withCtx","_createElementVNode","_normalizeClass","relatedPrompts","_Fragment","_renderList","hidePrompt","isSelected","_mergeProps"],"mappings":";;;;;;;kCACEA,gBAsDM,CAAA,cAAA,CAAA,CAAA;AApDF,EAAA,OAAAC,SAAA,EAHN,EAAAC,kBAAA,CAAA,KAAA,EAAA,IAAA,EAAA;AAAA,IAKI,IAAA,CAAA,MAAA,CAAA,MAAA,GAAAC,UAAA,CAiDe,IAhDZ,CAAA,MAAA,EAAA,QAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAA,GAAAC,kBAAA,CAAA,MAAA,EAAyB,IAAI,CAAA;AAAA,IAAAC,WAAA,CAC7B,uBAAyB,EAAA;AAAA,MACzB,yBAAsB,EAAA,IAAA;AAAA,MAAA,cAAA,EAAWC,IAAc,CAAA,WAAA;AAAA,MAAA,wBAAA,EAAA,IAAA,CAAA,cAAA,KAAA,CAAA,CAAA,GAAA,8DAAA,GAAA,EAAA;;;QA2CrCH,UACiC,CAAA,IAAA,CAAA,MAAA,EAAA,2BAAA,CAAA;AAAA,OAAA,CAAA;;QApDlDA,UAiDa,CAAA,IAAA,CAAA,MAAA,EAAA,4BAAA,CAAA;AAAA,OAAA,CAAA;eAhCLI,OA+BM,CAAA,MAAA;AAAA,QAAAJ,UAAA,CA9BA,IAAqB,CAAA,MAAA,EAAA,uBAAA,EAAA,EAAA,EAAA,MAAA;AAAA,UAAAK,kBAAA;AAlBnC,YAAA,KAAA;AAAA,YAmBgB;AAAA,cAAA,GAAA,EAAA,qBAAA;AAGN,cAAA,KAAA,EAAAC,cAAA,CAAA,CAAA,yCAAA,EAtBV,EAuB0CC,kDAAL,EAAA,IAAA,CAAA,cAAA,KAAA,CAAA,CAAA,EAAA,CAAA,CAAA;AAAA,aAAA;;yBACnB,IAAK,CAAA,EAAAR,kBAAA;AAAA,gBAAAS,QAAA;AAAA,gBAAA,IAAA;AAAA,gBAAAC,UAAA,CAAA,IAAA,CAAA,cAAA,EAAA,CAAA,UAAA,EAAA,KAAA,KAAA;yBACLX,SAzBlB,EAAA,EAAAC,kBAAA;AAAA,oBAAA,KAAA;AAAA,oBAAA;AAAA,sBAAA,GAAA,EAAA,KAAA;;wCAAA,CA4BkB,EAAA,KAAA,GAAA,GAAA,GAAA,IAAA,CAAA,CAAA,CAAA;AAAA,uBAAA,CAAA;4CAC8FW,CAAgB,sCAAA,EAAA;AAAA,wBAAA,EAAA,uBAAA,EAAA,IAAA,CAAkDC,iBAAW,EAAA;AAAA,wBAAA,EAAA,UAAA,EAAA,IAAA,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA;AAKjL,wBAAA,EAAA,2BAAA,EAAU,IAAqB,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA;AAAA,uBAAA,CAAA,CAAA;sBAE/B,WAUO,EAAA,qBAAA;AAAA,qBAAA;;AALF,sBAAAX,UAAA,CAAA,IAAA,CAAA,MAAA,EAAgB,uBAAU,EAAAY,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,IAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA;AAAA,wBAAAV,WAAA,CACnB,wBAAK,EAAA;AAAA,0BACZ,gBAAA,EAAA,UAAA;AAAA,0BACA,KAAA;AAAA,0BAAA,mBAAA,EAAA,IAAA,CAAA,iBAAA;;;;;;;;;;;;;;;;AA5CjB,SAAA,CAAA;AAAA,OAAA,CAAA;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-prompts-tag-list.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n <div>\n <template v-if=\"$slots.header\">\n <slot name=\"header\" />\n </template>\n <SlidingPanel\n :reset-on-content-change=\"true\"\n :button-class=\"buttonClass\"\n :scroll-container-class=\"\n selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n \"\n >\n <template #sliding-panel-left-button>\n <slot name=\"sliding-panel-left-button\" />\n </template>\n\n <slot name=\"sliding-panel-content\">\n <div\n ref=\"slidingPanelContent\"\n class=\"x-related-prompt__sliding-panel-content\"\n :class=\"{ 'x-
|
|
1
|
+
{"version":3,"file":"related-prompts-tag-list.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n <div>\n <template v-if=\"$slots.header\">\n <slot name=\"header\" />\n </template>\n <SlidingPanel\n :reset-on-content-change=\"true\"\n :button-class=\"buttonClass\"\n :scroll-container-class=\"\n selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n \"\n >\n <template #sliding-panel-left-button>\n <slot name=\"sliding-panel-left-button\" />\n </template>\n\n <slot name=\"sliding-panel-content\">\n <div\n ref=\"slidingPanelContent\"\n class=\"x-related-prompt__sliding-panel-content\"\n :class=\"{ 'x-related-prompt__sliding-panel-content-selected': selectedPrompt !== -1 }\"\n >\n <div\n v-for=\"(suggestion, index) in relatedPrompts\"\n :key=\"index\"\n :style=\"{\n animationDelay: `${index * 0.4 + 0.05}s`\n }\"\n class=\"x-related-prompt x-staggered-initial\"\n :class=\"[\n { 'x-staggered-animation': arePromptsVisible },\n { 'x-hidden': hidePrompt(index) },\n { 'x-related-prompt-selected': isSelected(index) }\n ]\"\n data-test=\"related-prompt-item\"\n >\n <slot\n name=\"related-prompt-button\"\n v-bind=\"{ suggestion, index, arePromptsVisible, isSelected }\"\n >\n <RelatedPrompt\n :related-prompt=\"suggestion\"\n :index=\"index\"\n :is-prompt-visible=\"arePromptsVisible\"\n :is-selected=\"isSelected(index)\"\n />\n </slot>\n </div>\n </div>\n </slot>\n\n <template #sliding-panel-right-button>\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n </div>\n</template>\n<script lang=\"ts\">\n import { defineComponent, onMounted, onUnmounted, ref } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { useState } from '../../../composables/index';\n import RelatedPrompt from './related-prompt.vue';\n\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { RelatedPrompt, SlidingPanel },\n props: {\n buttonClass: String\n },\n setup() {\n const { relatedPrompts, selectedPrompt } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const slidingPanelContent = ref<Element>();\n const arePromptsVisible = ref(false);\n\n const observer = new IntersectionObserver(([entry]) => {\n arePromptsVisible.value = entry.isIntersecting;\n });\n\n onMounted(() => {\n observer.observe(slidingPanelContent.value as Element);\n });\n\n onUnmounted(() => {\n observer.disconnect();\n });\n\n const isSelected = (index: number): boolean => selectedPrompt.value === index;\n\n const hidePrompt = (index: number): boolean =>\n selectedPrompt.value !== -1 && selectedPrompt.value !== index;\n\n return {\n arePromptsVisible,\n hidePrompt,\n isSelected,\n relatedPrompts,\n selectedPrompt,\n slidingPanelContent\n };\n }\n });\n</script>\n\n<style lang=\"css\">\n .x-related-prompt__sliding-panel-content {\n display: flex;\n gap: 8px;\n }\n\n .x-related-prompt__sliding-panel-content-selected {\n width: calc(100%);\n }\n\n .x-related-prompt {\n display: flex;\n flex-direction: column;\n border-radius: 12px;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 500ms;\n min-height: 112px;\n height: 100%;\n width: 303px;\n }\n\n .x-related-prompt-selected {\n width: 100% !important;\n min-height: 0;\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n &__button {\n width: 100% !important;\n }\n }\n\n .x-related-prompt__button {\n display: flex;\n flex-direction: row;\n gap: 12px;\n justify-content: space-between;\n align-items: start;\n text-align: start;\n padding: 16px;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 500ms;\n flex-grow: 1;\n width: 303px;\n }\n\n .x-related-prompt__button-info {\n display: flex;\n min-height: 32px;\n }\n\n @media (max-width: 743px) {\n .x-related-prompt {\n width: 204px;\n &__button {\n width: 204px;\n }\n }\n }\n\n .x-no-scrollbar::-webkit-scrollbar {\n display: none;\n }\n\n .x-no-scrollbar {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n }\n\n .x-typewritter-initial {\n color: #0000;\n background: linear-gradient(-90deg, transparent 5px, #0000 0) 10px 0,\n linear-gradient(#575757 0 0) 0 0;\n background-size: 0 200%;\n -webkit-background-clip: padding-box, text;\n background-clip: padding-box, text;\n background-repeat: no-repeat;\n }\n\n .x-typewritter-animation {\n animation: typewritter calc(var(--suggestion-text-length) * 0.05s)\n steps(var(--suggestion-text-length)) forwards;\n }\n\n @keyframes typewritter {\n from {\n background-size: 0 200%;\n }\n to {\n background-size: calc(var(--suggestion-text-length) * 1ch) 200%;\n }\n }\n\n .x-staggered-initial {\n opacity: 0;\n transform: translateY(20px);\n }\n\n .x-staggered-animation {\n animation: fadeInUp 0.6s forwards;\n }\n\n @keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAgEE,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,uBAAuB;IAC7B,OAAO,EAAE,qBAAqB,CAAC,IAAI;AACnC,IAAA,UAAU,EAAE,EAAE,aAAa,EAAE,cAAc;AAC3C,IAAA,KAAK,EAAE;AACL,QAAA,WAAW,EAAE,MAAK;AACnB,KAAA;IACD,KAAK,GAAA;QACH,MAAM,EAAE,cAAc,EAAE,cAAa,EAAI,GAAE,QAAQ,CAAC,gBAAgB,EAAE;YACpE,gBAAgB;YAChB,gBAAe;AAChB,SAAA,CAAC,CAAA;AAEF,QAAA,MAAM,mBAAkB,GAAI,GAAG,EAAW,CAAA;AAC1C,QAAA,MAAM,iBAAgB,GAAI,GAAG,CAAC,KAAK,CAAC,CAAA;QAEpC,MAAM,QAAS,GAAE,IAAI,oBAAoB,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK;AACrD,YAAA,iBAAiB,CAAC,KAAM,GAAE,KAAK,CAAC,cAAc,CAAA;AAChD,SAAC,CAAC,CAAA;QAEF,SAAS,CAAC,MAAM;AACd,YAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,CAAC,KAAgB,CAAC,CAAA;AACxD,SAAC,CAAC,CAAA;QAEF,WAAW,CAAC,MAAM;YAChB,QAAQ,CAAC,UAAU,EAAE,CAAA;AACvB,SAAC,CAAC,CAAA;AAEF,QAAA,MAAM,UAAW,GAAE,CAAC,KAAa,KAAc,cAAc,CAAC,KAAI,KAAM,KAAK,CAAA;AAE7E,QAAA,MAAM,UAAW,GAAE,CAAC,KAAa,KAC/B,cAAc,CAAC,KAAI,KAAM,CAAC,CAAA,IAAK,cAAc,CAAC,KAAM,KAAI,KAAK,CAAA;QAE/D,OAAO;YACL,iBAAiB;YACjB,UAAU;YACV,UAAU;YACV,cAAc;YACd,cAAc;YACd,mBAAkB;SACnB,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import injectCss from '../../../../tools/inject-css.js';
|
|
2
2
|
|
|
3
|
-
var css = ".x-related-prompt__sliding-panel-content{display:flex;gap:8px}.x-related-prompt{border-radius:12px;display:flex;flex-direction:column;height:100%;min-height:112px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt-selected{border-bottom-left-radius:0;border-bottom-right-radius:0;min-height:0;width:100%!important}.x-related-prompt-selected__button{width:100%!important}[dir=ltr] .x-related-prompt__button{text-align:left}[dir=rtl] .x-related-prompt__button{text-align:right}.x-related-prompt__button{align-items:start;display:flex;flex-direction:row;flex-grow:1;gap:12px;justify-content:space-between;padding:16px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt__button-info{display:flex;min-height:32px}@media (max-width:743px){.x-related-prompt,.x-related-prompt__button{width:204px}}.x-no-scrollbar::-webkit-scrollbar{display:none}.x-no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.x-typewritter-initial{background:linear-gradient(-90deg,transparent 5px,#0000 0) 10px 0,linear-gradient(#575757 0 0) 0 0;background-clip:padding-box,text;background-repeat:no-repeat;background-size:0 200%;color:#0000}.x-typewritter-animation{animation:typewritter calc(var(--suggestion-text-length)*.05s) steps(var(--suggestion-text-length)) forwards}@keyframes typewritter{0%{background-size:0 200%}to{background-size:calc(var(--suggestion-text-length)*1ch) 200%}}.x-staggered-initial{opacity:0;transform:translateY(20px)}.x-staggered-animation{animation:fadeInUp .6s forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}";
|
|
3
|
+
var css = ".x-related-prompt__sliding-panel-content{display:flex;gap:8px}.x-related-prompt__sliding-panel-content-selected{width:100%}.x-related-prompt{border-radius:12px;display:flex;flex-direction:column;height:100%;min-height:112px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt-selected{border-bottom-left-radius:0;border-bottom-right-radius:0;min-height:0;width:100%!important}.x-related-prompt-selected__button{width:100%!important}[dir=ltr] .x-related-prompt__button{text-align:left}[dir=rtl] .x-related-prompt__button{text-align:right}.x-related-prompt__button{align-items:start;display:flex;flex-direction:row;flex-grow:1;gap:12px;justify-content:space-between;padding:16px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt__button-info{display:flex;min-height:32px}@media (max-width:743px){.x-related-prompt,.x-related-prompt__button{width:204px}}.x-no-scrollbar::-webkit-scrollbar{display:none}.x-no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.x-typewritter-initial{background:linear-gradient(-90deg,transparent 5px,#0000 0) 10px 0,linear-gradient(#575757 0 0) 0 0;background-clip:padding-box,text;background-repeat:no-repeat;background-size:0 200%;color:#0000}.x-typewritter-animation{animation:typewritter calc(var(--suggestion-text-length)*.05s) steps(var(--suggestion-text-length)) forwards}@keyframes typewritter{0%{background-size:0 200%}to{background-size:calc(var(--suggestion-text-length)*1ch) 200%}}.x-staggered-initial{opacity:0;transform:translateY(20px)}.x-staggered-animation{animation:fadeInUp .6s forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}";
|
|
4
4
|
injectCss(css);
|
|
5
5
|
|
|
6
6
|
export { css, css as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@empathyco/x-components",
|
|
3
|
-
"version": "6.0.0-alpha.
|
|
3
|
+
"version": "6.0.0-alpha.30",
|
|
4
4
|
"description": "Empathy X Components",
|
|
5
5
|
"author": "Empathy Systems Corporation S.L.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -138,5 +138,5 @@
|
|
|
138
138
|
"access": "public",
|
|
139
139
|
"directory": "dist"
|
|
140
140
|
},
|
|
141
|
-
"gitHead": "
|
|
141
|
+
"gitHead": "1a5340e307e372017f19d1a7696c1276e322a232"
|
|
142
142
|
}
|