@scania/tegel-lite 0.1.0-side-menu-beta.0 → 0.1.0-side-menu-beta.1

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 (3) hide show
  1. package/dist/components.css +38 -4
  2. package/dist/tl-side-menu.css +38 -4
  3. package/package.json +1 -1
package/dist/components.css CHANGED
@@ -6901,7 +6901,7 @@ body {
6901
6901
  display: none;
6902
6902
  }
6903
6903
 
6904
- .tl-side-menu__end-list {
6904
+ .tl-side-menu__end-list .tl-side-menu__item {
6905
6905
  border-top: var(--side-menu-item-border-thickness) solid var(--side-menu-item-border-bottom-color);
6906
6906
  }
6907
6907
  .tl-side-menu__wrapper--empty .tl-side-menu__end-list {
@@ -6922,7 +6922,6 @@ body {
6922
6922
 
6923
6923
  .tl-side-menu__collapse {
6924
6924
  display: none;
6925
- border-top: var(--side-menu-item-border-thickness) solid var(--side-menu-item-border-bottom-color);
6926
6925
  }
6927
6926
  @media (min-width: 992px) {
6928
6927
  .tl-side-menu--persistent .tl-side-menu__collapse {
@@ -6940,7 +6939,7 @@ body {
6940
6939
 
6941
6940
  .tl-side-menu__aside {
6942
6941
  background-color: var(--side-menu-background);
6943
- width: 100%;
6942
+ width: 80%;
6944
6943
  height: inherit;
6945
6944
  position: relative;
6946
6945
  left: 0;
@@ -7069,7 +7068,42 @@ body {
7069
7068
  max-width: 300px;
7070
7069
  flex-direction: column;
7071
7070
  }
7072
- .tl-side-menu--collapsed .tl-side-menu__dropdown-header {
7071
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar {
7072
+ width: var(--tl-scrollbar-width);
7073
+ }
7074
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-track {
7075
+ background: var(--tl-scrollbar-track-color);
7076
+ }
7077
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-thumb {
7078
+ border-radius: var(--tl-scrollbar-thumb-border-radius);
7079
+ background: var(--tl-scrollbar-thumb-color);
7080
+ border-width: var(--tl-scrollbar-thumb-border-width);
7081
+ border-style: solid;
7082
+ border-color: transparent;
7083
+ background-clip: padding-box;
7084
+ }
7085
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-thumb:hover {
7086
+ border-width: var(--tl-scrollbar-thumb-border-hover-width);
7087
+ border-radius: var(--tl-scrollbar-hover-thumb-border-radius);
7088
+ }
7089
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-button {
7090
+ height: 0;
7091
+ width: 0;
7092
+ }
7093
+ @supports not selector(::-webkit-scrollbar) {
7094
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu {
7095
+ scrollbar-color: var(--tl-scrollbar-thumb-color) var(--tl-scrollbar-track-color);
7096
+ scrollbar-width: var(--tl-scrollbar-width-standard);
7097
+ }
7098
+ }
7099
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu {
7100
+ overflow-y: auto;
7101
+ max-height: 350px;
7102
+ }
7103
+ .tl-side-menu--collapsed .tl-side-menu__dropdown:hover .tl-side-menu__dropdown-menu {
7104
+ display: flex;
7105
+ }
7106
+ .tl-side-menu--collapsed .tl-side-menu__dropdown:hover .tl-side-menu__dropdown-menu .tl-side-menu__dropdown-header {
7073
7107
  display: flex;
7074
7108
  align-items: center;
7075
7109
  padding: 16px 24px 15px;
package/dist/tl-side-menu.css CHANGED
@@ -433,7 +433,7 @@ body {
433
433
  display: none;
434
434
  }
435
435
 
436
- .tl-side-menu__end-list {
436
+ .tl-side-menu__end-list .tl-side-menu__item {
437
437
  border-top: var(--side-menu-item-border-thickness) solid var(--side-menu-item-border-bottom-color);
438
438
  }
439
439
  .tl-side-menu__wrapper--empty .tl-side-menu__end-list {
@@ -454,7 +454,6 @@ body {
454
454
 
455
455
  .tl-side-menu__collapse {
456
456
  display: none;
457
- border-top: var(--side-menu-item-border-thickness) solid var(--side-menu-item-border-bottom-color);
458
457
  }
459
458
  @media (min-width: 992px) {
460
459
  .tl-side-menu--persistent .tl-side-menu__collapse {
@@ -472,7 +471,7 @@ body {
472
471
 
473
472
  .tl-side-menu__aside {
474
473
  background-color: var(--side-menu-background);
475
- width: 100%;
474
+ width: 80%;
476
475
  height: inherit;
477
476
  position: relative;
478
477
  left: 0;
@@ -601,7 +600,42 @@ body {
601
600
  max-width: 300px;
602
601
  flex-direction: column;
603
602
  }
604
- .tl-side-menu--collapsed .tl-side-menu__dropdown-header {
603
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar {
604
+ width: var(--tl-scrollbar-width);
605
+ }
606
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-track {
607
+ background: var(--tl-scrollbar-track-color);
608
+ }
609
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-thumb {
610
+ border-radius: var(--tl-scrollbar-thumb-border-radius);
611
+ background: var(--tl-scrollbar-thumb-color);
612
+ border-width: var(--tl-scrollbar-thumb-border-width);
613
+ border-style: solid;
614
+ border-color: transparent;
615
+ background-clip: padding-box;
616
+ }
617
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-thumb:hover {
618
+ border-width: var(--tl-scrollbar-thumb-border-hover-width);
619
+ border-radius: var(--tl-scrollbar-hover-thumb-border-radius);
620
+ }
621
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu::-webkit-scrollbar-button {
622
+ height: 0;
623
+ width: 0;
624
+ }
625
+ @supports not selector(::-webkit-scrollbar) {
626
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu {
627
+ scrollbar-color: var(--tl-scrollbar-thumb-color) var(--tl-scrollbar-track-color);
628
+ scrollbar-width: var(--tl-scrollbar-width-standard);
629
+ }
630
+ }
631
+ .tl-side-menu--collapsed .tl-side-menu__dropdown-menu {
632
+ overflow-y: auto;
633
+ max-height: 350px;
634
+ }
635
+ .tl-side-menu--collapsed .tl-side-menu__dropdown:hover .tl-side-menu__dropdown-menu {
636
+ display: flex;
637
+ }
638
+ .tl-side-menu--collapsed .tl-side-menu__dropdown:hover .tl-side-menu__dropdown-menu .tl-side-menu__dropdown-header {
605
639
  display: flex;
606
640
  align-items: center;
607
641
  padding: 16px 24px 15px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scania/tegel-lite",
3
- "version": "0.1.0-side-menu-beta.0",
3
+ "version": "0.1.0-side-menu-beta.1",
4
4
  "description": "Styles-only library for Tegel Design System (Beta)",
5
5
  "type": "module",
6
6
  "keywords": [