@egovernments/digit-ui-components-css 0.0.2-beta.11 → 0.0.2-beta.13

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 (51) hide show
  1. package/CHANGELOG.md +92 -88
  2. package/README.md +80 -80
  3. package/dist/index.css +810 -16
  4. package/dist/index.min.css +2 -2
  5. package/package.json +69 -69
  6. package/src/digitv2/components/FormComposerV2.scss +118 -118
  7. package/src/digitv2/components/actionbarV2.scss +206 -206
  8. package/src/digitv2/components/backLinkV2.scss +36 -36
  9. package/src/digitv2/components/bodyContainerV2.scss +39 -39
  10. package/src/digitv2/components/breadcrumbV2.scss +56 -56
  11. package/src/digitv2/components/buttonsV2.scss +450 -451
  12. package/src/digitv2/components/cardV2.scss +497 -497
  13. package/src/digitv2/components/cardbasedoptionsV2.scss +46 -46
  14. package/src/digitv2/components/cardlabelV2.scss +7 -7
  15. package/src/digitv2/components/checkboxV2.scss +83 -83
  16. package/src/digitv2/components/chipV2.scss +129 -129
  17. package/src/digitv2/components/dividerV2.scss +10 -10
  18. package/src/digitv2/components/errorMessageV2.scss +20 -20
  19. package/src/digitv2/components/fieldV1.scss +96 -96
  20. package/src/digitv2/components/headerdropdownV2.scss +151 -151
  21. package/src/digitv2/components/infoCardV2.scss +139 -139
  22. package/src/digitv2/components/infobuttonV2.scss +75 -75
  23. package/src/digitv2/components/labelFieldPairV2.scss +66 -66
  24. package/src/digitv2/components/mobileNumberV2.scss +65 -65
  25. package/src/digitv2/components/mobilesidebarV2.scss +439 -0
  26. package/src/digitv2/components/multiSelectDropdownV2.scss +315 -315
  27. package/src/digitv2/components/panelCardV2.scss +160 -160
  28. package/src/digitv2/components/panelV2.scss +114 -114
  29. package/src/digitv2/components/popUpV2.scss +330 -330
  30. package/src/digitv2/components/radiobtnV2.scss +115 -115
  31. package/src/digitv2/components/selectDropdownV2.scss +364 -364
  32. package/src/digitv2/components/sidebarV2.scss +409 -0
  33. package/src/digitv2/components/stepperV2.scss +147 -147
  34. package/src/digitv2/components/textInputV2.scss +462 -462
  35. package/src/digitv2/components/textareaV2.scss +99 -99
  36. package/src/digitv2/components/textblockV2.scss +46 -46
  37. package/src/digitv2/components/timelineV2.scss +170 -170
  38. package/src/digitv2/components/toastV2.scss +80 -80
  39. package/src/digitv2/components/toggleV2.scss +72 -72
  40. package/src/digitv2/components/tooltipwrapperV2.scss +96 -0
  41. package/src/digitv2/components/topbarV2.scss +387 -387
  42. package/src/digitv2/components/treeSelectV2.scss +132 -132
  43. package/src/digitv2/components/uploaderV2.scss +556 -556
  44. package/src/digitv2/components/viewCardFieldPairV2.scss +44 -44
  45. package/src/digitv2/index.scss +172 -169
  46. package/src/digitv2/pages/employee/index.scss +1 -1
  47. package/src/digitv2/pages/employee/workbench.scss +615 -615
  48. package/src/digitv2/typography.scss +638 -638
  49. package/src/index.scss +677 -681
  50. package/src/pages/employee/index.scss +625 -625
  51. package/src/pages/employee/login.scss +220 -220
