@salesforcedevs/dx-components 0.78.1 → 0.78.2-alpha

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforcedevs/dx-components",
3
- "version": "0.78.1",
3
+ "version": "0.78.2-alpha",
4
4
  "description": "DX Lightning web components",
5
5
  "license": "MIT",
6
6
  "engines": {
@@ -1,4 +1,4 @@
1
- @import "dxHelpers/leftNavBar";
1
+ @import "dxHelpers/commonSidebar";
2
2
 
3
3
  dx-empty-state {
4
4
  --dx-c-empty-state-background: var(--sds-g-gray-2);
@@ -28,10 +28,6 @@ dx-empty-state {
28
28
  display: none;
29
29
  }
30
30
 
31
- .container.collapsed {
32
- width: var(--dx-g-spacing-xl);
33
- }
34
-
35
31
  .container.collapsed .header-toggle-button {
36
32
  transform: rotate(180deg);
37
33
  }
@@ -41,42 +37,6 @@ dx-empty-state {
41
37
  display: none;
42
38
  }
43
39
 
44
- .container:hover .header-toggle-button {
45
- --dx-c-button-opacity: 1;
46
- }
47
-
48
- .container.container-mobile {
49
- width: 100%;
50
- }
51
-
52
- .container.container-mobile .header {
53
- cursor: pointer;
54
- line-height: var(--dx-g-spacing-2xl);
55
- }
56
-
57
- .container.container-mobile:not(.collapsed) .header {
58
- background-color: #dddbda;
59
- }
60
-
61
- .container.container-mobile .header-title {
62
- color: var(--dx-g-gray-10);
63
- font-family: var(--dx-g-font-sans);
64
- font-size: var(--dx-g-text-sm);
65
- }
66
-
67
- .container.container-mobile.collapsed {
68
- height: unset;
69
- padding-bottom: 0;
70
- }
71
-
72
- .container.container-mobile.collapsed .header {
73
- margin-bottom: 0;
74
- }
75
-
76
- .container.container-mobile.collapsed .header-toggle-icon dx-icon {
77
- transform: rotateZ(-90deg);
78
- }
79
-
80
40
  @media (max-width: 768px) {
81
41
  :host {
82
42
  width: 100%;
@@ -1,45 +1,9 @@
1
- @import "dxHelpers/leftNavBar";
1
+ @import "dxHelpers/commonSidebar";
2
2
 
3
3
  .collapsed .header-toggle-button {
4
4
  transform: rotate(180deg);
5
5
  }
6
6
 
7
- .container:hover .header-toggle-button {
8
- --dx-c-button-opacity: 1;
9
- }
10
-
11
- .container.container-mobile {
12
- width: 100%;
13
- }
14
-
15
- .container.container-mobile .header {
16
- cursor: pointer;
17
- line-height: var(--dx-g-spacing-2xl);
18
- }
19
-
20
- .container.container-mobile:not(.collapsed) .header {
21
- background-color: #dddbda;
22
- }
23
-
24
- .container.container-mobile .header-title {
25
- color: var(--dx-g-gray-10);
26
- font-family: var(--dx-g-font-sans);
27
- font-size: var(--dx-g-text-sm);
28
- }
29
-
30
- .container.container-mobile.collapsed {
31
- height: unset;
32
- padding-bottom: 0;
33
- }
34
-
35
- .container.container-mobile.collapsed .header {
36
- margin-bottom: 0;
37
- }
38
-
39
- .container.container-mobile.collapsed .header-toggle-icon dx-icon {
40
- transform: rotateZ(-90deg);
41
- }
42
-
43
7
  .sidebar-content {
44
8
  overflow-y: auto;
45
9
  }
@@ -1,6 +1,6 @@
1
1
  @import "dxHelpers/reset";
2
2
  @import "dxHelpers/text";
3
- @import "dxHelpers/sidebar";
3
+ @import "dxHelpers/commonTreeItem";
4
4
 
5
5
  a {
6
6
  display: flex;
@@ -1,5 +1,5 @@
1
1
  @import "dxHelpers/reset";
2
- @import "dxHelpers/sidebar";
2
+ @import "dxHelpers/commonTreeItem";
3
3
 
4
4
  :host {
5
5
  display: block;
@@ -94,6 +94,38 @@ dx-tree:not(:last-child) {
94
94
  --dx-c-button-opacity: 1;
95
95
  }
96
96
 
97
+ .container.container-mobile {
98
+ width: 100%;
99
+ }
100
+
101
+ .container.container-mobile .header {
102
+ cursor: pointer;
103
+ line-height: var(--dx-g-spacing-2xl);
104
+ }
105
+
106
+ .container.container-mobile:not(.collapsed) .header {
107
+ background-color: #dddbda;
108
+ }
109
+
110
+ .container.container-mobile .header-title {
111
+ color: var(--dx-g-gray-10);
112
+ font-family: var(--dx-g-font-sans);
113
+ font-size: var(--dx-g-text-sm);
114
+ }
115
+
116
+ .container.container-mobile.collapsed {
117
+ height: unset;
118
+ padding-bottom: 0;
119
+ }
120
+
121
+ .container.container-mobile.collapsed .header {
122
+ margin-bottom: 0;
123
+ }
124
+
125
+ .container.container-mobile.collapsed .header-toggle-icon dx-icon {
126
+ transform: rotateZ(-90deg);
127
+ }
128
+
97
129
  .container.container-border-active {
98
130
  --border-color: var(--dx-c-sidebar-button-color);
99
131
  }