@kne/system-layout 0.2.0-alpha.23 → 0.2.0-alpha.25

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.
Files changed (10) hide show
  1. package/README.md +593 -18
  2. package/dist/{index-358d7b21.js → index-ce544506.js} +1 -1
  3. package/dist/{index-358d7b21.js.map → index-ce544506.js.map} +1 -1
  4. package/dist/index.css +467 -76
  5. package/dist/index.css.map +1 -1
  6. package/dist/index.js +171 -48
  7. package/dist/index.js.map +1 -1
  8. package/dist/index.modern.js +169 -45
  9. package/dist/index.modern.js.map +1 -1
  10. package/package.json +3 -1
package/dist/index.css CHANGED
@@ -441,9 +441,30 @@
441
441
  .kne-system-layout_sK89O .ant-pagination-options-size-changer {
442
442
  background: rgba(255, 255, 255, 0.4392156863) !important;
443
443
  }
444
+ .kne-system-layout_sK89O .ant-pagination-item:not(.ant-pagination-item-active) {
445
+ background-color: transparent !important;
446
+ }
444
447
  .kne-system-layout_sK89O .ant-tree {
445
448
  background: rgba(255, 255, 255, 0.4392156863) !important;
446
449
  }
450
+ .kne-system-layout_sK89O .table-page-toolbar-section .ant-input-search,
451
+ .kne-system-layout_sK89O .table-page-toolbar .ant-input-search {
452
+ background: #ffffff !important;
453
+ }
454
+ .kne-system-layout_sK89O .table-page-toolbar-section,
455
+ .kne-system-layout_sK89O .table-page-toolbar,
456
+ .kne-system-layout_sK89O div:has(> .ant-tabs),
457
+ .kne-system-layout_sK89O .ant-tabs,
458
+ .kne-system-layout_sK89O .ant-tabs-nav,
459
+ .kne-system-layout_sK89O .ant-tabs-nav-wrap,
460
+ .kne-system-layout_sK89O .ant-tabs-nav-list,
461
+ .kne-system-layout_sK89O .ant-tabs-tab {
462
+ background: transparent !important;
463
+ }
464
+ .kne-system-layout_sK89O .ant-tabs {
465
+ --ant-color-bg-container: transparent;
466
+ --ant-tabs-card-bg: transparent;
467
+ }
447
468
  .kne-system-layout_sK89O .ant-table,
448
469
  .kne-system-layout_sK89O .ant-table-placeholder {
449
470
  background: rgba(255, 255, 255, 0.4392156863) !important;
@@ -556,6 +577,36 @@
556
577
  .kne-system-layout_sK89O .ant-btn.ant-btn-primary:not(:disabled) {
557
578
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08);
558
579
  }
580
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
581
+ background: transparent;
582
+ }
583
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:not(.ant-btn-primary):not(.ant-btn-dangerous):not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
584
+ color: var(--primary-color);
585
+ }
586
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
587
+ border: none !important;
588
+ box-shadow: none !important;
589
+ backdrop-filter: none;
590
+ }
591
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled):hover:not(:disabled):not(.ant-btn-loading) {
592
+ background: var(--primary-color-1) !important;
593
+ backdrop-filter: none;
594
+ transform: none;
595
+ }
596
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn.ant-btn-dangerous:hover:not(:disabled):not(.ant-btn-loading) {
597
+ background: #fff1f0 !important;
598
+ }
599
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:active:not(.ant-btn-loading) {
600
+ box-shadow: none !important;
601
+ transform: none;
602
+ }
603
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn:disabled {
604
+ background: transparent;
605
+ box-shadow: none;
606
+ }
607
+ .kne-system-layout_sK89O .ant-dropdown .ant-btn.ant-btn-primary:not(:disabled) {
608
+ box-shadow: none;
609
+ }
559
610
 
560
611
  .kne-system-layout_-LpWn {
561
612
  flex: none;
@@ -1188,33 +1239,113 @@
1188
1239
  text-overflow: ellipsis;
1189
1240
  max-width: 100%;
1190
1241
  }