package/src/digitv2/components/popUpV2.scss CHANGED
@@ -1,331 +1,331 @@
1
- .digit-popup-overlay {
2
- position: fixed;
3
- top: 0;
4
- left: 0;
5
- width: 100%;
6
- height: 100%;
7
- background-color: rgba(11, 12, 12, 0.7);
8
- display: flex;
9
- justify-content: center;
10
- align-items: center;
11
- z-index: 9999;
12
- backdrop-filter: blur(2px);
13
- -webkit-backdrop-filter: blur(2px);
14
-
15
- .digit-popup-wrapper {
16
- @apply w-full h-auto flex-col fixed;
17
- z-index: 10000;
18
- background-color: theme(digitv2.lightTheme.paper-primary);
19
- border-radius: theme(digitv2.spacers.spacer1);
20
- box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000029;
21
- display: flex;
22
- top: 50%;
23
- left: 50%;
24
- transform: translate(-50%, -50%);
25
-
26
- @media (min-width: 48rem) {
27
- max-height: 86%;
28
- max-width: 51%;
29
- }
30
-
31
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
32
- max-height: 82%;
33
- max-width: 74%;
34
- }
35
-
36
- @media (max-width: 30rem) {
37
- max-height: 80%;
38
- max-width: 91%;
39
- }
40
-
41
- &.alert {
42
- text-align: center;
43
- }
44
-
45
- .digit-popup-close {
46
- @apply items-center cursor-pointer absolute;
47
- display: flex;
48
- justify-content: flex-end;
49
- width: theme(digitv2.spacers.spacer6);
50
- height: theme(digitv2.spacers.spacer6);
51
-
52
- @media (min-width: 48rem) {
53
- top: theme(digitv2.spacers.spacer3);
54
- right: theme(digitv2.spacers.spacer3);
55
- }
56
-
57
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
58
- top: theme(digitv2.spacers.spacer3);
59
- right: theme(digitv2.spacers.spacer3);
60
- }
61
-
62
- @media (max-width: 30rem) {
63
- top: theme(digitv2.spacers.spacer2);
64
- right: theme(digitv2.spacers.spacer2);
65
- }
66
-
67
-
68
- svg {
69
- flex-shrink: 0;
70
-
71
- @media (min-width: 48rem) {
72
- width: theme(digitv2.spacers.spacer7) !important;
73
- height: theme(digitv2.spacers.spacer7) !important;
74
- }
75
-
76
- }
77
- }
78
-
79
- .digit-popup-header {
80
- @apply flex-col;
81
- display: flex !important;
82
- gap: theme(digitv2.spacers.spacer4);
83
-
84
- .digit-popup-icon-header-container {
85
- display: flex !important;
86
- gap: theme(digitv2.spacers.spacer2);
87
-
88
- svg {
89
- flex-shrink: 0;
90
- }
91
-
92
- .digit-popup-heading-subheading-wrap {
93
- @apply flex-col;
94
- display: flex !important;
95
- gap: theme(digitv2.spacers.spacer1);
96
- color: theme(digitv2.lightTheme.text-primary);
97
-
98
- .digit-popup-heading {
99
- @extend .typography.heading-l;
100
- line-height: normal;
101
- }
102
-
103
- .digit-popup-subheading {
104
- @extend .typography.caption-s;
105
- }
106
- }
107
- }
108
-
109
- &.with-shadow {
110
- box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
111
- }
112
-
113
- @media (min-width: 48rem) {
114
- padding: theme(digitv2.spacers.spacer6);
115
- padding-bottom: theme(digitv2.spacers.spacer0);
116
-
117
- &.with-shadow {
118
- padding-bottom: theme(digitv2.spacers.spacer6);
119
- }
120
- }
121
-
122
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
123
- padding: theme(digitv2.spacers.spacer5);
124
- padding-bottom: theme(digitv2.spacers.spacer0);
125
-
126
- &.with-shadow {
127
- padding-bottom: theme(digitv2.spacers.spacer5);
128
- }
129
- }
130
-
131
- @media (max-width: 30rem) {
132
- padding: theme(digitv2.spacers.spacer4);
133
- padding-bottom: theme(digitv2.spacers.spacer0);
134
-
135
- &.with-shadow {
136
- padding-bottom: theme(digitv2.spacers.spacer4);
137
- }
138
- }
139
-
140
- }
141
-
142
- .digit-popup-children-wrap {
143
- @extend .typography.body-s;
144
- @apply overflow-hidden overflow-y-auto flex-col;
145
- display: flex;
146
- flex: 1;
147
- color: theme(digitv2.lightTheme.text-primary);
148
-
149
- .digit-popup-description {
150
- @extend .typography.body-s;
151
- color: theme(digitv2.lightTheme.text-primary);
152
- }
153
-
154
- &.inline {
155
- flex-direction: row;
156
- }
157
-
158
- @media (min-width: 48rem) {
159
- gap: theme(digitv2.spacers.spacer6);
160
- padding: theme(digitv2.spacers.spacer6) theme(digitv2.spacers.spacer6) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer6);
161
-
162
- &.with-shadow,
163
- &.without-footer{
164
- padding: theme(digitv2.spacers.spacer6);
165
- }
166
-
167
- }
168
-
169
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
170
- gap: theme(digitv2.spacers.spacer5);
171
- padding: theme(digitv2.spacers.spacer5) theme(digitv2.spacers.spacer5) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer5);
172
-
173
- &.with-shadow,
174
- &.without-footer{
175
- padding: theme(digitv2.spacers.spacer5);
176
- }
177
-
178
- }
179
-
180
- @media (max-width: 30rem) {
181
- gap: theme(digitv2.spacers.spacer4);
182
- padding: theme(digitv2.spacers.spacer4) theme(digitv2.spacers.spacer4) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer4);
183
-
184
- &.with-shadow,
185
- &.without-footer{
186
- padding: theme(digitv2.spacers.spacer4);
187
- }
188
- }
189
- }
190
-
191
- .digit-popup-footer {
192
- @apply flex-wrap;
193
- display: flex;
194
- gap: theme(digitv2.spacers.spacer4);
195
-
196
- &.with-shadow {
197
- box-shadow: theme(digitv2.spacers.spacer0) -0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
198
- }
199
-
200
- @media (min-width: 48rem) {
201
- padding: theme(digitv2.spacers.spacer6);
202
- }
203
-
204
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
205
- @apply w-full;
206
- padding: theme(digitv2.spacers.spacer5);
207
- }
208
-
209
- @media (max-width: 30rem) {
210
- @apply flex-col;
211
- padding: theme(digitv2.spacers.spacer4);
212
- }
213
- }
214
-
215
- .digit-popup-footer-buttons {
216
- margin-left: auto;
217
- display: flex;
218
- gap: theme(digitv2.spacers.spacer4);
219
- @apply max-w-full flex-wrap;
220
-
221
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
222
- @apply w-full;
223
-
224
- button {
225
- flex: 1;
226
- }
227
- }
228
-
229
- @media (max-width: 30rem) {
230
- @apply flex-col;
231
- margin: theme(digitv2.spacers.spacer0);
232
-
233
- button {
234
- width: 100%;
235
- }
236
- }
237
-
238
- &.equal-buttons{
239
- width: 100%;
240
-
241
- @media (min-width: 30.063rem) {
242
-
243
- button {
244
- flex: 1;
245
- }
246
- }
247
- }
248
- }
249
-
250
-
251
- &.equal-buttons{
252
- width: 100%;
253
-
254
- button{
255
- flex:1;
256
- }
257
- }
258
-
259
-
260
- .digit-popup-alert-content {
261
- @apply flex-col items-center;
262
- display: flex;
263
- gap: theme(digitv2.spacers.spacer2);
264
-
265
- .digit-popup-alert-heading {
266
- @extend .typography.heading-l;
267
- line-height: normal;
268
- color: theme(digitv2.lightTheme.text-primary);
269
- }
270
-
271
- .digit-popup-alert-message {
272
- @extend .typography.caption-s;
273
- text-align: center;
274
- color: theme(digitv2.lightTheme.text-primary);
275
- }
276
-
277
- &.with-shadow {
278
- box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
279
- }
280
-
281
- @media (min-width: 48rem) {
282
- padding: theme(digitv2.spacers.spacer6);
283
- padding-bottom: theme(digitv2.spacers.spacer0);
284
-
285
- &.with-shadow {
286
- padding-bottom: theme(digitv2.spacers.spacer6);
287
- }
288
- }
289
-
290
- @media (min-width: 30.063rem) and (max-width: 47.938rem) {
291
- padding: theme(digitv2.spacers.spacer5);
292
- padding-bottom: theme(digitv2.spacers.spacer0);
293
-
294
- &.with-shadow {
295
- padding-bottom: theme(digitv2.spacers.spacer5);
296
- }
297
- }
298
-
299
- @media (max-width: 30rem) {
300
- padding: theme(digitv2.spacers.spacer4);
301
- padding-bottom: theme(digitv2.spacers.spacer0);
302
-
303
- &.with-shadow {
304
- padding-bottom: theme(digitv2.spacers.spacer4);
305
- }
306
- }
307
- }
308
-
309
- .popup-info-card {
310
- margin: theme(digitv2.spacers.spacer0);
311
- width: 100%;
312
- max-width: 100%;
313
- min-width: 100%;
314
- }
315
- }
316
- }
317
-
318
- .digit-popup-children-wrap::-webkit-scrollbar {
319
- width: theme(digitv2.spacers.spacer2);
320
- background-color: theme(digitv2.lightTheme.generic-background);
321
- }
322
-
323
- .digit-popup-children-wrap::-webkit-scrollbar-track {
324
- background-color: theme(digitv2.lightTheme.generic-background);
325
- border-radius: 0.563rem;
326
- }
327
-
328
- .digit-popup-children-wrap::-webkit-scrollbar-thumb {
329
- background-color: theme(digitv2.lightTheme.generic-divider);
330
- border-radius: 0.563rem;
1
+ .digit-popup-overlay {
2
+ position: fixed;
3
+ top: 0;
4
+ left: 0;
5
+ width: 100%;
6
+ height: 100%;
7
+ background-color: rgba(11, 12, 12, 0.7);
8
+ display: flex;
9
+ justify-content: center;
10
+ align-items: center;
11
+ z-index: 9999;
12
+ backdrop-filter: blur(2px);
13
+ -webkit-backdrop-filter: blur(2px);
14
+
15
+ .digit-popup-wrapper {
16
+ @apply w-full h-auto flex-col fixed;
17
+ z-index: 10000;
18
+ background-color: theme(digitv2.lightTheme.paper-primary);
19
+ border-radius: theme(digitv2.spacers.spacer1);
20
+ box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000029;
21
+ display: flex;
22
+ top: 50%;
23
+ left: 50%;
24
+ transform: translate(-50%, -50%);
25
+
26
+ @media (min-width: 48rem) {
27
+ max-height: 86%;
28
+ max-width: 51%;
29
+ }
30
+
31
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
32
+ max-height: 82%;
33
+ max-width: 74%;
34
+ }
35
+
36
+ @media (max-width: 30rem) {
37
+ max-height: 80%;
38
+ max-width: 91%;
39
+ }
40
+
41
+ &.alert {
42
+ text-align: center;
43
+ }
44
+
45
+ .digit-popup-close {
46
+ @apply items-center cursor-pointer absolute;
47
+ display: flex;
48
+ justify-content: flex-end;
49
+ width: theme(digitv2.spacers.spacer6);
50
+ height: theme(digitv2.spacers.spacer6);
51
+
52
+ @media (min-width: 48rem) {
53
+ top: theme(digitv2.spacers.spacer3);
54
+ right: theme(digitv2.spacers.spacer3);
55
+ }
56
+
57
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
58
+ top: theme(digitv2.spacers.spacer3);
59
+ right: theme(digitv2.spacers.spacer3);
60
+ }
61
+
62
+ @media (max-width: 30rem) {
63
+ top: theme(digitv2.spacers.spacer2);
64
+ right: theme(digitv2.spacers.spacer2);
65
+ }
66
+
67
+
68
+ svg {
69
+ flex-shrink: 0;
70
+
71
+ @media (min-width: 48rem) {
72
+ width: theme(digitv2.spacers.spacer7) !important;
73
+ height: theme(digitv2.spacers.spacer7) !important;
74
+ }
75
+
76
+ }
77
+ }
78
+
79
+ .digit-popup-header {
80
+ @apply flex-col;
81
+ display: flex !important;
82
+ gap: theme(digitv2.spacers.spacer4);
83
+
84
+ .digit-popup-icon-header-container {
85
+ display: flex !important;
86
+ gap: theme(digitv2.spacers.spacer2);
87
+
88
+ svg {
89
+ flex-shrink: 0;
90
+ }
91
+
92
+ .digit-popup-heading-subheading-wrap {
93
+ @apply flex-col;
94
+ display: flex !important;
95
+ gap: theme(digitv2.spacers.spacer1);
96
+ color: theme(digitv2.lightTheme.text-primary);
97
+
98
+ .digit-popup-heading {
99
+ @extend .typography.heading-l;
100
+ line-height: normal;
101
+ }
102
+
103
+ .digit-popup-subheading {
104
+ @extend .typography.caption-s;
105
+ }
106
+ }
107
+ }
108
+
109
+ &.with-shadow {
110
+ box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
111
+ }
112
+
113
+ @media (min-width: 48rem) {
114
+ padding: theme(digitv2.spacers.spacer6);
115
+ padding-bottom: theme(digitv2.spacers.spacer0);
116
+
117
+ &.with-shadow {
118
+ padding-bottom: theme(digitv2.spacers.spacer6);
119
+ }
120
+ }
121
+
122
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
123
+ padding: theme(digitv2.spacers.spacer5);
124
+ padding-bottom: theme(digitv2.spacers.spacer0);
125
+
126
+ &.with-shadow {
127
+ padding-bottom: theme(digitv2.spacers.spacer5);
128
+ }
129
+ }
130
+
131
+ @media (max-width: 30rem) {
132
+ padding: theme(digitv2.spacers.spacer4);
133
+ padding-bottom: theme(digitv2.spacers.spacer0);
134
+
135
+ &.with-shadow {
136
+ padding-bottom: theme(digitv2.spacers.spacer4);
137
+ }
138
+ }
139
+
140
+ }
141
+
142
+ .digit-popup-children-wrap {
143
+ @extend .typography.body-s;
144
+ @apply overflow-hidden overflow-y-auto flex-col;
145
+ display: flex;
146
+ flex: 1;
147
+ color: theme(digitv2.lightTheme.text-primary);
148
+
149
+ .digit-popup-description {
150
+ @extend .typography.body-s;
151
+ color: theme(digitv2.lightTheme.text-primary);
152
+ }
153
+
154
+ &.inline {
155
+ flex-direction: row;
156
+ }
157
+
158
+ @media (min-width: 48rem) {
159
+ gap: theme(digitv2.spacers.spacer6);
160
+ padding: theme(digitv2.spacers.spacer6) theme(digitv2.spacers.spacer6) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer6);
161
+
162
+ &.with-shadow,
163
+ &.without-footer{
164
+ padding: theme(digitv2.spacers.spacer6);
165
+ }
166
+
167
+ }
168
+
169
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
170
+ gap: theme(digitv2.spacers.spacer5);
171
+ padding: theme(digitv2.spacers.spacer5) theme(digitv2.spacers.spacer5) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer5);
172
+
173
+ &.with-shadow,
174
+ &.without-footer{
175
+ padding: theme(digitv2.spacers.spacer5);
176
+ }
177
+
178
+ }
179
+
180
+ @media (max-width: 30rem) {
181
+ gap: theme(digitv2.spacers.spacer4);
182
+ padding: theme(digitv2.spacers.spacer4) theme(digitv2.spacers.spacer4) theme(digitv2.spacers.spacer0) theme(digitv2.spacers.spacer4);
183
+
184
+ &.with-shadow,
185
+ &.without-footer{
186
+ padding: theme(digitv2.spacers.spacer4);
187
+ }
188
+ }
189
+ }
190
+
191
+ .digit-popup-footer {
192
+ @apply flex-wrap;
193
+ display: flex;
194
+ gap: theme(digitv2.spacers.spacer4);
195
+
196
+ &.with-shadow {
197
+ box-shadow: theme(digitv2.spacers.spacer0) -0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
198
+ }
199
+
200
+ @media (min-width: 48rem) {
201
+ padding: theme(digitv2.spacers.spacer6);
202
+ }
203
+
204
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
205
+ @apply w-full;
206
+ padding: theme(digitv2.spacers.spacer5);
207
+ }
208
+
209
+ @media (max-width: 30rem) {
210
+ @apply flex-col;
211
+ padding: theme(digitv2.spacers.spacer4);
212
+ }
213
+ }
214
+
215
+ .digit-popup-footer-buttons {
216
+ margin-left: auto;
217
+ display: flex;
218
+ gap: theme(digitv2.spacers.spacer4);
219
+ @apply max-w-full flex-wrap;
220
+
221
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
222
+ @apply w-full;
223
+
224
+ button {
225
+ flex: 1;
226
+ }
227
+ }
228
+
229
+ @media (max-width: 30rem) {
230
+ @apply flex-col;
231
+ margin: theme(digitv2.spacers.spacer0);
232
+
233
+ button {
234
+ width: 100%;
235
+ }
236
+ }
237
+
238
+ &.equal-buttons{
239
+ width: 100%;
240
+
241
+ @media (min-width: 30.063rem) {
242
+
243
+ button {
244
+ flex: 1;
245
+ }
246
+ }
247
+ }
248
+ }
249
+
250
+
251
+ &.equal-buttons{
252
+ width: 100%;
253
+
254
+ button{
255
+ flex:1;
256
+ }
257
+ }
258
+
259
+
260
+ .digit-popup-alert-content {
261
+ @apply flex-col items-center;
262
+ display: flex;
263
+ gap: theme(digitv2.spacers.spacer2);
264
+
265
+ .digit-popup-alert-heading {
266
+ @extend .typography.heading-l;
267
+ line-height: normal;
268
+ color: theme(digitv2.lightTheme.text-primary);
269
+ }
270
+
271
+ .digit-popup-alert-message {
272
+ @extend .typography.caption-s;
273
+ text-align: center;
274
+ color: theme(digitv2.lightTheme.text-primary);
275
+ }
276
+
277
+ &.with-shadow {
278
+ box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.125rem theme(digitv2.spacers.spacer0) #00000026;
279
+ }
280
+
281
+ @media (min-width: 48rem) {
282
+ padding: theme(digitv2.spacers.spacer6);
283
+ padding-bottom: theme(digitv2.spacers.spacer0);
284
+
285
+ &.with-shadow {
286
+ padding-bottom: theme(digitv2.spacers.spacer6);
287
+ }
288
+ }
289
+
290
+ @media (min-width: 30.063rem) and (max-width: 47.938rem) {
291
+ padding: theme(digitv2.spacers.spacer5);
292
+ padding-bottom: theme(digitv2.spacers.spacer0);
293
+
294
+ &.with-shadow {
295
+ padding-bottom: theme(digitv2.spacers.spacer5);
296
+ }
297
+ }
298
+
299
+ @media (max-width: 30rem) {
300
+ padding: theme(digitv2.spacers.spacer4);
301
+ padding-bottom: theme(digitv2.spacers.spacer0);
302
+
303
+ &.with-shadow {
304
+ padding-bottom: theme(digitv2.spacers.spacer4);
305
+ }
306
+ }
307
+ }
308
+
309
+ .popup-info-card {
310
+ margin: theme(digitv2.spacers.spacer0);
311
+ width: 100%;
312
+ max-width: 100%;
313
+ min-width: 100%;
314
+ }
315
+ }
316
+ }
317
+
318
+ .digit-popup-children-wrap::-webkit-scrollbar {
319
+ width: theme(digitv2.spacers.spacer2);
320
+ background-color: theme(digitv2.lightTheme.generic-background);
321
+ }
322
+
323
+ .digit-popup-children-wrap::-webkit-scrollbar-track {
324
+ background-color: theme(digitv2.lightTheme.generic-background);
325
+ border-radius: 0.563rem;
326
+ }
327
+
328
+ .digit-popup-children-wrap::-webkit-scrollbar-thumb {
329
+ background-color: theme(digitv2.lightTheme.generic-divider);
330
+ border-radius: 0.563rem;
331
331
  }