sccoreui 4.2.3 → 4.2.5

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 (2) hide show
  1. package/dist/App.scss +20 -477
  2. package/package.json +1 -1
package/dist/App.scss CHANGED
@@ -4,31 +4,6 @@
4
4
  @import url("./assets/flex.css");
5
5
  @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
6
6
 
7
- @font-face {
8
- font-family: 'RobotoBold';
9
- src: url('../src//assets//fonts/Roboto-Bold.ttf') format('truetype');
10
- font-weight: 700;
11
- font-style: italic;
12
- }
13
- @font-face {
14
- font-family: 'RobotoMedium';
15
- src: url('../src//assets//fonts/Roboto-Medium.ttf') format('truetype');
16
- font-weight: normal;
17
- font-style: normal;
18
- }
19
- @font-face {
20
- font-family: 'RobotoItalic';
21
- src: url('../src//assets//fonts/Roboto-Italic.ttf') format('truetype');
22
- font-weight: normal;
23
- font-style: normal;
24
- }
25
- @font-face {
26
- font-family: 'RobotoRegular';
27
- src: url('../src//assets//fonts/Roboto-Regular.ttf') format('truetype');
28
- font-weight: normal;
29
- font-style: normal;
30
- }
31
-
32
7
  :root {
33
8
  --fw-600: 600;
34
9
  --fw-400: 400;
@@ -41,47 +16,49 @@
41
16
  --border-none: border-none;
42
17
  }
43
18
 
44
-
45
-
46
19
  // @font-face {
47
20
  // font-family: "Lato";
21
+ // src: url("./assets/fonts/Lato-Regular.ttf") format("truetype");
48
22
  // }
49
23
 
50
24
  // @font-face {
51
- // font-family: "Lato";
25
+ // font-family: "Lato-600";
52
26
  // font-weight: 600;
53
27
  // src: url("./assets/fonts/Lato-Regular.ttf") format("truetype");
54
28
  // }
55
29
 
30
+ // * {
31
+ // padding: 0;
32
+ // margin: 0;
33
+ // }
56
34
 
57
35
  body {
58
36
  font-family: 'Lato', sans-serif;
59
37
  -webkit-font-smoothing: antialiased;
60
38
  -moz-osx-font-smoothing: grayscale;
61
- line-height: 20px;
39
+ line-height: var(--lh);
62
40
  padding: 0;
63
41
  margin: 0;
64
- color: var(--gray-700);
65
42
  }
66
43
 
67
44
  code {
68
45
  font-family: 'Lato', sans-serif;
69
46
  }
70
47
 
71
- // h1 {
72
- // font-size: var(--fs-24);
73
- // font-weight: var(--fw-600);
74
- // }
48
+ h1 {
49
+ font-size: var(--fs-24);
50
+ font-weight: var(--fw-600);
51
+ }
75
52
 
76
- // h2 {
77
- // font-size: var(--fs-18);
78
- // font-weight: var(--fw-600);
79
- // }
53
+ h2 {
54
+ font-size: var(--fs-18);
55
+ font-weight: var(--fw-600);
56
+ }
80
57
 
81
- // h3 {
82
- // font-size: var(--fs-16);
83
- // font-weight: var(--fw-400);
84
- // }
58
+ h3 {
59
+ font-size: var(--fs-16);
60
+ font-weight: var(--fw-400);
61
+ }
85
62
 
86
63
  // ============= custom progress steps =============== //
87
64
 