1242
+ @keyframes kne-system-layout_Ps1FA {
1243
+ 0% {
1244
+ transform: scaleX(1) scaleY(1);
1245
+ filter: brightness(1);
1246
+ }
1247
+ 25% {
1248
+ transform: scaleX(0.97) scaleY(1.03);
1249
+ filter: brightness(1.2);
1250
+ }
1251
+ 55% {
1252
+ transform: scaleX(1.015) scaleY(0.99);
1253
+ filter: brightness(1.08);
1254
+ }
1255
+ 100% {
1256
+ transform: scale(1);
1257
+ filter: brightness(1);
1258
+ }
1259
+ }
1191
1260
  @media (max-width: 768px) {
1192
1261
  .kne-system-layout_c1kXt {
1193
1262
  gap: 0 !important;
1194
1263
  }
1195
1264
  .kne-system-layout_c1kXt .kne-system-layout_h-YXH {
1196
1265
  height: 48px;
1197
- padding: 0 16px;
1266
+ padding: 0 12px;
1198
1267
  background: #ffffff;
1199
1268
  margin-bottom: 0;
1200
- position: fixed;
1201
1269
  top: var(--safe-area-inset-top, 0px);
1202
1270
  left: 0;
1203
1271
  right: 0;
1204
1272
  z-index: 600;
1273
+ gap: 8px !important;
1274
+ min-width: 0;
1205
1275
  transition: height 0.3s ease, padding 0.3s ease, background 0.3s ease, margin 0.3s ease, top 0.3s ease;
1206
1276
  }
1277
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_XjOj5 {
1278
+ position: fixed;
1279
+ }
1280
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_Q-5NT {
1281
+ position: absolute;
1282
+ }
1283
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH:not(.kne-system-layout_Q-5NT):not(.kne-system-layout_XjOj5) {
1284
+ position: fixed;
1285
+ }
1286
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_jhcGo {
1287
+ flex: 0 1 auto;
1288
+ width: fit-content;
1289
+ max-width: calc(100% - 96px);
1290
+ min-width: 0;
1291
+ }
1292
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_IOVGr {
1293
+ font-size: 15px;
1294
+ font-weight: 500;
1295
+ flex: 0 1 auto;
1296
+ min-width: 0;
1297
+ color: var(--primary-color);
1298
+ line-height: 1.2;
1299
+ overflow: hidden;
1300
+ text-overflow: ellipsis;
1301
+ white-space: nowrap;
1302
+ transition: font-size 0.3s ease, color 0.3s ease;
1303
+ }
1304
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_mKsLu {
1305
+ flex: 0 0 auto;
1306
+ margin-left: auto;
1307
+ max-width: none;
1308
+ overflow: visible;
1309
+ }
1310
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-space,
1311
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-space-item {
1312
+ display: inline-flex;
1313
+ align-items: center;
1314
+ }
1315
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-avatar {
1316
+ flex: none;
1317
+ }
1318
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_XTAI- {
1319
+ flex: none;
1320
+ display: inline-flex;
1321
+ align-items: center;
1322
+ justify-content: center;
1323
+ }
1324
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH .kne-system-layout_XTAI- > div:first-child {
1325
+ width: 0 !important;
1326
+ min-width: 0 !important;
1327
+ max-width: 0 !important;
1328
+ flex: 0 0 0 !important;
1329
+ overflow: hidden;
1330
+ pointer-events: none;
1331
+ }
1207
1332
  .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy {
1208
1333
  height: 36px;
1209
1334
  padding: 0;
1210
1335
  background: transparent;
1211
1336
  margin: 8px 16px;
1212
1337
  top: calc(8px + var(--safe-area-inset-top, 0px));
1338
+ gap: 8px !important;
1213
1339
  }
1214
1340
  .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo {
1341
+ flex: 0 1 auto;
1342
+ width: fit-content;
1343
+ max-width: calc(100% - 48px);
1215
1344
  border-radius: 999px;
1216
- padding: 0 12px;
1345
+ padding: 0 10px 0 6px;
1217
1346
  height: 36px;
1347
+ min-width: 0;
1348
+ overflow: hidden;
1218
1349
  border: 1px solid rgba(255, 255, 255, 0.5);
1219
1350
  box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1220
1351
  background: rgba(255, 255, 255, 0.25);
@@ -1224,55 +1355,69 @@
1224
1355
  .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo:active {
1225
1356
  animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1226
1357
  }
1358
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn,
1359
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn .kne-system-layout_07Mna,
1360
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .kne-system-layout_07Mna {
1361
+ color: #333 !important;
1362
+ }
1363
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:hover,
1364
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:focus {
1365
+ color: #555 !important;
1366
+ }
1227
1367
  .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu {
1368
+ flex: 0 1 auto;
1369
+ margin-left: auto;
1370
+ max-width: 50%;
1371
+ min-width: 0;
1372
+ }
1373
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j {
1374
+ width: fit-content;
1375
+ max-width: 50%;
1376
+ min-width: 0;
1228
1377
  border-radius: 999px;
1229
1378
  padding: 0 8px;
1230
1379
  height: 36px;
1380
+ display: flex;
1381
+ align-items: center;
1382
+ justify-content: center;
1383
+ overflow: hidden;
1231
1384
  border: 1px solid rgba(255, 255, 255, 0.5);
1232
1385
  box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1233
1386
  background: rgba(255, 255, 255, 0.25);
1234
1387
  backdrop-filter: blur(10px);
1235
1388
  -webkit-backdrop-filter: blur(10px);
1236
1389
  }
1237
- .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu:active {
1390
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j:active {
1238
1391
  animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1239
1392
  }
1240
- .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_IOVGr {
1241
- font-size: 14px;
1242
- color: #333;
1243
- }
1244
- .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .ant-btn {
1393
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn {
1245
1394
  color: #333 !important;
1395
+ display: inline-flex !important;
1396
+ align-items: center;
1397
+ justify-content: center;
1398
+ width: auto;
1399
+ max-width: 100%;
1400
+ min-width: 0 !important;
1401
+ height: 28px;
1402
+ padding: 0 4px !important;
1403
+ font-size: 13px;
1404
+ line-height: 1;
1405
+ border: none !important;
1406
+ box-shadow: none !important;
1407
+ background: transparent !important;
1408
+ overflow: hidden;
1409
+ text-overflow: ellipsis;
1410
+ white-space: nowrap;
1246
1411
  }
1247
- .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .ant-btn:hover {
1412
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:hover,
1413
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:focus {
1248
1414
  color: #555 !important;
1415
+ background: transparent !important;
1249
1416
  }
1250
- @keyframes kne-system-layout_Ps1FA {
1251
- 0% {
1252
- transform: scaleX(1) scaleY(1);
1253
- filter: brightness(1);
1254
- }
1255
- 25% {
1256
- transform: scaleX(0.97) scaleY(1.03);
1257
- filter: brightness(1.2);
1258
- }
1259
- 55% {
1260
- transform: scaleX(1.015) scaleY(0.99);
1261
- filter: brightness(1.08);
1262
- }
1263
- 100% {
1264
- transform: scale(1);
1265
- filter: brightness(1);
1266
- }
1267
- }
1268
- .kne-system-layout_c1kXt .kne-system-layout_IOVGr {
1269
- font-size: 16px;
1270
- flex: 1;
1271
- color: var(--primary-color);
1272
- transition: font-size 0.3s ease, color 0.3s ease;
1273
- }
1274
- .kne-system-layout_c1kXt .kne-system-layout_mKsLu {
1275
- flex: none;
1417
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_IOVGr {
1418
+ font-size: 14px;
1419
+ color: #333;
1420
+ line-height: 1;
1276
1421
  }
1277
1422
  .kne-system-layout_c1kXt .kne-system-layout_Y1y7o {
1278
1423
  padding-top: calc(52px + var(--safe-area-inset-top, 0px));
@@ -1297,27 +1442,89 @@
1297
1442
  }
1298
1443
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH {
1299
1444
  height: 48px;
1300
- padding: 0 16px;
1445
+ padding: 0 12px;
1301
1446
  background: #ffffff;
1302
1447
  margin-bottom: 0;
1303
- position: fixed;
1304
1448
  top: var(--safe-area-inset-top, 0px);
1305
1449
  left: 0;
1306
1450
  right: 0;
1307
1451
  z-index: 600;
1452
+ gap: 8px !important;
1453
+ min-width: 0;
1308
1454
  transition: height 0.3s ease, padding 0.3s ease, background 0.3s ease, margin 0.3s ease, top 0.3s ease;
1309
1455
  }
1456
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_XjOj5 {
1457
+ position: fixed;
1458
+ }
1459
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_Q-5NT {
1460
+ position: absolute;
1461
+ }
1462
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH:not(.kne-system-layout_Q-5NT):not(.kne-system-layout_XjOj5) {
1463
+ position: fixed;
1464
+ }
1465
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_jhcGo {
1466
+ flex: 0 1 auto;
1467
+ width: fit-content;
1468
+ max-width: calc(100% - 96px);
1469
+ min-width: 0;
1470
+ }
1471
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_IOVGr {
1472
+ font-size: 15px;
1473
+ font-weight: 500;
1474
+ flex: 0 1 auto;
1475
+ min-width: 0;
1476
+ color: var(--primary-color);
1477
+ line-height: 1.2;
1478
+ overflow: hidden;
1479
+ text-overflow: ellipsis;
1480
+ white-space: nowrap;
1481
+ transition: font-size 0.3s ease, color 0.3s ease;
1482
+ }
1483
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_mKsLu {
1484
+ flex: 0 0 auto;
1485
+ margin-left: auto;
1486
+ max-width: none;
1487
+ overflow: visible;
1488
+ }
1489
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-space,
1490
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-space-item {
1491
+ display: inline-flex;
1492
+ align-items: center;
1493
+ }
1494
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_mKsLu .ant-avatar {
1495
+ flex: none;
1496
+ }
1497
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_XTAI- {
1498
+ flex: none;
1499
+ display: inline-flex;
1500
+ align-items: center;
1501
+ justify-content: center;
1502
+ }
1503
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH .kne-system-layout_XTAI- > div:first-child {
1504
+ width: 0 !important;
1505
+ min-width: 0 !important;
1506
+ max-width: 0 !important;
1507
+ flex: 0 0 0 !important;
1508
+ overflow: hidden;
1509
+ pointer-events: none;
1510
+ }
1310
1511
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy {
1311
1512
  height: 36px;
1312
1513
  padding: 0;
1313
1514
  background: transparent;
1314
1515
  margin: 8px 16px;
1315
1516
  top: calc(8px + var(--safe-area-inset-top, 0px));
1517
+ gap: 8px !important;
1316
1518
  }
1317
1519
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo {
1520
+ flex: 0 1 auto;
1521
+ width: fit-content;
1522
+ max-width: calc(100% - 48px);
1318
1523
  border-radius: 999px;
1319
- padding: 0 12px;
1524
+ padding: 0 10px 0 6px;
1320
1525
  height: 36px;
1526
+ min-width: 0;
1527
+ overflow: hidden;
1321
1528
  border: 1px solid rgba(255, 255, 255, 0.5);
1322
1529
  box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1323
1530
  background: rgba(255, 255, 255, 0.25);
@@ -1327,55 +1534,69 @@
1327
1534
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo:active {
1328
1535
  animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1329
1536
  }
1537
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn,
1538
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn .kne-system-layout_07Mna,
1539
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .kne-system-layout_07Mna {
1540
+ color: #333 !important;
1541
+ }
1542
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:hover,
1543
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:focus {
1544
+ color: #555 !important;
1545
+ }
1330
1546
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu {
1547
+ flex: 0 1 auto;
1548
+ margin-left: auto;
1549
+ max-width: 50%;
1550
+ min-width: 0;
1551
+ }
1552
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j {
1553
+ width: fit-content;
1554
+ max-width: 50%;
1555
+ min-width: 0;
1331
1556
  border-radius: 999px;
1332
1557
  padding: 0 8px;
1333
1558
  height: 36px;
1559
+ display: flex;
1560
+ align-items: center;
1561
+ justify-content: center;
1562
+ overflow: hidden;
1334
1563
  border: 1px solid rgba(255, 255, 255, 0.5);
1335
1564
  box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1336
1565
  background: rgba(255, 255, 255, 0.25);
1337
1566
  backdrop-filter: blur(10px);
1338
1567
  -webkit-backdrop-filter: blur(10px);
1339
1568
  }
1340
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu:active {
1569
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j:active {
1341
1570
  animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1342
1571
  }
1343
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_IOVGr {
1344
- font-size: 14px;
1345
- color: #333;
1346
- }
1347
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .ant-btn {
1572
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn {
1348
1573
  color: #333 !important;
1574
+ display: inline-flex !important;
1575
+ align-items: center;
1576
+ justify-content: center;
1577
+ width: auto;
1578
+ max-width: 100%;
1579
+ min-width: 0 !important;
1580
+ height: 28px;
1581
+ padding: 0 4px !important;
1582
+ font-size: 13px;
1583
+ line-height: 1;
1584
+ border: none !important;
1585
+ box-shadow: none !important;
1586
+ background: transparent !important;
1587
+ overflow: hidden;
1588
+ text-overflow: ellipsis;
1589
+ white-space: nowrap;
1349
1590
  }
1350
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .ant-btn:hover {
1591
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:hover,
1592
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:focus {
1351
1593
  color: #555 !important;
1594
+ background: transparent !important;
1352
1595
  }
1353
- @keyframes kne-system-layout_Ps1FA {
1354
- 0% {
1355
- transform: scaleX(1) scaleY(1);
1356
- filter: brightness(1);
1357
- }
1358
- 25% {
1359
- transform: scaleX(0.97) scaleY(1.03);
1360
- filter: brightness(1.2);
1361
- }
1362
- 55% {
1363
- transform: scaleX(1.015) scaleY(0.99);
1364
- filter: brightness(1.08);
1365
- }
1366
- 100% {
1367
- transform: scale(1);
1368
- filter: brightness(1);
1369
- }
1370
- }
1371
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_IOVGr {
1372
- font-size: 16px;
1373
- flex: 1;
1374
- color: var(--primary-color);
1375
- transition: font-size 0.3s ease, color 0.3s ease;
1376
- }
1377
- .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_mKsLu {
1378
- flex: none;
1596
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH.kne-system-layout_dEXMy .kne-system-layout_IOVGr {
1597
+ font-size: 14px;
1598
+ color: #333;
1599
+ line-height: 1;
1379
1600
  }
1380
1601
  .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_Y1y7o {
1381
1602
  padding-top: calc(52px + var(--safe-area-inset-top, 0px));
@@ -1395,14 +1616,185 @@
1395
1616
  padding: 0;
1396
1617
  }
1397
1618
 
1398
- .kne-system-layout_jhcGo {
1619
+ .kne-system-layout_h-YXH {
1620
+ margin-bottom: 12px;
1621
+ }
1622
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx {
1623
+ height: 48px;
1624
+ padding: 0 12px;
1625
+ background: #ffffff;
1626
+ margin-bottom: 0;
1627
+ top: var(--safe-area-inset-top, 0px);
1628
+ left: 0;
1629
+ right: 0;
1630
+ z-index: 600;
1631
+ gap: 8px !important;
1632
+ min-width: 0;
1633
+ transition: height 0.3s ease, padding 0.3s ease, background 0.3s ease, margin 0.3s ease, top 0.3s ease;
1634
+ }
1635
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_XjOj5 {
1636
+ position: fixed;
1637
+ }
1638
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_Q-5NT {
1639
+ position: absolute;
1640
+ }
1641
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx:not(.kne-system-layout_Q-5NT):not(.kne-system-layout_XjOj5) {
1642
+ position: fixed;
1643
+ }
1644
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_jhcGo {
1645
+ flex: 0 1 auto;
1646
+ width: fit-content;
1647
+ max-width: calc(100% - 96px);
1648
+ min-width: 0;
1649
+ }
1650
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_IOVGr {
1651
+ font-size: 15px;
1652
+ font-weight: 500;
1653
+ flex: 0 1 auto;
1654
+ min-width: 0;
1655
+ color: var(--primary-color);
1656
+ line-height: 1.2;
1657
+ overflow: hidden;
1658
+ text-overflow: ellipsis;
1399
1659
  white-space: nowrap;
1660
+ transition: font-size 0.3s ease, color 0.3s ease;
1661
+ }
1662
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_mKsLu {
1663
+ flex: 0 0 auto;
1664
+ margin-left: auto;
1665
+ max-width: none;
1666
+ overflow: visible;
1667
+ }
1668
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_mKsLu .ant-space,
1669
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_mKsLu .ant-space-item {
1670
+ display: inline-flex;
1671
+ align-items: center;
1672
+ }
1673
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_mKsLu .ant-avatar {
1674
+ flex: none;
1675
+ }
1676
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_XTAI- {
1677
+ flex: none;
1678
+ display: inline-flex;
1679
+ align-items: center;
1680
+ justify-content: center;
1681
+ }
1682
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx .kne-system-layout_XTAI- > div:first-child {
1683
+ width: 0 !important;
1684
+ min-width: 0 !important;
1685
+ max-width: 0 !important;
1686
+ flex: 0 0 0 !important;
1687
+ overflow: hidden;
1688
+ pointer-events: none;
1689
+ }
1690
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy {
1691
+ height: 36px;
1692
+ padding: 0;
1693
+ background: transparent;
1694
+ margin: 8px 16px;
1695
+ top: calc(8px + var(--safe-area-inset-top, 0px));
1696
+ gap: 8px !important;
1697
+ }
1698
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo {
1699
+ flex: 0 1 auto;
1700
+ width: fit-content;
1701
+ max-width: calc(100% - 48px);
1702
+ border-radius: 999px;
1703
+ padding: 0 10px 0 6px;
1704
+ height: 36px;
1705
+ min-width: 0;
1706
+ overflow: hidden;
1707
+ border: 1px solid rgba(255, 255, 255, 0.5);
1708
+ box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1709
+ background: rgba(255, 255, 255, 0.25);
1710
+ backdrop-filter: blur(10px);
1711
+ -webkit-backdrop-filter: blur(10px);
1712
+ }
1713
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo:active {
1714
+ animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1715
+ }
1716
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn,
1717
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn .kne-system-layout_07Mna,
1718
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo .kne-system-layout_07Mna {
1719
+ color: #333 !important;
1720
+ }
1721
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:hover,
1722
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_jhcGo .ant-btn:focus {
1723
+ color: #555 !important;
1724
+ }
1725
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu {
1726
+ flex: 0 1 auto;
1727
+ margin-left: auto;
1728
+ max-width: 50%;
1729
+ min-width: 0;
1730
+ }
1731
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j {
1732
+ width: fit-content;
1733
+ max-width: 50%;
1734
+ min-width: 0;
1735
+ border-radius: 999px;
1736
+ padding: 0 8px;
1737
+ height: 36px;
1738
+ display: flex;
1739
+ align-items: center;
1740
+ justify-content: center;
1741
+ overflow: hidden;
1742
+ border: 1px solid rgba(255, 255, 255, 0.5);
1743
+ box-shadow: 0 8px 32px 0 rgba(78, 96, 139, 0.18), 0 2px 8px 0 rgba(78, 96, 139, 0.1), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
1744
+ background: rgba(255, 255, 255, 0.25);
1745
+ backdrop-filter: blur(10px);
1746
+ -webkit-backdrop-filter: blur(10px);
1747
+ }
1748
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j:active {
1749
+ animation: kne-system-layout_Ps1FA 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
1750
+ }
1751
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn {
1752
+ color: #333 !important;
1753
+ display: inline-flex !important;
1754
+ align-items: center;
1755
+ justify-content: center;
1756
+ width: auto;
1757
+ max-width: 100%;
1758
+ min-width: 0 !important;
1759
+ height: 28px;
1760
+ padding: 0 4px !important;
1761
+ font-size: 13px;
1762
+ line-height: 1;
1763
+ border: none !important;
1764
+ box-shadow: none !important;
1765
+ background: transparent !important;
1400
1766
  overflow: hidden;
1401
1767
  text-overflow: ellipsis;
1768
+ white-space: nowrap;
1769
+ }
1770
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:hover,
1771
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_mKsLu.kne-system-layout_SD6-j .ant-btn:focus {
1772
+ color: #555 !important;
1773
+ background: transparent !important;
1774
+ }
1775
+ .kne-system-layout_h-YXH.kne-system-layout_yRZMx.kne-system-layout_dEXMy .kne-system-layout_IOVGr {
1776
+ font-size: 14px;
1777
+ color: #333;
1778
+ line-height: 1;
1402
1779
  }
1403
1780
 
1404
- .kne-system-layout_h-YXH {
1405
- margin-bottom: 12px;
1781
+ .kne-system-layout_4pjtx {
1782
+ position: absolute;
1783
+ top: 0;
1784
+ left: 0;
1785
+ width: 100%;
1786
+ height: var(--kne-viewport-height, 100dvh);
1787
+ pointer-events: none;
1788
+ z-index: 600;
1789
+ }
1790
+ .kne-system-layout_4pjtx .kne-system-layout_h-YXH {
1791
+ pointer-events: auto;
1792
+ }
1793
+
1794
+ .kne-system-layout_jhcGo {
1795
+ white-space: nowrap;
1796
+ overflow: hidden;
1797
+ text-overflow: ellipsis;
1406
1798
  }
1407
1799
 
1408
1800
  .kne-system-layout_IOVGr {
@@ -1421,7 +1813,6 @@
1421
1813
  .kne-system-layout_mKsLu {
1422
1814
  display: flex;
1423
1815
  justify-content: flex-end;
1424
- flex: 1;
1425
1816
  max-width: 50%;
1426
1817
  }
1427
1818