coveragebook_components 0.8.1 → 0.8.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (73) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/build/coco/app.css +427 -303
  3. data/app/assets/build/coco/app.js +469 -230
  4. data/app/assets/build/coco/book.js +394 -175
  5. data/app/assets/build/coco/icons/armchair.svg +1 -1
  6. data/app/assets/build/coco/icons/folder-archive.svg +1 -1
  7. data/app/assets/build/coco/icons/folder-check.svg +1 -1
  8. data/app/assets/build/coco/icons/folder-clock.svg +1 -1
  9. data/app/assets/build/coco/icons/folder-closed.svg +1 -1
  10. data/app/assets/build/coco/icons/folder-cog.svg +1 -1
  11. data/app/assets/build/coco/icons/folder-down.svg +1 -1
  12. data/app/assets/build/coco/icons/folder-edit.svg +1 -1
  13. data/app/assets/build/coco/icons/folder-git.svg +1 -1
  14. data/app/assets/build/coco/icons/folder-heart.svg +1 -1
  15. data/app/assets/build/coco/icons/folder-input.svg +1 -1
  16. data/app/assets/build/coco/icons/folder-key.svg +1 -1
  17. data/app/assets/build/coco/icons/folder-lock.svg +1 -1
  18. data/app/assets/build/coco/icons/folder-minus.svg +1 -1
  19. data/app/assets/build/coco/icons/folder-open.svg +1 -1
  20. data/app/assets/build/coco/icons/folder-plus.svg +1 -1
  21. data/app/assets/build/coco/icons/folder-search-2.svg +1 -1
  22. data/app/assets/build/coco/icons/folder-search.svg +1 -1
  23. data/app/assets/build/coco/icons/folder-tree.svg +1 -1
  24. data/app/assets/build/coco/icons/folder-up.svg +1 -1
  25. data/app/assets/build/coco/icons/folder-x.svg +1 -1
  26. data/app/assets/build/coco/icons/folder.svg +1 -1
  27. data/app/assets/build/coco/icons/folders.svg +1 -1
  28. data/app/assets/build/coco/icons/git-commit-vertical.svg +1 -0
  29. data/app/assets/build/coco/icons/git-compare-arrows.svg +1 -0
  30. data/app/assets/build/coco/icons/git-fork.svg +1 -1
  31. data/app/assets/build/coco/icons/git-graph.svg +1 -0
  32. data/app/assets/build/coco/icons/git-pull-request-arrow.svg +1 -0
  33. data/app/assets/build/coco/icons/git-pull-request-closed.svg +1 -1
  34. data/app/assets/build/coco/icons/git-pull-request-create-arrow.svg +1 -0
  35. data/app/assets/build/coco/icons/git-pull-request-create.svg +1 -0
  36. data/app/assets/build/coco/icons/power-circle.svg +1 -0
  37. data/app/assets/build/coco/icons/power-square.svg +1 -0
  38. data/app/assets/build/coco/icons/power.svg +1 -1
  39. data/app/assets/js/app/setup.js +4 -3
  40. data/app/assets/js/helpers/location.js +4 -2
  41. data/app/components/coco/app/blocks/sidebar_nav/item/item.css +121 -0
  42. data/app/components/coco/app/blocks/sidebar_nav/item/item.html.erb +9 -0
  43. data/app/components/coco/app/blocks/{sidebar_nav_item/sidebar_nav_item.js → sidebar_nav/item/item.js} +12 -2
  44. data/app/components/coco/app/blocks/sidebar_nav/item/item.rb +50 -0
  45. data/app/components/coco/app/blocks/sidebar_nav/menu/menu.css +138 -0
  46. data/app/components/coco/app/blocks/sidebar_nav/menu/menu.html.erb +24 -0
  47. data/app/components/coco/app/blocks/sidebar_nav/menu/menu.js +13 -0
  48. data/app/components/coco/app/blocks/sidebar_nav/menu/menu.rb +48 -0
  49. data/app/components/coco/app/blocks/sidebar_nav/navbar/navbar.css +75 -0
  50. data/app/components/coco/app/blocks/sidebar_nav/navbar/navbar.html.erb +29 -0
  51. data/app/components/coco/app/blocks/sidebar_nav/navbar/navbar.rb +50 -0
  52. data/app/components/coco/base/icon/icon.rb +1 -0
  53. data/app/components/coco/base/modal/modal.html.erb +1 -0
  54. data/app/components/coco/base/modal/modal.js +5 -0
  55. data/app/components/coco/component.rb +2 -2
  56. data/app/helpers/coco/app_helper.rb +5 -1
  57. data/app/helpers/coco/book_helper.rb +4 -4
  58. data/app/helpers/coco/component_helper.rb +2 -2
  59. data/app/helpers/coco/integration_helper.rb +4 -4
  60. data/config/icons.json +9 -1
  61. data/config/tokens.cjs +6 -0
  62. data/lib/coco/options/group.rb +9 -9
  63. data/lib/coco/test_helpers.rb +2 -2
  64. data/lib/coco.rb +1 -1
  65. metadata +23 -11
  66. data/app/components/coco/app/blocks/sidebar_nav/sidebar_nav.css +0 -110
  67. data/app/components/coco/app/blocks/sidebar_nav/sidebar_nav.html.erb +0 -42
  68. data/app/components/coco/app/blocks/sidebar_nav/sidebar_nav.rb +0 -28
  69. data/app/components/coco/app/blocks/sidebar_nav_item/sidebar_nav_item.css +0 -153
  70. data/app/components/coco/app/blocks/sidebar_nav_item/sidebar_nav_item.html.erb +0 -45
  71. data/app/components/coco/app/blocks/sidebar_nav_item/sidebar_nav_item.rb +0 -108
  72. /data/app/assets/build/coco/icons/{git-commit.svg → git-commit-horizontal.svg} +0 -0
  73. /data/app/components/coco/app/blocks/sidebar_nav/{sidebar_nav.js → navbar/navbar.js} +0 -0
