@kne/system-layout 0.2.0-alpha.14 → 0.2.0-alpha.15

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/dist/index.css CHANGED
@@ -248,34 +248,34 @@
248
248
  }
249
249
 
250
250
  @media (max-width: 768px) {
251
- ._sK89O {
251
+ .kne-system-layout_sK89O {
252
252
  width: 100%;
253
253
  padding: 0;
254
254
  overflow: hidden;
255
255
  height: unset;
256
256
  min-height: var(--window-height);
257
- --page-height: 100vh;
257
+ --page-height: 100dvh;
258
258
  --page-content-height: var(--page-height);
259
259
  --page-inner-height: calc(var(--page-height) - var(--nav-height) - var(--toolbar-height));
260
260
  }
261
- ._sK89O._gyKfI {
261
+ .kne-system-layout_sK89O.kne-system-layout_gyKfI {
262
262
  --toolbar-height: 60px;
263
263
  }
264
- ._sK89O._X1wZG {
264
+ .kne-system-layout_sK89O.kne-system-layout_X1wZG {
265
265
  --nav-height: 48px;
266
266
  }
267
- ._sK89O ._-LpWn {
267
+ .kne-system-layout_sK89O .kne-system-layout_-LpWn {
268
268
  position: absolute;
269
269
  left: calc(var(--menu-min-width) * -1);
270
270
  z-index: 900;
271
271
  background: var(--background);
272
272
  height: 100%;
273
273
  }
274
- ._sK89O ._-LpWn._G-zuN {
274
+ .kne-system-layout_sK89O .kne-system-layout_-LpWn.kne-system-layout_G-zuN {
275
275
  left: 0;
276
276
  box-shadow: 0 -2px 22.9px 0 rgba(78, 96, 139, 0.13);
277
277
  }
278
- ._sK89O ._6TCwG {
278
+ .kne-system-layout_sK89O .kne-system-layout_6TCwG {
279
279
  position: absolute;
280
280
  top: 0;
281
281
  left: 0;
@@ -287,29 +287,29 @@
287
287
  pointer-events: none;
288
288
  transition: opacity 300ms;
289
289
  }
290
- ._sK89O ._6TCwG._G-zuN {
290
+ .kne-system-layout_sK89O .kne-system-layout_6TCwG.kne-system-layout_G-zuN {
291
291
  opacity: 1;
292
292
  pointer-events: auto;
293
293
  }
294
- ._sK89O ._5qnw5 {
294
+ .kne-system-layout_sK89O .kne-system-layout_5qnw5 {
295
295
  display: none;
296
296
  }
297
- ._sK89O ._HnwkM {
297
+ .kne-system-layout_sK89O .kne-system-layout_HnwkM {
298
298
  border-radius: 0;
299
299
  border: 0;
300
300
  }
301
- ._sK89O ._h8PAW {
301
+ .kne-system-layout_sK89O .kne-system-layout_h8PAW {
302
302
  display: block;
303
303
  }
304
- ._sK89O ._OM1Q2 {
304
+ .kne-system-layout_sK89O .kne-system-layout_OM1Q2 {
305
305
  padding: 0;
306
306
  overflow: visible !important;
307
307
  height: unset;
308
308
  }
309
309
  }
310
- ._sK89O {
310
+ .kne-system-layout_sK89O {
311
311
  --window-width: 100vw;
312
- --window-height: 100vh;
312
+ --window-height: 100dvh;
313
313
  --multiple: var(--safe-area-multiple, 1);
314
314
  --safe-area-inset-top: calc(env(safe-area-inset-top) * var(--multiple));
315
315
  --safe-area-inset-bottom: calc(env(safe-area-inset-bottom) * var(--multiple));
@@ -326,134 +326,134 @@
326
326
  position: relative;
327
327
  line-height: 1.4;
328
328
  }
329
- ._sK89O .system-max-width-900 {
329
+ .kne-system-layout_sK89O .system-max-width-900 {
330
330
  max-width: 900px;
331
331
  width: 100%;
332
332
  margin: 0 auto;
333
333
  }
334
- ._sK89O .system-font-title {
334
+ .kne-system-layout_sK89O .system-font-title {
335
335
  font-size: 16px;
336
336
  font-weight: bold;
337
337
  }
338
- ._sK89O .system-font-title-primary {
338
+ .kne-system-layout_sK89O .system-font-title-primary {
339
339
  font-size: 16px;
340
340
  font-weight: bold;
341
341
  color: var(--primary-color);
342
342
  }
343
- ._sK89O .system-font-sub-title {
343
+ .kne-system-layout_sK89O .system-font-sub-title {
344
344
  font-weight: bold;
345
345
  }
346
- ._sK89O .system-font-bold {
346
+ .kne-system-layout_sK89O .system-font-bold {
347
347
  font-weight: bold;
348
348
  }
349
- ._sK89O .system-font-description {
349
+ .kne-system-layout_sK89O .system-font-description {
350
350
  color: var(--font-color-grey);
351
351
  }
352
- ._sK89O .scroller-bar {
352
+ .kne-system-layout_sK89O .scroller-bar {
353
353
  background: transparent !important;
354
354
  border-color: transparent !important;
355
355
  }
356
- ._sK89O .scroller-bar .scroller-bar-inner {
356
+ .kne-system-layout_sK89O .scroller-bar .scroller-bar-inner {
357
357
  background: #999 !important;
358
358
  height: 40%;
359
359
  }
360
- ._sK89O .ant-tag {
360
+ .kne-system-layout_sK89O .ant-tag {
361
361
  background: var(--primary-color-1);
362
362
  border-radius: 11px;
363
363
  color: var(--font-color-grey);
364
364
  }
365
- ._sK89O .ant-segmented {
365
+ .kne-system-layout_sK89O .ant-segmented {
366
366
  border: 1px solid #d1d5db;
367
367
  border-radius: 17px;
368
368
  background: transparent !important;
369
369
  }
370
- ._sK89O .ant-segmented .ant-segmented-item,
371
- ._sK89O .ant-segmented .ant-segmented-thumb {
370
+ .kne-system-layout_sK89O .ant-segmented .ant-segmented-item,
371
+ .kne-system-layout_sK89O .ant-segmented .ant-segmented-thumb {
372
372
  border-radius: 14px;
373
373
  }
374
- ._sK89O .ant-segmented .ant-segmented-item.ant-segmented-item-selected,
375
- ._sK89O .ant-segmented .ant-segmented-thumb {
374
+ .kne-system-layout_sK89O .ant-segmented .ant-segmented-item.ant-segmented-item-selected,
375
+ .kne-system-layout_sK89O .ant-segmented .ant-segmented-thumb {
376
376
  background: var(--primary-color) !important;
377
377
  color: #fff !important;
378
378
  }
379
- ._sK89O .ant-segmented .ant-segmented-item:after {
379
+ .kne-system-layout_sK89O .ant-segmented .ant-segmented-item:after {
380
380
  background: transparent !important;
381
381
  }
382
- ._sK89O .filter .filter-title {
382
+ .kne-system-layout_sK89O .filter .filter-title {
383
383
  border-bottom: none;
384
384
  }
385
- ._sK89O .react-form .ant-card {
385
+ .kne-system-layout_sK89O .react-form .ant-card {
386
386
  max-width: 900px;
387
387
  margin: 0 auto;
388
388
  width: 100%;
389
389
  }
390
- ._sK89O .max-width-info-page {
390
+ .kne-system-layout_sK89O .max-width-info-page {
391
391
  max-width: 900px;
392
392
  margin: 0 auto;
393
393
  width: 100%;
394
394
  }
395
- ._sK89O .part.bordered {
395
+ .kne-system-layout_sK89O .part.bordered {
396
396
  background: rgba(255, 255, 255, 0.4392156863) !important;
397
397
  }
398
- ._sK89O .part.bordered .part-title {
398
+ .kne-system-layout_sK89O .part.bordered .part-title {
399
399
  font-size: 16px;
400
400
  }
401
- ._sK89O .ant-pagination-options-size-changer {
401
+ .kne-system-layout_sK89O .ant-pagination-options-size-changer {
402
402
  background: rgba(255, 255, 255, 0.4392156863) !important;
403
403
  }
404
- ._sK89O .ant-tree {
404
+ .kne-system-layout_sK89O .ant-tree {
405
405
  background: rgba(255, 255, 255, 0.4392156863) !important;
406
406
  }
407
- ._sK89O .ant-table,
408
- ._sK89O .ant-table-placeholder {
407
+ .kne-system-layout_sK89O .ant-table,
408
+ .kne-system-layout_sK89O .ant-table-placeholder {
409
409
  background: rgba(255, 255, 255, 0.4392156863) !important;
410
410
  }
411
- ._sK89O .ant-table-cell,
412
- ._sK89O .ant-table-wrapper .ant-table-tbody > tr > td.ant-table-cell {
411
+ .kne-system-layout_sK89O .ant-table-cell,
412
+ .kne-system-layout_sK89O .ant-table-wrapper .ant-table-tbody > tr > td.ant-table-cell {
413
413
  padding: 4px 8px;
414
414
  }
415
- ._sK89O .ant-table-wrapper .ant-table-thead > tr > th.ant-table-cell {
415
+ .kne-system-layout_sK89O .ant-table-wrapper .ant-table-thead > tr > th.ant-table-cell {
416
416
  padding: 6px 16px;
417
417
  font-weight: 400 !important;
418
418
  color: var(--font-color-grey);
419
419
  }
420
- ._sK89O .ant-table-wrapper .ant-table-cell-fix {
420
+ .kne-system-layout_sK89O .ant-table-wrapper .ant-table-cell-fix {
421
421
  background: transparent;
422
422
  }
423
- ._sK89O .ant-table-wrapper .ant-table-cell-fix.ant-table-cell-fix-end-shadow-show, ._sK89O .ant-table-wrapper .ant-table-cell-fix.ant-table-cell-fix-start-shadow-show {
423
+ .kne-system-layout_sK89O .ant-table-wrapper .ant-table-cell-fix.ant-table-cell-fix-end-shadow-show, .kne-system-layout_sK89O .ant-table-wrapper .ant-table-cell-fix.ant-table-cell-fix-start-shadow-show {
424
424
  background: var(--bg-color-grey);
425
425
  }
426
- ._sK89O .ant-tooltip-container {
426
+ .kne-system-layout_sK89O .ant-tooltip-container {
427
427
  max-width: 400px;
428
428
  }
429
- ._sK89O._udBgQ {
429
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ {
430
430
  width: 100%;
431
431
  padding: 0;
432
432
  overflow: hidden;
433
433
  height: unset;
434
434
  min-height: var(--window-height);
435
- --page-height: 100vh;
435
+ --page-height: 100dvh;
436
436
  --page-content-height: var(--page-height);
437
437
  --page-inner-height: calc(var(--page-height) - var(--nav-height) - var(--toolbar-height));
438
438
  }
439
- ._sK89O._udBgQ._gyKfI {
439
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ.kne-system-layout_gyKfI {
440
440
  --toolbar-height: 60px;
441
441
  }
442
- ._sK89O._udBgQ._X1wZG {
442
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ.kne-system-layout_X1wZG {
443
443
  --nav-height: 48px;
444
444
  }
445
- ._sK89O._udBgQ ._-LpWn {
445
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_-LpWn {
446
446
  position: absolute;
447
447
  left: calc(var(--menu-min-width) * -1);
448
448
  z-index: 900;
449
449
  background: var(--background);
450
450
  height: 100%;
451
451
  }
452
- ._sK89O._udBgQ ._-LpWn._G-zuN {
452
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_-LpWn.kne-system-layout_G-zuN {
453
453
  left: 0;
454
454
  box-shadow: 0 -2px 22.9px 0 rgba(78, 96, 139, 0.13);
455
455
  }
456
- ._sK89O._udBgQ ._6TCwG {
456
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_6TCwG {
457
457
  position: absolute;
458
458
  top: 0;
459
459
  left: 0;
@@ -465,105 +465,105 @@
465
465
  pointer-events: none;
466
466
  transition: opacity 300ms;
467
467
  }
468
- ._sK89O._udBgQ ._6TCwG._G-zuN {
468
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_6TCwG.kne-system-layout_G-zuN {
469
469
  opacity: 1;
470
470
  pointer-events: auto;
471
471
  }
472
- ._sK89O._udBgQ ._5qnw5 {
472
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_5qnw5 {
473
473
  display: none;
474
474
  }
475
- ._sK89O._udBgQ ._HnwkM {
475
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_HnwkM {
476
476
  border-radius: 0;
477
477
  border: 0;
478
478
  }
479
- ._sK89O._udBgQ ._h8PAW {
479
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_h8PAW {
480
480
  display: block;
481
481
  }
482
- ._sK89O._udBgQ ._OM1Q2 {
482
+ .kne-system-layout_sK89O.kne-system-layout_udBgQ .kne-system-layout_OM1Q2 {
483
483
  padding: 0;
484
484
  overflow: visible !important;
485
485
  height: unset;
486
486
  }
487
- ._sK89O ._h8PAW {
487
+ .kne-system-layout_sK89O .kne-system-layout_h8PAW {
488
488
  display: none;
489
489
  }
490
- ._sK89O .ant-btn:not(.ant-btn-primary):not(.ant-btn-dangerous):not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
490
+ .kne-system-layout_sK89O .ant-btn:not(.ant-btn-primary):not(.ant-btn-dangerous):not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
491
491
  background: var(--primary-color-2);
492
492
  color: var(--primary-color);
493
493
  }
494
- ._sK89O .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
494
+ .kne-system-layout_sK89O .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled) {
495
495
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
496
496
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08);
497
497
  backdrop-filter: blur(10px);
498
498
  }
499
- ._sK89O .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled):hover:not(:disabled):not(.ant-btn-loading) {
499
+ .kne-system-layout_sK89O .ant-btn:not(.ant-btn-link):not(.ant-btn-dashed):not(.ant-btn-text):not(:disabled):hover:not(:disabled):not(.ant-btn-loading) {
500
500
  backdrop-filter: blur(40px) saturate(1.5) brightness(1.2);
501
501
  transform: scale(1.04);
502
502
  }
503
- ._sK89O .ant-btn:active:not(.ant-btn-loading) {
503
+ .kne-system-layout_sK89O .ant-btn:active:not(.ant-btn-loading) {
504
504
  box-shadow: none !important;
505
505
  transform: scale(1);
506
506
  }
507
- ._sK89O .ant-btn:disabled {
507
+ .kne-system-layout_sK89O .ant-btn:disabled {
508
508
  box-shadow: none;
509
509
  color: var(--font-color-disabled);
510
510
  background: rgba(17, 24, 39, 0.2);
511
511
  }
512
- ._sK89O .ant-btn.ant-btn-primary:not(:disabled) {
512
+ .kne-system-layout_sK89O .ant-btn.ant-btn-primary:not(:disabled) {
513
513
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08);
514
514
  }
515
- ._sK89O .ant-btn.ant-btn-loading {
515
+ .kne-system-layout_sK89O .ant-btn.ant-btn-loading {
516
516
  opacity: 0.6;
517
517
  }
518
- ._sK89O .ant-btn {
518
+ .kne-system-layout_sK89O .ant-btn {
519
519
  position: relative;
520
520
  }
521
- ._sK89O .ant-btn .ant-btn-loading-icon {
521
+ .kne-system-layout_sK89O .ant-btn .ant-btn-loading-icon {
522
522
  position: absolute;
523
523
  }
524
524
 
525
- ._-LpWn {
525
+ .kne-system-layout_-LpWn {
526
526
  flex: none;
527
527
  transition: width 0.3s;
528
528
  position: relative;
529
529
  }
530
- ._-LpWn._G-zuN {
530
+ .kne-system-layout_-LpWn.kne-system-layout_G-zuN {
531
531
  width: var(--menu-max-width);
532
532
  }
533
- ._-LpWn:not(._G-zuN) {
533
+ .kne-system-layout_-LpWn:not(.kne-system-layout_G-zuN) {
534
534
  width: var(--menu-min-width);
535
535
  }
536
- ._-LpWn:not(._G-zuN) ._7wq3X {
536
+ .kne-system-layout_-LpWn:not(.kne-system-layout_G-zuN) .kne-system-layout_7wq3X {
537
537
  padding: 0 16px;
538
538
  }
539
- ._-LpWn:not(._G-zuN) ._-T-Dc {
539
+ .kne-system-layout_-LpWn:not(.kne-system-layout_G-zuN) .kne-system-layout_-T-Dc {
540
540
  padding: 8px 16px;
541
541
  justify-content: center;
542
542
  }
543
- ._-LpWn:not(._G-zuN) ._LOrmu {
543
+ .kne-system-layout_-LpWn:not(.kne-system-layout_G-zuN) .kne-system-layout_LOrmu {
544
544
  padding: 12px 0;
545
545
  border: none;
546
546
  background: none;
547
547
  justify-content: center;
548
548
  }
549
549
 
550
- ._-T-Dc {
550
+ .kne-system-layout_-T-Dc {
551
551
  padding: 8px 24px;
552
552
  display: flex;
553
553
  justify-content: flex-start;
554
554
  }
555
- ._-T-Dc img {
555
+ .kne-system-layout_-T-Dc img {
556
556
  height: 24px !important;
557
557
  object-fit: contain;
558
558
  max-width: 100%;
559
559
  }
560
560
 
561
- ._2cRWf {
561
+ .kne-system-layout_2cRWf {
562
562
  display: flex;
563
563
  align-items: center;
564
564
  }
565
565
 
566
- ._5D-Oq {
566
+ .kne-system-layout_5D-Oq {
567
567
  position: absolute;
568
568
  right: -10px;
569
569
  top: 20px;
@@ -576,11 +576,11 @@
576
576
  justify-content: center;
577
577
  transition: transform 0.3s;
578
578
  }
579
- ._5D-Oq:hover {
579
+ .kne-system-layout_5D-Oq:hover {
580
580
  transform: scale(1.2);
581
581
  }
582
582
 
583
- ._p4eOE {
583
+ .kne-system-layout_p4eOE {
584
584
  position: absolute;
585
585
  width: 100%;
586
586
  height: 100%;
@@ -589,19 +589,19 @@
589
589
  transition: opacity 0.5s;
590
590
  }
591
591
 
592
- ._8dzE7 {
592
+ .kne-system-layout_8dzE7 {
593
593
  transition: transform 0.3s;
594
594
  }
595
- ._8dzE7.is-closed {
595
+ .kne-system-layout_8dzE7.is-closed {
596
596
  transform: scaleX(-1);
597
597
  }
598
598
 
599
- ._7wq3X {
599
+ .kne-system-layout_7wq3X {
600
600
  padding: 0 8px 0 16px;
601
601
  margin-top: 12px;
602
602
  }
603
603
 
604
- ._LOrmu {
604
+ .kne-system-layout_LOrmu {
605
605
  border-radius: 8px;
606
606
  border: 1px solid rgba(255, 255, 255, 0.3);
607
607
  background: rgba(255, 255, 255, 0.12);
@@ -613,16 +613,16 @@
613
613
  overflow: hidden;
614
614
  }
615
615
 
616
- ._b7XeQ {
616
+ .kne-system-layout_b7XeQ {
617
617
  font-weight: 500;
618
618
  }
619
619
 
620
- ._U0YTk {
620
+ .kne-system-layout_U0YTk {
621
621
  font-size: 12px;
622
622
  color: var(--font-color-grey);
623
623
  }
624
624
 
625
- ._HnwkM {
625
+ .kne-system-layout_HnwkM {
626
626
  border-radius: 12px;
627
627
  border: 1px solid rgba(255, 255, 255, 0.1);
628
628
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 255, 255, 0.72) 100%);
@@ -631,11 +631,11 @@
631
631
  min-width: 0;
632
632
  }
633
633
 
634
- ._8gqbZ {
634
+ .kne-system-layout_8gqbZ {
635
635
  margin-top: 16px;
636
636
  }
637
637
 
638
- ._5qnw5 {
638
+ .kne-system-layout_5qnw5 {
639
639
  display: flex;
640
640
  justify-content: center;
641
641
  align-items: center;
@@ -651,13 +651,13 @@
651
651
  cursor: pointer;
652
652
  transition: all 0.3s;
653
653
  }
654
- ._5qnw5:hover {
654
+ .kne-system-layout_5qnw5:hover {
655
655
  background: rgba(255, 255, 255, 0.6);
656
656
  backdrop-filter: blur(40px) saturate(1.5);
657
657
  transform: scale(1.1);
658
658
  }
659
659
 
660
- ._UAJc- {
660
+ .kne-system-layout_UAJc- {
661
661
  --container-width: 400px;
662
662
  --container-height: 400px;
663
663
  --container-base-width: var(--container-width);
@@ -673,7 +673,7 @@
673
673
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08);
674
674
  transition: box-shadow 0.3s;
675
675
  }
676
- @keyframes _VjIWn {
676
+ @keyframes kne-system-layout_VjIWn {
677
677
  0%, 100% {
678
678
  transform: scale(1);
679
679
  }
@@ -681,24 +681,24 @@
681
681
  transform: scale(1.02, 0.98);
682
682
  }
683
683
  }
684
- ._UAJc-:hover {
685
- animation: _VjIWn 0.4s ease-out;
684
+ .kne-system-layout_UAJc-:hover {
685
+ animation: kne-system-layout_VjIWn 0.4s ease-out;
686
686
  background: rgba(255, 255, 255, 0.6);
687
687
  backdrop-filter: blur(10px) saturate(1.5);
688
688
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08), 0 20px 40px 0 rgba(0, 0, 0, 0.08);
689
689
  }
690
690
 
691
- ._I7Anv {
691
+ .kne-system-layout_I7Anv {
692
692
  padding: 24px 0 24px 24px;
693
693
  }
694
694
 
695
- ._UhsFd {
695
+ .kne-system-layout_UhsFd {
696
696
  background: rgba(255, 255, 255, 0.4);
697
697
  border-radius: 8px;
698
698
  height: 100%;
699
699
  transition: box-shadow 0.3s;
700
700
  }
701
- @keyframes _H7slV {
701
+ @keyframes kne-system-layout_H7slV {
702
702
  0%, 100% {
703
703
  transform: scale(1, 1);
704
704
  }
@@ -706,59 +706,59 @@
706
706
  transform: scale(1.01, 0.99);
707
707
  }
708
708
  }
709
- ._UhsFd:hover {
709
+ .kne-system-layout_UhsFd:hover {
710
710
  backdrop-filter: blur(40px) saturate(1.2);
711
- animation: _H7slV 0.4s ease-out;
711
+ animation: kne-system-layout_H7slV 0.4s ease-out;
712
712
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.05), 0 15px 30px 0 rgba(0, 0, 0, 0.08), 0 20px 40px 0 rgba(0, 0, 0, 0.08);
713
713
  }
714
714
 
715
- ._2mdNn {
715
+ .kne-system-layout_2mdNn {
716
716
  --container-height: calc(var(--page-content-height) - 58px);
717
717
  height: var(--container-height);
718
718
  }
719
719
 
720
- ._OM1Q2 {
720
+ .kne-system-layout_OM1Q2 {
721
721
  --container-height: calc(var(--page-content-height) - 48px);
722
722
  padding: 24px;
723
723
  box-sizing: border-box;
724
724
  height: var(--page-height);
725
725
  }
726
- ._OM1Q2._6gjkS {
726
+ .kne-system-layout_OM1Q2.kne-system-layout_6gjkS {
727
727
  overflow-y: auto;
728
728
  }
729
729
 
730
- ._nyAa2 {
730
+ .kne-system-layout_nyAa2 {
731
731
  width: 100%;
732
732
  }
733
733
 
734
- ._33Tja {
734
+ .kne-system-layout_33Tja {
735
735
  height: 58px;
736
736
  align-items: center;
737
737
  justify-content: space-between;
738
738
  padding: 0 16px;
739
739
  }
740
- ._33Tja .btn {
740
+ .kne-system-layout_33Tja .btn {
741
741
  font-size: 24px;
742
742
  color: var(--font-color-grey);
743
743
  cursor: pointer;
744
744
  }
745
745
 
746
- ._YmBhl {
746
+ .kne-system-layout_YmBhl {
747
747
  --container-height: calc(var(--container-base-height) - 58px);
748
748
  height: var(--container-height);
749
749
  }
750
- ._Rfzv4 {
750
+ .kne-system-layout_Rfzv4 {
751
751
  font-size: 12px;
752
752
  color: var(--font-color-grey);
753
753
  line-height: 24px;
754
754
  padding: 12px;
755
755
  }
756
756
 
757
- ._qoDtD {
757
+ .kne-system-layout_qoDtD {
758
758
  color: var(--font-color-grey);
759
759
  }
760
760
 
761
- ._socoO {
761
+ .kne-system-layout_socoO {
762
762
  opacity: 0.6;
763
763
  background: var(--font-color-grey-3);
764
764
  height: 1px;
@@ -766,7 +766,7 @@
766
766
  margin: 8px auto;
767
767
  }
768
768
 
769
- ._Xa-2h {
769
+ .kne-system-layout_Xa-2h {
770
770
  line-height: 24px;
771
771
  padding: 12px;
772
772
  margin: 2px 0;
@@ -777,35 +777,35 @@
777
777
  overflow: hidden;
778
778
  text-overflow: ellipsis;
779
779
  }
780
- ._Xa-2h:hover {
780
+ .kne-system-layout_Xa-2h:hover {
781
781
  backdrop-filter: brightness(1.1);
782
782
  transform: scale(1.02);
783
783
  }
784
- ._Xa-2h.is-active {
784
+ .kne-system-layout_Xa-2h.is-active {
785
785
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) -4%, rgba(255, 255, 255, 0.4) 70%, rgba(255, 255, 255, 0.3) 100%);
786
786
  box-shadow: 3px 3px 10px 0 rgba(0, 0, 0, 0.05);
787
787
  }
788
- ._Xa-2h.is-active ._qoDtD {
788
+ .kne-system-layout_Xa-2h.is-active .kne-system-layout_qoDtD {
789
789
  color: var(--primary-color);
790
790
  }
791
- ._Xa-2h.is-closed {
791
+ .kne-system-layout_Xa-2h.is-closed {
792
792
  display: flex;
793
793
  justify-content: center;
794
794
  }
795
- ._Xa-2h.is-closed.is-active {
795
+ .kne-system-layout_Xa-2h.is-closed.is-active {
796
796
  background: rgba(255, 255, 255, 0.6);
797
797
  backdrop-filter: blur(40px) saturate(1.5);
798
798
  }
799
- ._Xa-2h.is-closed ._qoDtD {
799
+ .kne-system-layout_Xa-2h.is-closed .kne-system-layout_qoDtD {
800
800
  font-size: 24px;
801
801
  }
802
- ._SLK-0 {
802
+ .kne-system-layout_SLK-0 {
803
803
  background: rgba(255, 255, 255, 0.72);
804
804
  backdrop-filter: blur(10px);
805
805
  padding-bottom: var(--safe-area-inset-bottom);
806
806
  }
807
807
 
808
- ._GTQvM {
808
+ .kne-system-layout_GTQvM {
809
809
  height: 60px;
810
810
  position: fixed;
811
811
  z-index: 600;
@@ -818,104 +818,104 @@
818
818
  backdrop-filter: blur(10px);
819
819
  }
820
820
 
821
- ._fAZ3n {
821
+ .kne-system-layout_fAZ3n {
822
822
  cursor: pointer;
823
823
  }
824
- ._fAZ3n.is-active ._qOB9o,
825
- ._fAZ3n.is-active ._h48es {
824
+ .kne-system-layout_fAZ3n.is-active .kne-system-layout_qOB9o,
825
+ .kne-system-layout_fAZ3n.is-active .kne-system-layout_h48es {
826
826
  color: var(--primary-color);
827
827
  }
828
828
 
829
- ._fAZ3n ._qOB9o {
829
+ .kne-system-layout_fAZ3n .kne-system-layout_qOB9o {
830
830
  width: 24px;
831
831
  height: 24px;
832
832
  font-size: 24px;
833
833
  }
834
834
 
835
- ._h48es {
835
+ .kne-system-layout_h48es {
836
836
  font-size: 12px;
837
837
  }
838
838
  @media (max-width: 768px) {
839
- ._c1kXt {
839
+ .kne-system-layout_c1kXt {
840
840
  gap: 0 !important;
841
841
  }
842
- ._c1kXt ._h-YXH {
842
+ .kne-system-layout_c1kXt .kne-system-layout_h-YXH {
843
843
  height: 48px;
844
844
  padding: 0 16px;
845
845
  background: #ffffff;
846
846
  margin-bottom: 0;
847
847
  }
848
- ._c1kXt ._IOVGr {
848
+ .kne-system-layout_c1kXt .kne-system-layout_IOVGr {
849
849
  font-size: 16px;
850
850
  flex: 1;
851
851
  color: var(--primary-color);
852
852
  }
853
- ._c1kXt ._mKsLu {
853
+ .kne-system-layout_c1kXt .kne-system-layout_mKsLu {
854
854
  flex: none;
855
855
  }
856
- ._c1kXt ._wHWje {
856
+ .kne-system-layout_c1kXt .kne-system-layout_wHWje {
857
857
  box-sizing: border-box;
858
858
  --content-height: calc(var(--page-inner-height) - 24px);
859
859
  padding: 12px;
860
860
  }
861
- ._c1kXt ._wHWje:after {
861
+ .kne-system-layout_c1kXt .kne-system-layout_wHWje:after {
862
862
  content: "";
863
863
  display: block;
864
864
  height: var(--toolbar-height);
865
865
  }
866
- ._c1kXt ._wHWje._tBnAD {
866
+ .kne-system-layout_c1kXt .kne-system-layout_wHWje.kne-system-layout_tBnAD {
867
867
  --content-height: var(--page-inner-height);
868
868
  padding: 0;
869
869
  }
870
870
  }
871
- ._c1kXt._yRZMx {
871
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx {
872
872
  gap: 0 !important;
873
873
  }
874
- ._c1kXt._yRZMx ._h-YXH {
874
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_h-YXH {
875
875
  height: 48px;
876
876
  padding: 0 16px;
877
877
  background: #ffffff;
878
878
  margin-bottom: 0;
879
879
  }
880
- ._c1kXt._yRZMx ._IOVGr {
880
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_IOVGr {
881
881
  font-size: 16px;
882
882
  flex: 1;
883
883
  color: var(--primary-color);
884
884
  }
885
- ._c1kXt._yRZMx ._mKsLu {
885
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_mKsLu {
886
886
  flex: none;
887
887
  }
888
- ._c1kXt._yRZMx ._wHWje {
888
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_wHWje {
889
889
  box-sizing: border-box;
890
890
  --content-height: calc(var(--page-inner-height) - 24px);
891
891
  padding: 12px;
892
892
  }
893
- ._c1kXt._yRZMx ._wHWje:after {
893
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_wHWje:after {
894
894
  content: "";
895
895
  display: block;
896
896
  height: var(--toolbar-height);
897
897
  }
898
- ._c1kXt._yRZMx ._wHWje._tBnAD {
898
+ .kne-system-layout_c1kXt.kne-system-layout_yRZMx .kne-system-layout_wHWje.kne-system-layout_tBnAD {
899
899
  --content-height: var(--page-inner-height);
900
900
  padding: 0;
901
901
  }
902
902
 
903
- ._jhcGo {
903
+ .kne-system-layout_jhcGo {
904
904
  white-space: nowrap;
905
905
  overflow: hidden;
906
906
  text-overflow: ellipsis;
907
907
  }
908
908
 
909
- ._h-YXH {
909
+ .kne-system-layout_h-YXH {
910
910
  margin-bottom: 12px;
911
911
  }
912
912
 
913
- ._IOVGr {
913
+ .kne-system-layout_IOVGr {
914
914
  font-size: 20px;
915
915
  font-weight: 500;
916
916
  }
917
917
 
918
- ._wHWje {
918
+ .kne-system-layout_wHWje {
919
919
  --content-height: var(--page-inner-height);
920
920
  min-height: calc(var(--page-inner-height) + var(--toolbar-height));
921
921
  display: flex;
@@ -923,33 +923,33 @@
923
923
  flex: 1;
924
924
  }
925
925
 
926
- ._mKsLu {
926
+ .kne-system-layout_mKsLu {
927
927
  display: flex;
928
928
  justify-content: flex-end;
929
929
  flex: 1;
930
930
  max-width: 50%;
931
931
  }
932
932
 
933
- ._vcf3J {
933
+ .kne-system-layout_vcf3J {
934
934
  width: 100%;
935
935
  background: #fff;
936
936
  padding: 12px;
937
937
  border-radius: 12px;
938
938
  }
939
939
 
940
- ._Y1y7o {
940
+ .kne-system-layout_Y1y7o {
941
941
  display: block;
942
942
  width: 100%;
943
943
  padding-top: var(--safe-area-inset-top);
944
944
  }
945
945
 
946
- ._vXk1s {
946
+ .kne-system-layout_vXk1s {
947
947
  display: block;
948
948
  width: 100%;
949
949
  padding-bottom: var(--safe-area-inset-bottom);
950
950
  }
951
951
 
952
- ._07Mna {
952
+ .kne-system-layout_07Mna {
953
953
  display: block;
954
954
  transform: rotate(180deg);
955
955
  }