@@ -128,7 +105,7 @@ code {
128
105
 
129
106
  .progress-step-item {
130
107
  &.horizontal {
131
-
108
+ // transform: translateX(10%);
132
109
 
133
110
  &:nth-of-type(1) {
134
111
  transform: translateX(-50%);
@@ -150,438 +127,4 @@ code {
150
127
  transform: translateY(100%);
151
128
  }
152
129
  }
153
- }
154
-
155
- // CUSTOM multiselect style started
156
- .Multi_select_dropdown_panel {
157
- .p-multiselect-header {
158
- display: block;
159
- padding: 8px 0;
160
-
161
- .p-checkbox,
162
- .p-multiselect-close {
163
- display: none;
164
- }
165
-
166
- .p-multiselect-filter-container {
167
- .p-inputtext {
168
- padding-right: 12px;
169
- padding-left: 1.75rem;
170
- }
171
-
172
- .p-multiselect-filter-icon {
173
- left: 0.55rem;
174
- }
175
- }
176
- }
177
-
178
- .p-multiselect-items-wrapper {
179
- .p-multiselect-item.p-highlight {
180
- &::after {
181
- content: "";
182
- width: 14px;
183
- height: 6px;
184
- border-left: 2px solid #132067;
185
- border-bottom: 2px solid #132067;
186
- transform: rotate(-45deg);
187
- position: absolute;
188
- right: 10px;
189
- }
190
- }
191
- }
192
- }
193
-
194
- .sc_custom_multiselect {
195
-
196
- width: max-content;
197
-
198
- * {
199
- color: #344054;
200
- font-weight: 700;
201
- }
202
-
203
- .left_section_item {
204
- left: 1rem;
205
- }
206
-
207
- .right_section_item {
208
- right: 1rem;
209
- }
210
-
211
- .selected_moreThan_one {
212
- right: 40px;
213
- }
214
-
215
- .p-inputwrapper-filled {
216
- background: #F5F6FD;
217
- border: 1px solid #8190E8;
218
- }
219
-
220
- .p-multiselect {
221
- max-width: 100%;
222
- width: max-content !important;
223
-
224
- .p-multiselect-label {
225
- padding: 0;
226
- padding-left: 44px;
227
- max-width: 100%;
228
-
229
- .p-multiselect-token {
230
- border: none;
231
- width: 100%;
232
- min-width: 100%;
233
- background: none;
234
- padding-left: 0;
235
-
236
- .p-multiselect-token-label {
237
- width: 100%;
238
- white-space: nowrap;
239
- overflow: hidden;
240
- text-overflow: ellipsis;
241
- }
242
- }
243
-
244
- svg {
245
- display: none;
246
- }
247
- }
248
- }
249
-
250
-
251
-
252
- .p-multiselect-trigger {
253
- width: 2rem;
254
-
255
- svg {
256
- display: none;
257
- }
258
- }
259
- }
260
-
261
- .no_icon {
262
-
263
- .p-multiselect-label {
264
- padding-left: 16px !important;
265
- }
266
- }
267
-
268
- .status_dropdown {
269
- .p-multiselect {
270
- .p-multiselect-label {
271
- padding-left: 34px;
272
- }
273
- }
274
-
275
- .select_status_prv {
276
- ul {
277
- li {
278
- width: 10px;
279
- height: 10px;
280
- border-radius: 8px;
281
- position: absolute;
282
- transform: translateY(-50%);
283
- }
284
-
285
- li.all {
286
- background: #667085;
287
- }
288
-
289
-
290
- li:nth-child(2) {
291
- left: 6px;
292
- }
293
-
294
- li:nth-child(3) {
295
- left: 12px;
296
- }
297
-
298
- }
299
- }
300
- }
301
-
302
- .selected_multile {
303
- .p-multiselect-token-label {
304
- padding-right: 18px;
305
- }
306
- }
307
-
308
- .selected_multile.selected_num_2 {
309
- .p-multiselect .p-multiselect-label {
310
- padding-left: 44px;
311
- }
312
- }
313
-
314
- .selected_multile.selected_num_3 , .selected_multile.moreThanThreeItems {
315
- .p-multiselect .p-multiselect-label {
316
- padding-left: 44px;
317
- }
318
- }
319
-
320
-
321
-
322
- .status_dropdown.selected_multile {
323
- .left_section_item {
324
- max-width: 28px;
325
- overflow: hidden;
326
- height: 11px;
327
- width: -webkit-fill-available;
328
- align-items: center;
329
- display: flex;
330
- }
331
- }
332
-
333
-
334
- .status_dropdown_item.Active::before {
335
- background: #12B76A;
336
- }
337
-
338
- .status_dropdown_item.Inactive::before {
339
- background: #F04438;
340
- }
341
-
342
- .status_dropdown_item.Draft::before {
343
- background: #162578;
344
- }
345
-
346
- .status_dropdown_item {
347
- .status_dot {
348
- width: 10px;
349
- height: 10px;
350
- border-radius: 50px;
351
- position: absolute;
352
- transform: translateY(-50%);
353
- top: 50%;
354
- left: 10px;
355
- }
356
- }
357
-
358
-
359
- .custom_date_picker_sec {
360
- .custom_date_picker {
361
-
362
-
363
- .p-inputtext {
364
- padding-right: 16px;
365
- width: 130px;
366
- }
367
-
368
- .p-inputtext {
369
- &:enabled {
370
- &:focus {
371
- box-shadow: none !important;
372
- border-color: #d0d5dd !important;
373
- }
374
- }
375
- }
376
-
377
- .p-datepicker-trigger {
378
- &:focus {
379
- box-shadow: none !important;
380
- border-color: #d0d5dd !important;
381
- }
382
- }
383
- }
384
-
385
- .custom_date_picker.multiple {
386
- .p-inputtext {
387
- width: 236px;
388
-
389
- }
390
- }
391
-
392
- .clear_icon_sec {
393
- right: 32px;
394
- }
395
- }
396
-
397
- .date_filter {
398
- margin: 0;
399
- position: absolute;
400
- top: 0;
401
- left: 0px;
402
- background: #fff;
403
- height: 100%;
404
- padding: 4px 16px;
405
-
406
- li {
407
- height: 40px;
408
-
409
- &:hover {
410
- background: #F9FAFB;
411
- }
412
- }
413
-
414
- .active {
415
- background: #F9FAFB;
416
- }
417
-
418
-
419
- }
420
-
421
- div:has(ul.date_filter) .p-datepicker-group-container {
422
- padding-left: 116px;
423
- margin: -8px;
424
- }
425
-
426
- .bottom_date_filters {
427
- width: calc(100% - 116px);
428
- border-left: 1px solid #dee2e6;
429
- }
430
-
431
- div:has(ul.date_filter) .p-datepicker-group-container .p-datepicker table td>span {
432
- width: 40px;
433
- height: 40px;
434
- }
435
-
436
-
437
-
438
- div:has(ul.date_filter) .p-datepicker-group-container .p-datepicker-group {
439
- width: 328px;
440
- max-width: 328px;
441
- padding: 8px 20px !important;
442
- border: 1px solid #dee2e6;
443
- border-top: 0;
444
- }
445
-
446
- div:has(ul.date_filter) .p-datepicker-group-container div:nth-child(2) {
447
- border-right: 0;
448
- }
449
-
450
- div:has(ul.date_filter) .p-datepicker-group-container table td {
451
- padding: 0;
452
-
453
- }
454
-
455
- div:has(ul.date_filter) .p-datepicker-footer {
456
- margin: -8px;
457
- }
458
-
459
- .panel_status {
460
- .p-multiselect-filter-container {
461
- display: none;
462
- }
463
-
464
- .p-multiselect-header {
465
- padding: 0 !important;
466
- border-bottom: 0;
467
- }
468
- }
469
-
470
- .p-multiselect-panel {
471
- .p-multiselect-items {
472
- padding: 6px;
473
- min-width: 140px !important;
474
-
475
- }
476
- }
477
-
478
- .panel_withIcon.p-multiselect-panel {
479
- .p-multiselect-items {
480
- .p-multiselect-item {
481
- padding: 0 10px;
482
- }
483
- }
484
- }
485
-
486
-
487
-
488
- .Multi_select_dropdown_panel.hidePanelHeader {
489
- .p-multiselect-header {
490
- display: none;
491
- }
492
- }
493
-
494
- .errorField {
495
- color: var(--red-500);
496
- }
497
-
498
- .full_form_field {
499
- width: 37.125rem;
500
- }
501
-
502
- .form_field {
503
- width: 18.063rem;
504
- }
505
-
506
- #fontFamily-1 {
507
- border: 1px solid var(--gray-300);
508
- }
509
-
510
- .fr-toolbar .fr-btn-grp {
511
- margin-right: 0px;
512
- margin-left: 8px;
513
- }
514
-
515
- .PhoneInput {
516
- background: #ffffff;
517
- border: 1px solid var(--gray-300);
518
- transition: background-color 0.2s, color 0.2s, border-color 0.2s,
519
- box-shadow 0.2s;
520
- border-radius: 8px;
521
- box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
522
- padding-top: 10px;
523
- padding-bottom: 10px;
524
- padding-right: 12px;
525
- padding-left: 0px;
526
- height: 40px;
527
- :focus-visible {
528
- outline: none;
529
- }
530
- &:focus-within {
531
- outline: 0 none;
532
- outline-offset: 0;
533
- box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05),
534
- 0px 0px 0px 4px var(--primary-100);
535
- border-radius: 8px;
536
- border: 1px solid var(--primary-300);
537
- }
538
-
539
- .PhoneInputInput {
540
- border: none;
541
- }
542
- }
543
-
544
- .PhoneInputCountry {
545
- .PhoneInputCountryIcon--border {
546
- box-shadow: none;
547
- background-color: #ffffff;
548
- }
549
- .PhoneInputCountryIconImg {
550
- width: 20px;
551
- height: 20px;
552
- object-fit: cover;
553
- border-radius: 100%;
554
- position: absolute;
555
- top: 0;
556
- }
557
- }
558
-
559
- .phoneNumberClass {
560
- margin-left: 14.5rem;
561
- }
562
-
563
- #customCountryDropDown {
564
- .p-dropdown {
565
- border: none;
566
- box-shadow: none;
567
- background: none;
568
- padding: 0;
569
- .p-dropdown-label {
570
- padding: 0;
571
- padding-right: 4px;
572
- }
573
- .p-dropdown-trigger {
574
- padding-top: 20px;
575
- }
576
- .p-dropdown-trigger[aria-expanded="true"] {
577
- padding-bottom: 20px;
578
- }
579
- }
580
-
581
- }
582
-
583
- .customNumberField{
584
- .p-inputnumber-input {
585
- padding-left: 24px;
586
- }
587
130
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sccoreui",
3
- "version": "4.2.3",
3
+ "version": "4.2.5",
4
4
  "description": "ui-sccore",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",