@@ -1385,140 +1385,7 @@ select{
1385
1385
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
1386
1386
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
1387
1387
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}
1388
- [data-coco][data-component="app-sidebar-nav"]{
1389
- --tw-bg-opacity: 1;
1390
- background-color: rgb(31 41 55 / var(--tw-bg-opacity));
1391
- -webkit-font-smoothing: antialiased;
1392
- -moz-osx-font-smoothing: grayscale;
1393
- display: grid;
1394
- height: 3.5rem;
1395
- width: 100%;
1396
- grid-template-rows: repeat(1, minmax(0, 1fr));
1397
- grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1fr)}
1398
- [data-coco][data-component="app-sidebar-nav"] .nav-action{
1399
- cursor: pointer}
1400
- [data-coco][data-component="app-sidebar-nav"] .nav-action > a:hover{
1401
- --tw-bg-opacity: 1 !important;
1402
- background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important}
1403
- [data-coco][data-component="app-sidebar-nav"] .nav-action .nav-item-label{
1404
- display: none;
1405
- --tw-text-opacity: 1 !important;
1406
- color: rgb(0 153 121 / var(--tw-text-opacity)) !important}
1407
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button{
1408
- --tw-bg-opacity: 1;
1409
- background-color: rgb(0 153 121 / var(--tw-bg-opacity));
1410
- --tw-text-opacity: 1;
1411
- color: rgb(255 255 255 / var(--tw-text-opacity));
1412
- transition-property: all;
1413
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1414
- transition-duration: 150ms;
1415
- margin-left: auto;
1416
- margin-right: auto;
1417
- display: flex;
1418
- height: 2.5rem;
1419
- width: 2.5rem;
1420
- cursor: pointer;
1421
- align-items: center;
1422
- justify-content: center;
1423
- border-radius: 9999px}
1424
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button:hover {
1425
- transform: scale(1.05);
1426
- }
1427
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button .coco-icon{
1428
- height: 1.5rem;
1429
- width: 1.5rem}
1430
- [data-coco][data-component="app-sidebar-nav"] .nav-item{
1431
- display: none;
1432
- height: 100%;
1433
- width: 100%;
1434
- justify-content: center}
1435
- @media (min-width: 576px){
1436
-
1437
- [data-coco][data-component="app-sidebar-nav"] .nav-item{
1438
- display: contents}}
1439
- [data-coco][data-component="app-sidebar-nav"] .mobile-nav-item{
1440
- display: flex}
1441
- @media (min-width: 576px){
1442
-
1443
- [data-coco][data-component="app-sidebar-nav"] .mobile-nav-item{
1444
- display: contents}
1445
- [data-coco][data-component="app-sidebar-nav"]{
1446
- display: block;
1447
- height: 100%;
1448
- width: 4.5rem}
1449
-
1450
- [data-coco][data-component="app-sidebar-nav"] .nav-action .nav-item-label{
1451
- display: block}
1452
-
1453
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button{
1454
- margin-bottom: 0.5rem;
1455
- height: 3.5rem;
1456
- width: 3.5rem}
1457
-
1458
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button .coco-icon{
1459
- height: 2rem;
1460
- width: 2rem}}
1461
- @media (min-width: 992px) {
1462
-
1463
- [data-coco][data-component="app-sidebar-nav"]{
1464
- display: block;
1465
- height: 100%;
1466
- width: 6rem}
1467
-
1468
- [data-coco][data-component="app-sidebar-nav"] .nav-action .nav-item-label{
1469
- display: block}
1470
-
1471
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button{
1472
- height: 72px;
1473
- width: 72px}
1474
-
1475
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button .coco-icon{
1476
- height: 2.5rem;
1477
- width: 2.5rem}
1478
- }
1479
- @media (max-height: 760px) and (min-width: 576px) {
1480
- [data-coco][data-component="app-sidebar-nav"]{
1481
- display: block;
1482
- height: 100%;
1483
- width: 4.5rem}
1484
-
1485
- [data-coco][data-component="app-sidebar-nav"] .nav-action .nav-item-label{
1486
- display: block}
1487
-
1488
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button{
1489
- margin-bottom: 0.5rem;
1490
- height: 3.5rem;
1491
- width: 3.5rem}
1492
-
1493
- [data-coco][data-component="app-sidebar-nav"] .nav-actions-button .coco-icon{
1494
- height: 2rem;
1495
- width: 2rem}
1496
- }
1497
- .sidebar-nav-action{
1498
- display: flex;
1499
- align-items: flex-start;
1500
- padding: 0.25rem}
1501
- .sidebar-nav-action .sidebar-nav-action-icon{
1502
- margin-right: 0.75rem;
1503
- flex: none;
1504
- --tw-text-opacity: 1;
1505
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1506
- .sidebar-nav-action .sidebar-nav-action-detail{
1507
- width: 100%;
1508
- text-align: left}
1509
- .sidebar-nav-action .sidebar-nav-action-label{
1510
- margin-bottom: 0.125rem;
1511
- font-weight: 600;
1512
- --tw-text-opacity: 1;
1513
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1514
- .sidebar-nav-action .sidebar-nav-action-description{
1515
- font-size: 12px;
1516
- line-height: 16px}
1517
- .sidebar-nav-menu a.sidebar-nav-actions-item {
1518
- width: 320px;
1519
- }
1520
1388
  [data-coco][data-component="app-sidebar-nav-item"]{
1521
- flex: none;
1522
1389
  cursor: pointer;
1523
1390
  --tw-bg-opacity: 1;
1524
1391
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
@@ -1530,10 +1397,11 @@ select{
1530
1397
  width: 100%;
1531
1398
  flex-direction: column;
1532
1399
  align-items: center;
1533
- justify-content: center;
1534
- padding-left: 1rem;
1535
- padding-right: 1rem}
1536
- [data-coco][data-component="app-sidebar-nav-item"]:hover{
1400
+ justify-content: center}
1401
+ [data-coco][data-component="app-sidebar-nav-item"].active,
1402
+ [data-coco][data-component="app-sidebar-nav-item"]:hover{
1403
+ --tw-bg-opacity: 1;
1404
+ background-color: rgb(17 24 39 / var(--tw-bg-opacity));
1537
1405
  --tw-text-opacity: 1;
1538
1406
  color: rgb(255 255 255 / var(--tw-text-opacity))}
1539
1407
  [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon{
@@ -1542,238 +1410,447 @@ select{
1542
1410
  display: block;
1543
1411
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
1544
1412
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1545
- transition-duration: 150ms;
1546
- height: 1.5rem;
1547
- width: 1.5rem}
1413
+ transition-duration: 150ms}
1548
1414
  [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1549
- margin-top: 0.125rem;
1550
1415
  display: block;
1551
1416
  cursor: pointer;
1552
- font-size: 10px;
1553
- line-height: 12px;
1554
1417
  font-weight: 600;
1555
1418
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
1556
1419
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1557
1420
  transition-duration: 150ms}
1558
- @media (min-width: 576px){
1421
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button{
1422
+ --tw-bg-opacity: 1;
1423
+ background-color: rgb(0 153 121 / var(--tw-bg-opacity));
1424
+ --tw-text-opacity: 1;
1425
+ color: rgb(255 255 255 / var(--tw-text-opacity));
1426
+ transition-property: all;
1427
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1428
+ transition-duration: 150ms;
1429
+ margin-left: auto;
1430
+ margin-right: auto;
1431
+ display: flex;
1432
+ cursor: pointer;
1433
+ align-items: center;
1434
+ justify-content: center;
1435
+ border-radius: 9999px}
1436
+ @media (max-width: 576px) {
1437
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1438
+ margin-top: 0.125rem;
1439
+ font-size: 10px;
1440
+ line-height: 12px}
1441
+
1442
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon .coco-icon{
1443
+ height: 1.5rem;
1444
+ width: 1.5rem}
1559
1445
 
1560
- [data-coco][data-component="app-sidebar-nav-item"].emphasised .nav-item-icon{
1446
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button{
1447
+ height: 3rem;
1448
+ width: 3rem}
1449
+
1450
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button .coco-icon{
1451
+ height: 1.5rem;
1452
+ width: 1.5rem}
1453
+ }
1454
+ @media (min-width: 576px) and (max-width: 768px) {
1455
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button:hover {
1456
+ transform: scale(1.05);
1457
+ }
1458
+
1459
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]{
1460
+ --tw-bg-opacity: 1;
1461
+ background-color: rgb(55 65 81 / var(--tw-bg-opacity));
1561
1462
  --tw-text-opacity: 1;
1562
- color: rgb(0 153 121 / var(--tw-text-opacity))}}
1563
- [data-coco][data-component="app-sidebar-nav-item"].active{
1564
- --tw-text-opacity: 1;
1565
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1566
- [data-coco][data-component="app-sidebar-nav-item"]:hover .nav-item-icon{
1567
- --tw-text-opacity: 1;
1568
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1569
- @media (min-width: 576px){
1463
+ color: rgb(255 255 255 / var(--tw-text-opacity))}
1570
1464
 
1571
- [data-coco][data-component="app-sidebar-nav-item"]:hover.emphasised .nav-item-icon{
1465
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]:hover{
1466
+ --tw-bg-opacity: 1;
1467
+ background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
1468
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon{
1572
1469
  --tw-text-opacity: 1;
1573
- color: rgb(0 153 121 / var(--tw-text-opacity))}}
1574
- [data-coco][data-component="app-sidebar-nav-item"]:hover .nav-item-label{
1575
- --tw-text-opacity: 1;
1576
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1577
- @media (min-width: 576px) {
1470
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1471
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon:hover{
1472
+ --tw-text-opacity: 1;
1473
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1474
+
1578
1475
  [data-coco][data-component="app-sidebar-nav-item"]{
1579
- display: block;
1580
- padding-left: 0.5rem;
1581
- padding-right: 0.5rem;
1582
1476
  padding-top: 1rem;
1583
1477
  padding-bottom: 1rem}
1584
- [data-coco][data-component="app-sidebar-nav-item"]:hover{
1585
- --tw-bg-opacity: 1;
1586
- background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1587
-
1588
- [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon{
1589
- height: 1.75rem;
1590
- width: 1.75rem}
1591
1478
 
1592
1479
  [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1593
1480
  margin-top: 0.25rem;
1594
1481
  font-size: 10px;
1595
1482
  line-height: 12px}
1596
1483
 
1597
- [data-coco][data-component="app-sidebar-nav-item"].active{
1484
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon .coco-icon{
1485
+ height: 1.5rem;
1486
+ width: 1.5rem}
1487
+
1488
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button{
1489
+ height: 3rem;
1490
+ width: 3rem}
1491
+
1492
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button .coco-icon{
1493
+ height: 1.5rem;
1494
+ width: 1.5rem}
1495
+ }
1496
+ @media (min-width: 768px) {
1497
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button:hover {
1498
+ transform: scale(1.05);
1499
+ }
1500
+
1501
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]{
1598
1502
  --tw-bg-opacity: 1;
1599
1503
  background-color: rgb(55 65 81 / var(--tw-bg-opacity));
1600
1504
  --tw-text-opacity: 1;
1601
1505
  color: rgb(255 255 255 / var(--tw-text-opacity))}
1602
1506
 
1603
- [data-coco][data-component="app-sidebar-nav-item"].active:hover{
1507
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]:hover{
1604
1508
  --tw-bg-opacity: 1;
1605
1509
  background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
1606
- }
1607
- @media (min-width: 992px) {
1510
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon{
1511
+ --tw-text-opacity: 1;
1512
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1513
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon:hover{
1514
+ --tw-text-opacity: 1;
1515
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1608
1516
 
1609
1517
  [data-coco][data-component="app-sidebar-nav-item"]{
1610
1518
  padding-top: 1.25rem;
1611
1519
  padding-bottom: 1.25rem}
1612
1520
 
1613
- [data-coco][data-component="app-sidebar-nav-item"]:hover{
1614
- --tw-bg-opacity: 1;
1615
- background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1521
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1522
+ margin-top: 0.375rem;
1523
+ font-size: 12px;
1524
+ line-height: 14px}
1616
1525
 
1617
- [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon{
1526
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon .coco-icon{
1618
1527
  height: 2rem;
1619
1528
  width: 2rem}
1620
1529
 
1621
- [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1622
- font-size: 12px;
1623
- line-height: 14px}
1530
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button {
1531
+ height: 72px;
1532
+ width: 72px;
1533
+ }
1624
1534
 
1625
- [data-coco][data-component="app-sidebar-nav-item"].active{
1535
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button .coco-icon{
1536
+ height: 2.5rem;
1537
+ width: 2.5rem}
1538
+ }
1539
+ @media (max-height: 760px) and (min-width: 576px) {
1540
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button:hover {
1541
+ transform: scale(1.05);
1542
+ }
1543
+
1544
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]{
1626
1545
  --tw-bg-opacity: 1;
1627
1546
  background-color: rgb(55 65 81 / var(--tw-bg-opacity));
1628
1547
  --tw-text-opacity: 1;
1629
1548
  color: rgb(255 255 255 / var(--tw-text-opacity))}
1630
1549
 
1631
- [data-coco][data-component="app-sidebar-nav-item"].active:hover{
1550
+ [data-coco][data-component="app-sidebar-nav-item"][data-active="true"]:hover{
1632
1551
  --tw-bg-opacity: 1;
1633
1552
  background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
1634
- }
1635
- @media (max-height: 760px) and (min-width: 576px) {
1553
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon{
1554
+ --tw-text-opacity: 1;
1555
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1556
+ [data-coco][data-component="app-sidebar-nav-item"][data-emphasise="true"] .nav-item-icon:hover{
1557
+ --tw-text-opacity: 1;
1558
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1559
+
1636
1560
  [data-coco][data-component="app-sidebar-nav-item"]{
1637
- display: block;
1638
- padding-left: 0.5rem;
1639
- padding-right: 0.5rem;
1640
1561
  padding-top: 1rem;
1641
1562
  padding-bottom: 1rem}
1642
- [data-coco][data-component="app-sidebar-nav-item"]:hover{
1643
- --tw-bg-opacity: 1;
1644
- background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1645
-
1646
- [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon{
1647
- height: 1.75rem;
1648
- width: 1.75rem}
1649
1563
 
1650
1564
  [data-coco][data-component="app-sidebar-nav-item"] .nav-item-label{
1651
1565
  margin-top: 0.25rem;
1652
1566
  font-size: 10px;
1653
1567
  line-height: 12px}
1654
1568
 
1655
- [data-coco][data-component="app-sidebar-nav-item"].active{
1656
- --tw-bg-opacity: 1;
1657
- background-color: rgb(55 65 81 / var(--tw-bg-opacity));
1658
- --tw-text-opacity: 1;
1659
- color: rgb(255 255 255 / var(--tw-text-opacity))}
1569
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-icon .coco-icon{
1570
+ height: 1.5rem;
1571
+ width: 1.5rem}
1660
1572
 
1661
- [data-coco][data-component="app-sidebar-nav-item"].active:hover{
1662
- --tw-bg-opacity: 1;
1663
- background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
1573
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button{
1574
+ height: 3rem;
1575
+ width: 3rem}
1576
+
1577
+ [data-coco][data-component="app-sidebar-nav-item"] .nav-item-action-button .coco-icon{
1578
+ height: 1.5rem;
1579
+ width: 1.5rem}
1664
1580
  }
1665
- .sidebar-nav-menu > :not([hidden]) ~ :not([hidden]){
1581
+ [data-coco][data-component="app-sidebar-nav-menu"] > :not([hidden]) ~ :not([hidden]){
1666
1582
  --tw-divide-y-reverse: 0;
1667
1583
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
1668
1584
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
1669
- border-color: rgb(156 163 175 / 0.2)}
1670
- .sidebar-nav-menu{
1585
+ --tw-divide-opacity: 1;
1586
+ border-color: rgb(55 65 81 / var(--tw-divide-opacity))}
1587
+ [data-coco][data-component="app-sidebar-nav-menu"]{
1671
1588
  overflow: hidden;
1672
1589
  --tw-bg-opacity: 1;
1673
1590
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
1591
+ -webkit-font-smoothing: antialiased;
1592
+ -moz-osx-font-smoothing: grayscale;
1674
1593
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1675
1594
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1676
1595
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}
1677
1596
  @media (min-width: 576px){
1678
1597
 
1679
- .sidebar-nav-menu{
1598
+ [data-coco][data-component="app-sidebar-nav-menu"]{
1680
1599
  border-top-right-radius: 0.375rem;
1681
1600
  border-bottom-right-radius: 0.375rem}}
1682
- [data-placement="bottom"] .sidebar-nav-menu{
1601
+ [data-coco][data-component="app-sidebar-nav-menu"] {
1602
+ width: -moz-min-content;
1603
+ width: min-content;
1604
+ }
1605
+ [data-placement="bottom"] [data-coco][data-component="app-sidebar-nav-menu"]{
1683
1606
  border-bottom-right-radius: 0.375rem;
1684
1607
  border-bottom-left-radius: 0.375rem}
1685
- [data-placement="top"] .sidebar-nav-menu{
1608
+ [data-placement="top"] [data-coco][data-component="app-sidebar-nav-menu"]{
1686
1609
  border-top-left-radius: 0.375rem;
1687
1610
  border-top-right-radius: 0.375rem}
1688
- .sidebar-nav-menu .sidebar-nav-menu-select{
1689
- width: 100%;
1690
- border-width: 0px;
1691
- background-color: transparent;
1692
- font-weight: 600;
1693
- --tw-text-opacity: 1;
1694
- color: rgb(229 231 235 / var(--tw-text-opacity))}
1695
- .sidebar-nav-menu .sidebar-nav-menu-select:hover{
1696
- --tw-bg-opacity: 1;
1697
- background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1698
- .sidebar-nav-menu .sidebar-nav-menu-select:focus{
1699
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1700
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1701
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}
1702
- .sidebar-nav-menu .sidebar-nav-menu-select:active{
1703
- --tw-bg-opacity: 1;
1704
- background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1705
- .sidebar-nav-menu .sidebar-nav-menu-item{
1611
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link{
1706
1612
  display: flex;
1707
1613
  width: 100%;
1708
1614
  align-items: center;
1709
1615
  --tw-bg-opacity: 1;
1710
1616
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
1711
- padding: 0.75rem;
1712
- text-align: center;
1617
+ padding-top: 0.75rem;
1618
+ padding-bottom: 0.75rem;
1713
1619
  --tw-text-opacity: 1;
1714
1620
  color: rgb(156 163 175 / var(--tw-text-opacity));
1715
- text-decoration-line: none;
1716
1621
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
1717
1622
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
1718
1623
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
1719
1624
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1720
1625
  transition-duration: 150ms}
1721
- .sidebar-nav-menu .coco-link.sidebar-nav-menu-item:hover{
1626
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link:hover{
1722
1627
  --tw-bg-opacity: 1;
1723
1628
  background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1724
- .sidebar-nav-menu .sidebar-nav-menu-item-text{
1629
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-label{
1725
1630
  min-width: 0px;
1726
1631
  overflow: hidden;
1727
1632
  text-overflow: ellipsis;
1728
1633
  white-space: nowrap;
1729
- font-weight: 600;
1730
1634
  --tw-text-opacity: 1;
1731
1635
  color: rgb(255 255 255 / var(--tw-text-opacity));
1732
1636
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
1733
1637
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1734
1638
  transition-duration: 150ms}
1735
- .sidebar-nav-menu .sidebar-nav-menu-item-qualifier{
1639
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-qualifier{
1736
1640
  margin-left: auto;
1737
1641
  flex: none;
1738
1642
  padding-left: 1rem;
1739
1643
  font-size: 14px;
1740
1644
  line-height: 16px}
1741
- .sidebar-nav-menu .sidebar-nav-menu-select{
1742
- font-size: 1rem;
1743
- line-height: 1.5rem}
1744
- .sidebar-nav-menu .sidebar-nav-menu-item{
1745
- font-size: 1rem;
1746
- line-height: 1.5rem;
1747
- width: 280px}
1748
- @media (min-width: 576px) {
1749
- .sidebar-nav-menu .sidebar-nav-menu-select{
1645
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1646
+ background-color: transparent;
1647
+ --tw-text-opacity: 1;
1648
+ color: rgb(229 231 235 / var(--tw-text-opacity))}
1649
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select:hover{
1650
+ --tw-bg-opacity: 1;
1651
+ background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1652
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select:focus{
1653
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1654
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1655
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}
1656
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select:active{
1657
+ --tw-bg-opacity: 1;
1658
+ background-color: rgb(17 24 39 / var(--tw-bg-opacity))}
1659
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1660
+ width: 100%;
1661
+ border-width: 0px;
1662
+ padding-top: 0.75rem;
1663
+ padding-bottom: 0.75rem}
1664
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-action{
1665
+ padding-top: 0.5rem;
1666
+ padding-bottom: 0.5rem}
1667
+ [data-coco][data-component="app-sidebar-nav-menu"] .card{
1668
+ display: grid;
1669
+ -moz-column-gap: 1rem;
1670
+ column-gap: 1rem;
1671
+ row-gap: 0.25rem;
1672
+ grid-template-areas: "icon title" "icon text";
1673
+ grid-template-columns: min-content 1fr}
1674
+ [data-coco][data-component="app-sidebar-nav-menu"] .card .coco-icon{
1675
+ margin-top: 0.125rem;
1676
+ height: 1.25rem;
1677
+ width: 1.25rem;
1678
+ grid-area: icon}
1679
+ [data-coco][data-component="app-sidebar-nav-menu"] .card h4{
1680
+ font-size: 16px;
1681
+ line-height: 20px;
1682
+ font-weight: 700;
1683
+ --tw-text-opacity: 1;
1684
+ color: rgb(255 255 255 / var(--tw-text-opacity));
1685
+ grid-area: title}
1686
+ [data-coco][data-component="app-sidebar-nav-menu"] .card div{
1687
+ font-size: 14px;
1688
+ line-height: 20px;
1689
+ grid-area: text}
1690
+ @media (max-width: 576px) {
1691
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item {
1692
+ width: 280px;
1693
+ }
1694
+
1695
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-label{
1696
+ font-size: 1rem;
1697
+ line-height: 1.5rem}
1698
+
1699
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1700
+ font-size: 1rem;
1701
+ line-height: 1.5rem}
1702
+
1703
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-action{
1704
+ padding-left: 1.5rem;
1705
+ padding-right: 1.5rem}
1706
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .menu-item {
1707
+ width: 320px;
1708
+ }
1709
+
1710
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .coco-link{
1711
+ padding-left: 1rem;
1712
+ padding-right: 1rem;
1713
+ padding-top: 1rem;
1714
+ padding-bottom: 1rem}
1715
+ }
1716
+ @media (min-width: 576px) and (max-width: 768px) {
1717
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item {
1718
+ width: 240px;
1719
+ }
1720
+
1721
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-label{
1750
1722
  font-size: 0.875rem;
1751
1723
  line-height: 1.25rem}
1752
1724
 
1753
- .sidebar-nav-menu .sidebar-nav-menu-item{
1725
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1754
1726
  font-size: 0.875rem;
1755
- line-height: 1.25rem;
1756
- width: 240px}
1727
+ line-height: 1.25rem}
1728
+
1729
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-action{
1730
+ padding-left: 1rem;
1731
+ padding-right: 1rem}
1732
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .menu-item {
1733
+ width: 280px;
1734
+ }
1735
+
1736
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .coco-link{
1737
+ padding-left: 1rem;
1738
+ padding-right: 1rem;
1739
+ padding-top: 1rem;
1740
+ padding-bottom: 1rem}
1757
1741
  }
1758
- @media (min-width: 992px) {
1759
- .sidebar-nav-menu .sidebar-nav-menu-select{
1742
+ @media (min-width: 768px) {
1743
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item {
1744
+ width: 280px;
1745
+ }
1746
+
1747
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-label{
1760
1748
  font-size: 1rem;
1761
1749
  line-height: 1.5rem}
1762
1750
 
1763
- .sidebar-nav-menu .sidebar-nav-menu-item{
1751
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1764
1752
  font-size: 1rem;
1765
- line-height: 1.5rem;
1766
- width: 280px}
1753
+ line-height: 1.5rem}
1754
+
1755
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-action{
1756
+ padding-left: 1.5rem;
1757
+ padding-right: 1.5rem}
1758
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .menu-item {
1759
+ width: 320px;
1760
+ }
1761
+
1762
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .coco-link{
1763
+ padding-left: 1rem;
1764
+ padding-right: 1rem;
1765
+ padding-top: 1rem;
1766
+ padding-bottom: 1rem}
1767
1767
  }
1768
1768
  @media (max-height: 760px) and (min-width: 576px) {
1769
- .sidebar-nav-menu .sidebar-nav-menu-select{
1769
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item {
1770
+ width: 240px;
1771
+ }
1772
+
1773
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-label{
1770
1774
  font-size: 0.875rem;
1771
1775
  line-height: 1.25rem}
1772
1776
 
1773
- .sidebar-nav-menu .sidebar-nav-menu-item{
1777
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select{
1774
1778
  font-size: 0.875rem;
1775
- line-height: 1.25rem;
1776
- width: 240px}
1779
+ line-height: 1.25rem}
1780
+
1781
+ [data-coco][data-component="app-sidebar-nav-menu"] .menu-item-link .coco-link,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-select select,[data-coco][data-component="app-sidebar-nav-menu"] .menu-item-action{
1782
+ padding-left: 1rem;
1783
+ padding-right: 1rem}
1784
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .menu-item {
1785
+ width: 280px;
1786
+ }
1787
+
1788
+ [data-coco][data-component="app-sidebar-nav-menu"].nav-card-menu .coco-link{
1789
+ padding-left: 1rem;
1790
+ padding-right: 1rem;
1791
+ padding-top: 1rem;
1792
+ padding-bottom: 1rem}
1793
+ }
1794
+ [data-coco][data-component="app-sidebar-nav"]{
1795
+ --tw-bg-opacity: 1;
1796
+ background-color: rgb(31 41 55 / var(--tw-bg-opacity));
1797
+ -webkit-font-smoothing: antialiased;
1798
+ -moz-osx-font-smoothing: grayscale}
1799
+ @media (max-width: 576px) {
1800
+ [data-coco][data-component="app-sidebar-nav"]{
1801
+ display: grid;
1802
+ height: 3.5rem;
1803
+ width: 100%;
1804
+ grid-auto-flow: column;
1805
+ grid-auto-columns: 1fr}
1806
+
1807
+ [data-coco][data-component="app-sidebar-nav"] .nav-item{
1808
+ display: flex;
1809
+ align-items: stretch}
1810
+
1811
+ [data-coco][data-component="app-sidebar-nav"] .nav-item[data-show-on-mobile="false"]{
1812
+ display: none}
1813
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action .nav-item-label{
1814
+ display: none}
1815
+ }
1816
+ @media (min-width: 576px) and (max-width: 768px) {
1817
+
1818
+ [data-coco][data-component="app-sidebar-nav"]{
1819
+ height: 100%}
1820
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action .nav-item-label{
1821
+ --tw-text-opacity: 1;
1822
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1823
+
1824
+ [data-coco][data-component="app-sidebar-nav"]{
1825
+ width: 4rem}
1826
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action [data-component="app-sidebar-nav-item"]{
1827
+ padding-bottom: 0.625rem}
1828
+ }
1829
+ @media (min-width: 768px) {
1830
+
1831
+ [data-coco][data-component="app-sidebar-nav"]{
1832
+ height: 100%}
1833
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action .nav-item-label{
1834
+ --tw-text-opacity: 1;
1835
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1836
+
1837
+ [data-coco][data-component="app-sidebar-nav"]{
1838
+ width: 6rem}
1839
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action [data-component="app-sidebar-nav-item"]{
1840
+ padding-bottom: 0.75rem}
1841
+ }
1842
+ @media (max-height: 760px) and (min-width: 576px) {
1843
+
1844
+ [data-coco][data-component="app-sidebar-nav"]{
1845
+ height: 100%}
1846
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action .nav-item-label{
1847
+ --tw-text-opacity: 1;
1848
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
1849
+
1850
+ [data-coco][data-component="app-sidebar-nav"]{
1851
+ width: 4rem}
1852
+ [data-coco][data-component="app-sidebar-nav"] .nav-item-action [data-component="app-sidebar-nav-item"]{
1853
+ padding-bottom: 0.625rem}
1777
1854
  }
1778
1855
  [data-coco][data-component="app-slat"]{
1779
1856
  padding-left: 0.75rem}
@@ -4885,66 +4962,113 @@ select{
4885
4962
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
4886
4963
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4887
4964
  border-color: rgba(0, 12, 39, 0.1)}
4888
- .sidebar-nav-vertical-condensed .nav-action .nav-item-label{
4889
- display: block}
4890
- .sidebar-nav-vertical-condensed .nav-actions-button{
4891
- margin-bottom: 0.5rem;
4892
- height: 3.5rem;
4893
- width: 3.5rem}
4894
- .sidebar-nav-vertical-condensed .nav-actions-button .coco-icon{
4895
- height: 2rem;
4896
- width: 2rem}
4897
- .sidebar-nav-vertical .nav-action .nav-item-label{
4898
- display: block}
4899
- .sidebar-nav-vertical .nav-actions-button{
4900
- height: 72px;
4901
- width: 72px}
4902
- .sidebar-nav-vertical .nav-actions-button .coco-icon{
4903
- height: 2.5rem;
4904
- width: 2.5rem}
4905
- .sidebar-nav-item-vertical-condensed .nav-item-icon{
4906
- height: 1.75rem;
4907
- width: 1.75rem}
4908
- .sidebar-nav-item-vertical-condensed .nav-item-label{
4909
- margin-top: 0.25rem;
4965
+ .app-sidebar-nav-horizontal-item .nav-item-label{
4966
+ margin-top: 0.125rem;
4910
4967
  font-size: 10px;
4911
4968
  line-height: 12px}
4912
- .sidebar-nav-item-vertical-condensed.active{
4913
- --tw-bg-opacity: 1;
4914
- background-color: rgb(55 65 81 / var(--tw-bg-opacity));
4969
+ .app-sidebar-nav-horizontal-item .nav-item-icon .coco-icon{
4970
+ height: 1.5rem;
4971
+ width: 1.5rem}
4972
+ .app-sidebar-nav-horizontal-item .nav-item-action-button{
4973
+ height: 3rem;
4974
+ width: 3rem}
4975
+ .app-sidebar-nav-horizontal-item .nav-item-action-button .coco-icon{
4976
+ height: 1.5rem;
4977
+ width: 1.5rem}
4978
+ .app-sidebar-nav-vertical-item .nav-item-action-button:hover {
4979
+ transform: scale(1.05);
4980
+ }
4981
+ .app-sidebar-nav-vertical-item[data-emphasise="true"] .nav-item-icon{
4915
4982
  --tw-text-opacity: 1;
4916
- color: rgb(255 255 255 / var(--tw-text-opacity))}
4917
- .sidebar-nav-item-vertical-condensed.active:hover{
4918
- --tw-bg-opacity: 1;
4919
- background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
4920
- .sidebar-nav-item-vertical .nav-item-icon{
4921
- height: 2rem;
4922
- width: 2rem}
4923
- .sidebar-nav-item-vertical .nav-item-label{
4983
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
4984
+ .app-sidebar-nav-vertical-item[data-emphasise="true"] .nav-item-icon:hover{
4985
+ --tw-text-opacity: 1;
4986
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
4987
+ .app-sidebar-nav-vertical-narrow-item .nav-item-label{
4988
+ margin-top: 0.25rem;
4989
+ font-size: 10px;
4990
+ line-height: 12px}
4991
+ .app-sidebar-nav-vertical-narrow-item .nav-item-icon .coco-icon{
4992
+ height: 1.5rem;
4993
+ width: 1.5rem}
4994
+ .app-sidebar-nav-vertical-narrow-item .nav-item-action-button{
4995
+ height: 3rem;
4996
+ width: 3rem}
4997
+ .app-sidebar-nav-vertical-narrow-item .nav-item-action-button .coco-icon{
4998
+ height: 1.5rem;
4999
+ width: 1.5rem}
5000
+ .app-sidebar-nav-vertical-wide-item .nav-item-label{
5001
+ margin-top: 0.375rem;
4924
5002
  font-size: 12px;
4925
5003
  line-height: 14px}
4926
- .sidebar-nav-item-vertical.active{
4927
- --tw-bg-opacity: 1;
4928
- background-color: rgb(55 65 81 / var(--tw-bg-opacity));
4929
- --tw-text-opacity: 1;
4930
- color: rgb(255 255 255 / var(--tw-text-opacity))}
4931
- .sidebar-nav-item-vertical.active:hover{
4932
- --tw-bg-opacity: 1;
4933
- background-color: rgb(55 65 81 / var(--tw-bg-opacity))}
4934
- .sidebar-nav-menu-small .sidebar-nav-menu-select{
5004
+ .app-sidebar-nav-vertical-wide-item .nav-item-icon .coco-icon{
5005
+ height: 2rem;
5006
+ width: 2rem}
5007
+ .app-sidebar-nav-vertical-wide-item .nav-item-action-button {
5008
+ height: 72px;
5009
+ width: 72px;
5010
+ }
5011
+ .app-sidebar-nav-vertical-wide-item .nav-item-action-button .coco-icon{
5012
+ height: 2.5rem;
5013
+ width: 2.5rem}
5014
+ .app-sidebar-nav-menu-small .menu-item {
5015
+ width: 240px;
5016
+ }
5017
+ .app-sidebar-nav-menu-small .menu-item-label{
4935
5018
  font-size: 0.875rem;
4936
5019
  line-height: 1.25rem}
4937
- .sidebar-nav-menu-small .sidebar-nav-menu-item{
5020
+ .app-sidebar-nav-menu-small .menu-item-select select{
4938
5021
  font-size: 0.875rem;
4939
- line-height: 1.25rem;
4940
- width: 240px}
4941
- .sidebar-nav-menu-large .sidebar-nav-menu-select{
5022
+ line-height: 1.25rem}
5023
+ .app-sidebar-nav-menu-small .menu-item-link .coco-link,
5024
+ .app-sidebar-nav-menu-small .menu-item-select select,
5025
+ .app-sidebar-nav-menu-small .menu-item-action{
5026
+ padding-left: 1rem;
5027
+ padding-right: 1rem}
5028
+ .app-sidebar-nav-menu-small.nav-card-menu .menu-item {
5029
+ width: 280px;
5030
+ }
5031
+ .app-sidebar-nav-menu-small.nav-card-menu .coco-link{
5032
+ padding-left: 1rem;
5033
+ padding-right: 1rem;
5034
+ padding-top: 1rem;
5035
+ padding-bottom: 1rem}
5036
+ .app-sidebar-nav-menu-regular .menu-item {
5037
+ width: 280px;
5038
+ }
5039
+ .app-sidebar-nav-menu-regular .menu-item-label{
4942
5040
  font-size: 1rem;
4943
5041
  line-height: 1.5rem}
4944
- .sidebar-nav-menu-large .sidebar-nav-menu-item{
5042
+ .app-sidebar-nav-menu-regular .menu-item-select select{
4945
5043
  font-size: 1rem;
4946
- line-height: 1.5rem;
4947
- width: 280px}
5044
+ line-height: 1.5rem}
5045
+ .app-sidebar-nav-menu-regular .menu-item-link .coco-link,
5046
+ .app-sidebar-nav-menu-regular .menu-item-select select,
5047
+ .app-sidebar-nav-menu-regular .menu-item-action{
5048
+ padding-left: 1.5rem;
5049
+ padding-right: 1.5rem}
5050
+ .app-sidebar-nav-menu-regular.nav-card-menu .menu-item {
5051
+ width: 320px;
5052
+ }
5053
+ .app-sidebar-nav-menu-regular.nav-card-menu .coco-link{
5054
+ padding-left: 1rem;
5055
+ padding-right: 1rem;
5056
+ padding-top: 1rem;
5057
+ padding-bottom: 1rem}
5058
+ .app-sidebar-nav-horizontal .nav-item{
5059
+ display: flex;
5060
+ align-items: stretch}
5061
+ .app-sidebar-nav-horizontal .nav-item[data-show-on-mobile="false"]{
5062
+ display: none}
5063
+ .app-sidebar-nav-horizontal .nav-item-action .nav-item-label{
5064
+ display: none}
5065
+ .app-sidebar-nav-vertical .nav-item-action .nav-item-label{
5066
+ --tw-text-opacity: 1;
5067
+ color: rgb(0 153 121 / var(--tw-text-opacity))}
5068
+ .app-sidebar-nav-vertical-narrow .nav-item-action [data-component="app-sidebar-nav-item"]{
5069
+ padding-bottom: 0.625rem}
5070
+ .app-sidebar-nav-vertical-wide .nav-item-action [data-component="app-sidebar-nav-item"]{
5071
+ padding-bottom: 0.75rem}
4948
5072
  .app-alert-stacked .alert-container{
4949
5073
  padding-top: 1rem;
4950
5074
  padding-bottom: 1rem}