@djb25/digit-ui-css 1.0.9 → 1.0.11

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.
@@ -1,569 +1,541 @@
1
1
  @import url("../../index.scss");
2
2
 
3
- .bread-crumb.workbench-bredcrumb{
4
- a{
5
- color: theme(digitv2.lightTheme.primary);
6
- }
7
- }
8
- .workbench{
9
- .workbench-create-form {
10
- display: inherit;
11
- padding-top: 1.5rem;
12
- .digit-form-composer-sub-header {
13
- @extend .typography.text-heading-m;
14
- padding-left: 1rem;
15
- @media (max-width: theme(digitv2.screens.mobile)) {
16
- padding-left: 0;
17
- }
3
+ .bread-crumb.workbench-bredcrumb {
4
+ a {
5
+ color: theme(digitv2.lightTheme.primary);
18
6
  }
19
-
20
- form {
21
- #label_digit_root {
22
- display: none;
7
+ }
8
+ .workbench {
9
+ .workbench-create-form {
10
+ display: inherit;
11
+ padding-top: 1.5rem;
12
+ .digit-form-composer-sub-header {
13
+ @extend .typography.text-heading-m;
14
+ padding-left: 1rem;
15
+ @media (max-width: theme(digitv2.screens.mobile)) {
16
+ padding-left: 0;
17
+ }
23
18
  }
24
19
 
25
- #digit_root {
26
- width: 100%;
27
-
28
- .field-wrapper {
29
- .form-group.field {
30
- display: flex;
31
- padding: 1em 0 0 1em;
32
-
33
- @media (max-width: theme(digitv2.screens.mobile)) {
34
- flex-direction: column;
35
- }
36
-
37
- &.field-error.has-error.has-danger {
38
- .control-label {
39
- @extend .alert-error;
40
- }
41
-
42
- .form-control {
43
- @extend .alert-error-border;
44
- }
45
-
46
- .card-label-error {
47
- display: inline;
48
- position: relative;
49
- margin: 0px;
50
- padding: 0px;
51
- top: -0.7rem;
52
- font-weight: normal;
53
-
54
- }
55
- }
56
-
57
- &.field-boolean.field-error.has-error.has-danger {
58
-
59
- .card-label-error {
60
- position: initial;
61
- display: block;
62
- margin-top: 0.5rem;
63
-
64
- }
65
- }
66
-
67
- .control-label {
68
- max-width: 12.5rem;
69
- margin-right: 2.5rem;
70
- @extend .card-label;
71
- display: inline-flex;
72
- /* align-self: center; */
73
- line-height: 3rem;
74
- @extend .typography.text-heading-s;
75
- /* web view*/
76
- @apply w-1/3;
20
+ form {
21
+ #label_digit_root {
22
+ display: none;
23
+ }
77
24
 
78
- /* tablet view*/
25
+ #digit_root {
26
+ width: 100%;
79
27
 
80
- @media (max-width: theme(digitv2.screens.tablet)) {
81
- max-width: 11rem;
82
- margin-right: 1.5rem;
28
+ .field-wrapper {
29
+ .form-group.field {
30
+ display: flex;
31
+ padding: 1em 0 0 1em;
83
32
 
33
+ @media (max-width: theme(digitv2.screens.mobile)) {
34
+ flex-direction: column;
84
35
  }
85
36
 
86
- /* mobile view*/
37
+ &.field-error.has-error.has-danger {
38
+ .control-label {
39
+ @extend .alert-error;
40
+ }
87
41
 
88
- @media (max-width: theme(digitv2.screens.mobile)) {
89
- /*max-width: 10.2rem;*/
90
- @apply w-full;
42
+ .form-control {
43
+ @extend .alert-error-border;
44
+ }
91
45
 
46
+ .card-label-error {
47
+ display: inline;
48
+ position: relative;
49
+ margin: 0px;
50
+ padding: 0px;
51
+ top: -0.7rem;
52
+ font-weight: normal;
53
+ }
92
54
  }
93
55
 
94
- }
95
-
96
- .all-input-field-wrapper {
97
-
98
- @apply w-3/5;
99
- @media (max-width: theme(digitv2.screens.mobile)) {
100
- @apply w-full;
56
+ &.field-boolean.field-error.has-error.has-danger {
57
+ .card-label-error {
58
+ position: initial;
59
+ display: block;
60
+ margin-top: 0.5rem;
61
+ }
101
62
  }
102
63
 
103
- .form-control {
104
- @extend .light-input-border;
105
- @extend .employee-card-input;
106
- font-style: inherit;
107
- font-family: inherit;
64
+ .control-label {
65
+ max-width: 12.5rem;
66
+ margin-right: 2.5rem;
67
+ @extend .card-label;
68
+ display: inline-flex;
69
+ /* align-self: center; */
70
+ line-height: 3rem;
71
+ @extend .typography.text-heading-s;
108
72
  /* web view*/
109
- max-width: 37.5rem;
110
- min-width: 20.5rem;
111
- margin-bottom: 1rem;
73
+ @apply w-1/3;
74
+
112
75
  /* tablet view*/
113
76
 
114
77
  @media (max-width: theme(digitv2.screens.tablet)) {
115
- max-width: 27.5rem;
116
- min-width: 12.5rem;
117
-
78
+ max-width: 11rem;
79
+ margin-right: 1.5rem;
118
80
  }
119
81
 
120
82
  /* mobile view*/
121
83
 
122
84
  @media (max-width: theme(digitv2.screens.mobile)) {
123
- max-width: 20.5rem;
124
- min-width: 9.5rem;
85
+ /*max-width: 10.2rem;*/
125
86
  @apply w-full;
87
+ }
88
+ }
126
89
 
90
+ .all-input-field-wrapper {
91
+ @apply w-3/5;
92
+ @media (max-width: theme(digitv2.screens.mobile)) {
93
+ @apply w-full;
127
94
  }
128
95
 
129
- &.form-select {
130
- padding: 0%;
131
- border: 0px;
96
+ .form-control {
97
+ @extend .light-input-border;
98
+ @extend .employee-card-input;
99
+ font-style: inherit;
100
+ font-family: inherit;
101
+ /* web view*/
102
+ max-width: 37.5rem;
103
+ min-width: 20.5rem;
104
+ margin-bottom: 1rem;
105
+ /* tablet view*/
106
+
107
+ @media (max-width: theme(digitv2.screens.tablet)) {
108
+ max-width: 27.5rem;
109
+ min-width: 12.5rem;
110
+ }
132
111
 
133
- .digit__control {
134
- @apply outline-none;
112
+ /* mobile view*/
135
113
 
136
- .digit__value-container:in-range {
137
- border-color: unset;
138
- box-shadow: none;
139
- box-sizing: unset;
140
- @apply outline-none;
141
- }
114
+ @media (max-width: theme(digitv2.screens.mobile)) {
115
+ max-width: 20.5rem;
116
+ min-width: 9.5rem;
117
+ @apply w-full;
142
118
  }
143
119
 
144
- .digit__control--is-focused {
145
- border-color: theme(digitv2.lightTheme.primary) !important;
146
- box-shadow: none;
147
- box-sizing: unset;
148
- @apply outline-none;
149
- }
120
+ &.form-select {
121
+ padding: 0%;
122
+ border: 0px;
150
123
 
124
+ .digit__control {
125
+ @apply outline-none;
151
126
 
152
- .digit__control:hover {
127
+ .digit__value-container:in-range {
128
+ border-color: unset;
129
+ box-shadow: none;
130
+ box-sizing: unset;
131
+ @apply outline-none;
132
+ }
133
+ }
153
134
 
154
- border-color: unset;
155
- box-shadow: none;
156
- box-sizing: unset;
157
- @apply outline-none;
158
- }
135
+ .digit__control--is-focused {
136
+ border-color: theme(digitv2.lightTheme.primary) !important;
137
+ box-shadow: none;
138
+ box-sizing: unset;
139
+ @apply outline-none;
140
+ }
159
141
 
160
- .digit__control:focus {
161
- border-color: theme(digitv2.lightTheme.primary);
142
+ .digit__control:hover {
143
+ border-color: unset;
144
+ box-shadow: none;
145
+ box-sizing: unset;
146
+ @apply outline-none;
147
+ }
162
148
 
163
- .digit__value-container:focus {
149
+ .digit__control:focus {
164
150
  border-color: theme(digitv2.lightTheme.primary);
165
151
 
152
+ .digit__value-container:focus {
153
+ border-color: theme(digitv2.lightTheme.primary);
154
+ }
166
155
  }
167
156
  }
157
+
158
+ &.form-select:focus {
159
+ @apply outline-none;
160
+ border-color: theme(digitv2.lightTheme.primary);
161
+ }
168
162
  }
169
163
 
170
- &.form-select:focus {
164
+ .form-control:read-only {
165
+ background-color: theme(digitv2.lightTheme.background);
166
+ color: theme(digitv2.lightTheme[ "text-color-secondary" ]);
167
+ }
168
+
169
+ .form-control:focus {
171
170
  @apply outline-none;
172
171
  border-color: theme(digitv2.lightTheme.primary);
173
-
174
172
  }
175
- }
176
-
177
- .form-control:read-only {
178
- background-color: theme(digitv2.lightTheme.background);
179
- color: theme(digitv2.lightTheme["text-color-secondary"]);
180
- }
181
173
 
182
- .form-control:focus {
183
-
184
- @apply outline-none;
185
- border-color: theme(digitv2.lightTheme.primary);
174
+ textarea.form-control {
175
+ height: 5rem;
176
+ }
186
177
  }
187
178
 
188
- textarea.form-control {
189
- height: 5rem;
179
+ &.field-string {
180
+ align-self: center;
190
181
  }
191
- }
192
182
 
193
- &.field-string {
194
- align-self: center;
195
- }
183
+ &.field-boolean {
184
+ padding-top: 0rem;
185
+ padding-bottom: 1rem;
196
186
 
197
- &.field-boolean {
198
- padding-top: 0rem;
199
- padding-bottom: 1rem;
187
+ .custom-checkbox {
188
+ display: inline-flex;
189
+ align-items: flex-end;
200
190
 
201
- .custom-checkbox {
202
- display: inline-flex;
203
- align-items: end;
204
-
205
- &.custom-checkbox-disabled {
206
- pointer-events: none;
207
- opacity: 0.6;
208
- }
191
+ &.custom-checkbox-disabled {
192
+ pointer-events: none;
193
+ opacity: 0.6;
194
+ }
209
195
 
210
- .custom-checkbox-label {
211
- @extend .typography.text-body-s;
212
- @apply pl-sm;
196
+ .custom-checkbox-label {
197
+ @extend .typography.text-body-s;
198
+ @apply pl-sm;
199
+ }
213
200
  }
214
- }
215
201
 
216
- .checkbox {
217
- width: 28rem;
202
+ .checkbox {
203
+ width: 28rem;
218
204
 
219
- label {
220
- float: left;
205
+ label {
206
+ float: left;
221
207
 
222
- /* display: flex;
208
+ /* display: flex;
223
209
  flex-direction: row-reverse;
224
210
  */
225
- span {
226
- width: 17rem;
227
- display: none;
228
- @extend .card-label;
229
- }
211
+ span {
212
+ width: 17rem;
213
+ display: none;
214
+ @extend .card-label;
215
+ }
230
216
 
231
- input[type="checkbox"] {
232
- @extend .light-input-border;
233
- @extend .employee-card-input;
234
- height: 1.5rem;
235
- /* @apply ml-sm;*/
236
- }
237
-
238
- input[type="checkbox"]#digit_root_active {
239
- accent-color: theme(digitv2.lightTheme.primary);
240
- }
217
+ input[type="checkbox"] {
218
+ @extend .light-input-border;
219
+ @extend .employee-card-input;
220
+ height: 1.5rem;
221
+ /* @apply ml-sm;*/
222
+ }
223
+
224
+ input[type="checkbox"]#digit_root_active {
225
+ accent-color: theme(digitv2.lightTheme.primary);
226
+ }
241
227
 
242
- input:checked,
243
- input:hover {
244
- @apply border-2;
245
- @extend .light-input-border;
228
+ input:checked,
229
+ input:hover {
230
+ @apply border-2;
231
+ @extend .light-input-border;
232
+ }
246
233
  }
247
234
  }
248
- }
249
235
 
250
- .field-radio-group {
251
- display: inline-flex;
252
- height: 2.5rem;
253
- align-items: center;
236
+ .field-radio-group {
237
+ display: inline-flex;
238
+ height: 2.5rem;
239
+ align-items: center;
254
240
 
255
- .radio {
256
- @apply mr-sm;
241
+ .radio {
242
+ @apply mr-sm;
243
+ }
257
244
  }
258
245
  }
259
246
 
247
+ &.field-object > .control-label {
248
+ margin-left: 0.5rem;
249
+ }
260
250
 
251
+ &.field-object {
252
+ display: block;
253
+ @extend .light-background;
254
+ @extend .light-paper-border;
255
+ padding: 1rem;
256
+ margin: 1rem;
261
257
 
262
- }
263
-
264
-
265
-
266
- &.field-object>.control-label {
267
- margin-left: 0.5rem;
268
- }
269
-
270
- &.field-object {
271
- display: block;
272
- @extend .light-background;
273
- @extend .light-paper-border;
274
- padding: 1rem;
275
- margin: 1rem;
276
-
277
- .digit-expand-collapse-wrapper {
278
- margin-top: 0px;
279
- }
258
+ .digit-expand-collapse-wrapper {
259
+ margin-top: 0px;
260
+ }
280
261
 
281
- .digit-icon-toggle {
282
- top: -1.5rem;
283
- right: 1.5em;
284
- }
262
+ .digit-icon-toggle {
263
+ top: -1.5rem;
264
+ right: 1.5em;
265
+ }
285
266
 
286
- .object-wrapper {
287
- .array-remove-button-wrapper {
288
- position: relative;
267
+ .object-wrapper {
268
+ .array-remove-button-wrapper {
269
+ position: relative;
270
+ }
289
271
  }
290
- }
291
272
 
292
- /* have to revisit for objects
273
+ /* have to revisit for objects
293
274
  [id^="root_"] {
294
275
  @extend .light-background;
295
276
  }
296
277
  */
297
- }
298
-
299
- &.field-array {
300
- display: block;
301
- @extend .light-paper-secondary;
302
- @extend .light-paper-border;
303
- padding: 2rem;
304
- margin: 1rem;
305
- padding-top: 1rem;
306
-
307
- .array-wrapper .array-item {
308
- &.jk-array-objects>.array-remove-button-wrapper {
309
- display: block;
310
- }
311
-
312
- &.jk-array-objects {
313
- margin-bottom: 2rem;
278
+ }
314
279
 
315
- .array-children>span .form-group.field.field-object {
316
- padding-bottom: 3rem;
280
+ &.field-array {
281
+ display: block;
282
+ @extend .light-paper-secondary;
283
+ @extend .light-paper-border;
284
+ padding: 2rem;
285
+ margin: 1rem;
286
+ padding-top: 1rem;
287
+
288
+ .array-wrapper .array-item {
289
+ &.jk-array-objects > .array-remove-button-wrapper {
290
+ display: block;
317
291
  }
318
292
 
319
- .array-obj {
320
- position: absolute;
321
- bottom: 1.5rem;
322
- left: 2rem;
293
+ &.jk-array-objects {
294
+ margin-bottom: 2rem;
323
295
 
324
- >.array-remove-button-wrapper {
325
- position: unset;
296
+ .array-children > span .form-group.field.field-object {
297
+ padding-bottom: 3rem;
326
298
  }
327
- }
328
-
329
- }
330
-
331
- &.jk-array-of-non-objects>.array-remove-button-wrapper {
332
- display: inline;
333
- left: 38.5rem;
334
- right: unset;
335
- top: 0.7rem;
336
- }
337
299
 
338
- &.jk-array-of-non-objects .array-children {
339
- span .form-group {
340
- padding-left: 0%;
300
+ .array-obj {
301
+ position: absolute;
302
+ bottom: 1.5rem;
303
+ left: 2rem;
341
304
 
342
- .control-label {
343
- display: none;
305
+ > .array-remove-button-wrapper {
306
+ position: unset;
307
+ }
344
308
  }
309
+ }
345
310
 
311
+ &.jk-array-of-non-objects > .array-remove-button-wrapper {
312
+ display: inline;
313
+ left: 38.5rem;
314
+ right: unset;
315
+ top: 0.7rem;
346
316
  }
347
- }
348
317
 
349
- /* it has been removed since we dont need diff color for array items @extend .light-background;*/
350
- position: relative;
318
+ &.jk-array-of-non-objects .array-children {
319
+ span .form-group {
320
+ padding-left: 0%;
351
321
 
352
- .field-object {
353
- margin-left: 0;
354
- margin-right: 0;
355
- }
322
+ .control-label {
323
+ display: none;
324
+ }
325
+ }
326
+ }
356
327
 
328
+ /* it has been removed since we dont need diff color for array items @extend .light-background;*/
329
+ position: relative;
357
330
 
358
- .array-remove-button-wrapper {
359
- position: absolute;
360
- right: 1.3em;
361
- top: 1.3em;
362
- background-color: inherit !important;
331
+ .field-object {
332
+ margin-left: 0;
333
+ margin-right: 0;
334
+ }
363
335
 
364
- .array-remove-button {
365
- cursor: pointer;
336
+ .array-remove-button-wrapper {
337
+ position: absolute;
338
+ right: 1.3em;
339
+ top: 1.3em;
366
340
  background-color: inherit !important;
367
- @media (max-width: theme(digitv2.screens.mobile)) {
368
- padding:0px;
369
- }
370
- h2{
341
+
342
+ .array-remove-button {
343
+ cursor: pointer;
344
+ background-color: inherit !important;
371
345
  @media (max-width: theme(digitv2.screens.mobile)) {
346
+ padding: 0px;
347
+ }
348
+ h2 {
349
+ @media (max-width: theme(digitv2.screens.mobile)) {
372
350
  display: none;
351
+ }
373
352
  }
374
353
  }
375
-
376
354
  }
377
- }
378
355
 
379
- span.all-input-field-wrapper {
380
- @apply w-3/5;
356
+ span.all-input-field-wrapper {
357
+ @apply w-3/5;
381
358
 
382
- .form-control {
383
- @apply w-full;
359
+ .form-control {
360
+ @apply w-full;
361
+ }
384
362
  }
385
- }
386
-
387
- .control-label {
388
- @apply w-1/3;
389
363
 
364
+ .control-label {
365
+ @apply w-1/3;
366
+ }
390
367
  }
391
- }
392
368
 
369
+ .jk-digit-secondary-btn {
370
+ height: 1.7em;
371
+ margin-top: 0.5rem;
393
372
 
394
- .jk-digit-secondary-btn {
395
- height: 1.7em;
396
- margin-top: 0.5rem;
373
+ @media (max-width: theme(digitv2.screens.mobile)) {
374
+ height: auto;
375
+ width: 100%;
376
+ }
397
377
 
398
- @media (max-width: theme(digitv2.screens.mobile)) {
399
- height: auto;
400
- width: 100%;
378
+ h2 {
379
+ font-size: 1rem;
380
+ }
401
381
  }
402
382
 
403
- h2 {
404
- font-size: 1rem;
383
+ .all-input-field-wrapper {
384
+ .card-label-error {
385
+ position: unset !important;
386
+ }
405
387
  }
406
388
  }
407
389
 
408
- .all-input-field-wrapper {
409
- .card-label-error {
410
- position: unset !important;
411
- }
390
+ .digit-expand-collapse-header {
391
+ border: 0;
392
+ background-color: inherit;
393
+ padding: 0;
412
394
  }
413
-
414
- }
415
-
416
- .digit-expand-collapse-header {
417
- border: 0;
418
- background-color: inherit;
419
- padding: 0;
420
395
  }
421
396
  }
422
397
  }
423
398
  }
424
- }
425
399
 
426
- div.action-bar-wrap {
427
- @extend .action-bar-wrap;
400
+ div.action-bar-wrap {
401
+ @extend .action-bar-wrap;
428
402
 
429
- .submit-bar {
430
- @extend .submit-bar;
431
- cursor: pointer;
432
- @apply font-rc font-medium text-legend text-white leading-10;
403
+ .submit-bar {
404
+ @extend .submit-bar;
405
+ cursor: pointer;
406
+ @apply font-rc font-medium text-legend text-white leading-10;
407
+ }
433
408
  }
434
409
  }
435
- }
436
410
 
437
- .workbench-no-schema-found {
438
- @apply flex justify-items-center flex-col;
439
- align-items: center;
440
- }
441
-
442
- .jk-digit-loader {
443
- position: absolute;
444
- z-index: 10000;
445
- width: 100vw;
446
- background-color: rgba(189, 189, 189, 0.5);
447
- height: 100vh;
448
- left: 0;
449
- top: 0;
450
-
451
- .jk-spinner-wrapper {
452
- width: 100%;
453
- display: flex;
411
+ .workbench-no-schema-found {
412
+ @apply flex justify-items-center flex-col;
454
413
  align-items: center;
455
- justify-content: center;
456
- height: 100%;
414
+ }
457
415
 
458
- .jk-spinner {
459
- border: 0.4em solid #fe7a51;
460
- border-radius: 50%;
461
- border-top: 0.4em solid #ffffff;
462
- width: 4em;
463
- height: 4em;
464
- -webkit-animation: spin 2s linear infinite;
465
- /* Safari */
466
- animation: spin 1s linear infinite;
416
+ .jk-digit-loader {
417
+ position: absolute;
418
+ z-index: 10000;
419
+ width: 100vw;
420
+ background-color: rgba(189, 189, 189, 0.5);
421
+ height: 100vh;
422
+ left: 0;
423
+ top: 0;
424
+
425
+ .jk-spinner-wrapper {
426
+ width: 100%;
427
+ display: flex;
428
+ align-items: center;
429
+ justify-content: center;
430
+ height: 100%;
431
+
432
+ .jk-spinner {
433
+ border: 0.4em solid #fe7a51;
434
+ border-radius: 50%;
435
+ border-top: 0.4em solid #ffffff;
436
+ width: 4em;
437
+ height: 4em;
438
+ -webkit-animation: spin 2s linear infinite;
439
+ /* Safari */
440
+ animation: spin 1s linear infinite;
441
+ }
467
442
  }
468
443
  }
469
- }
470
444
 
471
- .jk-sm-inbox-loader {
472
- border: 0.2em solid #fe7a51;
473
- border-radius: 50%;
474
- border-top: 0.2em solid #ffffff;
475
- width: 2em;
476
- height: 2em;
477
- -webkit-animation: spin 2s linear infinite;
478
- /* Safari */
479
- animation: spin 1s linear infinite;
480
- }
481
-
482
- /* Safari */
483
- @-webkit-keyframes spin {
484
- 0% {
485
- -webkit-transform: rotate(0deg);
445
+ .jk-sm-inbox-loader {
446
+ border: 0.2em solid #fe7a51;
447
+ border-radius: 50%;
448
+ border-top: 0.2em solid #ffffff;
449
+ width: 2em;
450
+ height: 2em;
451
+ -webkit-animation: spin 2s linear infinite;
452
+ /* Safari */
453
+ animation: spin 1s linear infinite;
486
454
  }
487
455
 
488
- 100% {
489
- -webkit-transform: rotate(360deg);
490
- }
491
- }
492
-
493
- @keyframes spin {
494
- 0% {
495
- transform: rotate(0deg);
496
- }
456
+ /* Safari */
457
+ @-webkit-keyframes spin {
458
+ 0% {
459
+ -webkit-transform: rotate(0deg);
460
+ }
497
461
 
498
- 100% {
499
- transform: rotate(360deg);
462
+ 100% {
463
+ -webkit-transform: rotate(360deg);
464
+ }
500
465
  }
501
- }
502
466
 
503
- .no-data-found {
504
- height: 100%;
505
- width: 100%;
506
- display: flex;
507
- flex-direction: column;
508
- justify-content: center;
509
- align-items: center;
467
+ @keyframes spin {
468
+ 0% {
469
+ transform: rotate(0deg);
470
+ }
510
471
 
511
- .digit-error-msg {
512
- margin-top: 2rem;
472
+ 100% {
473
+ transform: rotate(360deg);
474
+ }
513
475
  }
514
- }
515
476
 
477
+ .no-data-found {
478
+ height: 100%;
479
+ width: 100%;
480
+ display: flex;
481
+ flex-direction: column;
482
+ justify-content: center;
483
+ align-items: center;
516
484
 
517
- .tooltip .tooltiptext {
485
+ .digit-error-msg {
486
+ margin-top: 2rem;
487
+ }
488
+ }
518
489
 
519
- top: 2rem;
520
- left: 0;
521
- margin-left: 0rem;
522
- width: fit-content;
523
- height: max-content;
524
- white-space: normal;
525
-
526
- .tooltiptextvalue {
527
- font-size: 14px;
528
- font-weight: 400px;
529
- color: white;
490
+ .tooltip .tooltiptext {
491
+ top: 2rem;
492
+ left: 0;
493
+ margin-left: 0rem;
494
+ width: fit-content;
495
+ height: max-content;
496
+ white-space: normal;
497
+
498
+ .tooltiptextvalue {
499
+ font-size: 14px;
500
+ font-weight: 400px;
501
+ color: white;
502
+ }
530
503
  }
531
- }
532
- .employeeCard.manage-master-wrapper {
533
- width: 100%;
534
- display: flex;
535
- padding-top: 2.1rem;
536
- @media (max-width: theme(digitv2.screens.mobile)) {
537
- flex-direction: column;
538
- }
539
- .employee-select-wrap.form-field{
540
- @apply w-1/4;
541
- margin-right:1rem ;
542
- @media (max-width: theme(digitv2.screens.mobile)) {
543
- @apply w-full;
544
- }
504
+ .employeeCard.manage-master-wrapper {
505
+ width: 100%;
506
+ display: flex;
507
+ padding-top: 2.1rem;
508
+ @media (max-width: theme(digitv2.screens.mobile)) {
509
+ flex-direction: column;
510
+ }
511
+ .employee-select-wrap.form-field {
512
+ @apply w-1/4;
513
+ margin-right: 1rem;
514
+ @media (max-width: theme(digitv2.screens.mobile)) {
515
+ @apply w-full;
516
+ }
517
+ }
545
518
  }
546
- }
547
519
 
548
- .table{
549
- padding-left:0.8rem ;
550
- padding-right:0.8rem ;
551
- &-row-mdms:hover{
552
- background-color: theme(digitv2.lightTheme.primary-bg); /* Change this to the desired hover color */
553
- cursor: pointer;
520
+ .table {
521
+ padding-left: 0.8rem;
522
+ padding-right: 0.8rem;
523
+ &-row-mdms:hover {
524
+ background-color: theme(digitv2.lightTheme.primary-bg); /* Change this to the desired hover color */
525
+ cursor: pointer;
526
+ }
554
527
  }
555
528
  }
556
- }
557
529
 
558
- .header-btn{
530
+ .header-btn {
559
531
  width: 12rem;
560
532
  }
561
533
 
562
534
  .drag-drop-container {
563
- background-color: #FAFAFA;
564
- border: 1.5px dashed #D6D5D4;
535
+ background-color: #fafafa;
536
+ border: 1.5px dashed #d6d5d4;
565
537
  border-radius: 5px;
566
- margin:-1rem 1rem 1rem 1rem;
538
+ margin: -1rem 1rem 1rem 1rem;
567
539
  padding: 1rem 1rem 1rem 1rem;
568
540
  display: flex;
569
541
  align-items: center;
@@ -573,23 +545,22 @@ a{
573
545
  text-decoration: none;
574
546
  .browse-text {
575
547
  text-decoration: none;
576
- color: #F47738;
548
+ color: #f47738;
577
549
  transition: color 0.3s;
578
550
  }
579
551
  .browse-text:hover {
580
- color: #F47738;
581
- text-decoration: underline;
582
- cursor: pointer;
552
+ color: #f47738;
553
+ text-decoration: underline;
554
+ cursor: pointer;
583
555
  }
584
556
  }
585
-
586
557
  }
587
558
 
588
559
  .uploaded-file-container {
589
- background-color: #FAFAFA;
590
- border: 1.5px solid #D6D5D4;
560
+ background-color: #fafafa;
561
+ border: 1.5px solid #d6d5d4;
591
562
  border-radius: 5px;
592
- margin:0.5rem 1rem 2rem 1rem;
563
+ margin: 0.5rem 1rem 2rem 1rem;
593
564
  display: flex;
594
565
  flex-direction: row;
595
566
  align-items: center;
@@ -599,7 +570,7 @@ a{
599
570
  .uploaded-file-container-sub {
600
571
  display: flex;
601
572
  align-items: center;
602
-
573
+
603
574
  .icon:hover {
604
575
  cursor: pointer;
605
576
  }
@@ -614,14 +585,13 @@ button:hover {
614
585
  margin-top: -0.5rem !important;
615
586
  }
616
587
 
617
-
618
588
  .option-details {
619
589
  position: fixed;
620
590
  top: 50%;
621
591
  left: 50%;
622
592
  transform: translate(-50%, -50%);
623
593
  z-index: 999;
624
- border: 1px solid #D6D5D4;
594
+ border: 1px solid #d6d5d4;
625
595
  /* Border color and width */
626
596
  background-color: #fff;
627
597
  padding: 2em;
@@ -631,7 +601,6 @@ button:hover {
631
601
  width: 40%;
632
602
  min-width: 300px;
633
603
 
634
-
635
604
  .detail-container {
636
605
  margin-top: 20px;
637
606
  overflow-y: auto;
@@ -649,44 +618,32 @@ button:hover {
649
618
  text-align: start !important;
650
619
  }
651
620
 
652
-
653
-
654
621
  .value {
655
622
  flex-basis: 70%;
656
623
  text-align: start !important;
657
624
  }
658
-
659
625
  }
660
626
 
661
-
662
-
663
627
  .separator {
664
628
  margin: 10px 0;
665
629
  border: none;
666
630
  border-bottom: 1px solid #ccc;
667
631
  }
668
632
 
669
-
670
-
671
633
  .view-more {
672
634
  display: flex;
673
635
  justify-content: flex-start;
674
636
  margin-top: 1.5em;
675
637
  }
676
638
 
677
-
678
-
679
639
  .select {
680
640
  display: flex;
681
641
  justify-content: flex-start;
682
642
  margin-top: 1.5em;
683
643
  }
684
-
685
644
  }
686
-
687
645
  }
688
646
 
689
-
690
647
  .close-button {
691
648
  align-self: flex-end;
692
649
  cursor: pointer;
@@ -699,16 +656,10 @@ button:hover {
699
656
  margin-bottom: 20px;
700
657
  }
701
658
 
702
-
703
-
704
-
705
-
706
-
707
-
708
659
  .option-details-dropdown {
709
660
  position: absolute;
710
661
  z-index: 999;
711
- border: #D6D5D4 1px solid;
662
+ border: #d6d5d4 1px solid;
712
663
  background-color: #fff;
713
664
  padding: 10px;
714
665
  border-radius: 5px;
@@ -716,7 +667,6 @@ button:hover {
716
667
  margin-left: -250px;
717
668
  }
718
669
 
719
-
720
670
  .modal-wrapper {
721
671
  position: fixed;
722
672
  top: 0;
@@ -732,7 +682,6 @@ button:hover {
732
682
  /* Enable scrolling if content exceeds the viewport */
733
683
  }
734
684
 
735
-
736
685
  .modal-content {
737
686
  background-color: #fff;
738
687
  padding: 20px;
@@ -765,8 +714,6 @@ button:hover {
765
714
  padding-left: 8px;
766
715
  }
767
716
 
768
-
769
-
770
717
  .modal-content .employee-select-wrap .select-active {
771
718
  position: absolute;
772
719
  display: block;
@@ -777,8 +724,6 @@ button:hover {
777
724
  border-color: rgba(244, 119, 56, var(--border-opacity));
778
725
  }
779
726
 
780
-
781
-
782
727
  .modal-content .label-field-pair {
783
728
  display: -ms-flexbox;
784
729
  display: block !important;
@@ -786,7 +731,6 @@ button:hover {
786
731
  align-items: center;
787
732
  }
788
733
 
789
-
790
734
  .modal-content .employee-select-wrap {
791
735
  margin-bottom: 24px;
792
736
  }
@@ -798,7 +742,7 @@ button:hover {
798
742
  flex-direction: row-reverse;
799
743
  .add-new {
800
744
  position: relative;
801
- color: #F47738;
745
+ color: #f47738;
802
746
  cursor: pointer;
803
747
  margin-right: 1em;
804
748
  font-weight: bolder;
@@ -807,8 +751,6 @@ button:hover {
807
751
  }
808
752
  }
809
753
 
810
-
811
-
812
754
  .multiselect {
813
755
  display: flex;
814
756
  align-items: center;
@@ -825,8 +767,6 @@ button:hover {
825
767
  }
826
768
  }
827
769
 
828
-
829
-
830
770
  .info-icon-container {
831
771
  margin-left: 0.7em;
832
772
  margin-right: -2em;
@@ -835,16 +775,11 @@ button:hover {
835
775
  margin-bottom: 0.7em;
836
776
  }
837
777
 
838
-
839
-
840
778
  .info-icon-container .info-icon {
841
779
  cursor: pointer;
842
780
  }
843
-
844
781
  }
845
782
 
846
-
847
-
848
783
  .link-container {
849
784
  flex: 1;
850
785
  display: flex;
@@ -852,8 +787,6 @@ button:hover {
852
787
  padding: 10px;
853
788
  background-color: #bdc5d1;
854
789
 
855
-
856
-
857
790
  .view-all-link {
858
791
  background-color: #bdc5d1;
859
792
  color: #f47738;
@@ -861,24 +794,18 @@ button:hover {
861
794
  text-decoration: underline;
862
795
  cursor: pointer;
863
796
  }
864
-
865
797
  }
866
798
 
867
-
868
-
869
799
  .action-bar {
870
800
  display: flex;
871
801
  flex-direction: row;
872
802
  justify-content: flex-end;
873
803
 
874
-
875
804
  .action-bar-button {
876
805
  margin-right: 0.5em;
877
806
  }
878
807
  }
879
808
 
880
-
881
-
882
809
  .progressBarContainer {
883
810
  position: fixed;
884
811
  bottom: 20px;
@@ -890,7 +817,6 @@ button:hover {
890
817
  z-index: 9999;
891
818
  width: 25vw;
892
819
 
893
-
894
820
  @media (max-width: 768px) {
895
821
  width: 70vw;
896
822
  position: fixed;
@@ -900,8 +826,6 @@ button:hover {
900
826
  transform: translateX(-50%);
901
827
  }
902
828
 
903
-
904
-
905
829
  .progressBar {
906
830
  display: flex;
907
831
  flex-direction: row;
@@ -909,43 +833,33 @@ button:hover {
909
833
  overflow: hidden;
910
834
  border: 1px solid #ccc;
911
835
  height: 20px;
912
- background-color: #4CAF50;
836
+ background-color: #4caf50;
913
837
  }
914
838
 
915
-
916
-
917
839
  .progressHeading {
918
840
  margin: 8px 0;
919
841
  font-size: 16px;
920
842
 
921
-
922
-
923
843
  .success-container {
924
844
  display: flex;
925
845
  flex-direction: row;
926
- background-color: #00703C;
846
+ background-color: #00703c;
927
847
  color: #fff;
928
848
  padding: 5px 10px;
929
849
  border-radius: 5px;
930
850
  width: fit-content;
931
851
  align-items: center;
932
852
 
933
-
934
-
935
853
  .success-count {
936
854
  background-color: #fff;
937
- color: #00703C;
855
+ color: #00703c;
938
856
  padding: 3px 5px;
939
857
  border-radius: 3px;
940
858
  margin-left: 5px;
941
859
  }
942
-
943
860
  }
944
-
945
861
  }
946
862
 
947
-
948
-
949
863
  .closeButton {
950
864
  position: absolute;
951
865
  top: 10px;
@@ -956,16 +870,11 @@ button:hover {
956
870
  border-radius: 1px;
957
871
  }
958
872
 
959
-
960
-
961
873
  .no-uploads {
962
874
  margin-top: 1em;
963
875
  }
964
-
965
876
  }
966
877
 
967
-
968
-
969
878
  .results-container-orange {
970
879
  max-height: 50vh;
971
880
  overflow: auto;
@@ -975,16 +884,11 @@ button:hover {
975
884
  padding: 1em;
976
885
  background-color: #ea8a3b !important;
977
886
 
978
-
979
-
980
887
  .no-errors {
981
888
  background-color: #ea8a3b !important;
982
889
  }
983
-
984
890
  }
985
891
 
986
-
987
-
988
892
  .results-container {
989
893
  max-height: 50vh;
990
894
  overflow: auto;
@@ -993,24 +897,18 @@ button:hover {
993
897
  border-radius: 4px;
994
898
  padding: 1em;
995
899
 
996
-
997
-
998
900
  .results-list-item {
999
901
  border-bottom: 1px solid #ddd;
1000
902
  padding: 0.5em;
1001
903
  cursor: pointer;
1002
904
 
1003
-
1004
905
  &:hover {
1005
- background-color: #D4351C;
906
+ background-color: #d4351c;
1006
907
  color: white;
1007
908
  /* Yellowish color on hover */
1008
909
  }
1009
-
1010
910
  }
1011
911
 
1012
-
1013
-
1014
912
  .results-details {
1015
913
  white-space: pre-wrap;
1016
914
  border: 1px solid #ccc;
@@ -1019,8 +917,6 @@ button:hover {
1019
917
  }
1020
918
  }
1021
919
 
1022
-
1023
-
1024
920
  .overlay {
1025
921
  position: fixed;
1026
922
  top: 0;
@@ -1038,5 +934,4 @@ button:hover {
1038
934
  position: relative;
1039
935
  right: auto;
1040
936
  border: none;
1041
-
1042
- }
937
+ }