optimized-react-component-library-xyz123 1.1.28 → 1.2.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "optimized-react-component-library-xyz123",
3
- "version": "1.1.28",
3
+ "version": "1.2.1",
4
4
  "description": "A modern React component library using TypeScript with React 19 support.",
5
5
  "main": "dist/index.cjs",
6
6
  "module": "dist/index.mjs",
@@ -83,7 +83,6 @@
83
83
  "date-fns": "^4.1.0",
84
84
  "dompurify": "^3.2.6",
85
85
  "react-bootstrap": "^2.10.10",
86
- "react-dropzone": "^14.3.8",
87
- "react-router-dom": "^7.13.0"
86
+ "react-dropzone": "^14.3.8"
88
87
  }
89
88
  }
@@ -67,88 +67,6 @@
67
67
  color: var(--dark-text);
68
68
  }
69
69
 
70
-
71
- /*--Navigation header / menu ----*/
72
-
73
- .pts-navigation-header-container {
74
- background: var(--dark-background-second);
75
- }
76
-
77
- .pts-navigation-header-logo-container,
78
- .pts-navigation-header-headline-container {
79
- border-color: var(--dark-background-third)!important;
80
- }
81
- .pts-navigation-header-nav-container button svg path,
82
- .pts-navigation-header-nav-container button svg line{
83
- color: var(--dark-action);
84
- fill: var(--dark-action);
85
- stroke: var(--dark-action);
86
- }
87
-
88
- .pts-navigation-header-container svg path {
89
- fill: var(--dark-text);
90
- }
91
-
92
-
93
- .pts-navigation-header-nav-container,
94
- .pts-navigation-header-button-label {
95
- background: var(--dark-background-second);
96
- color: var(--dark-action);
97
- }
98
-
99
- .pts-expand-icon svg rect{
100
- fill: var(--dark-action);
101
- }
102
-
103
-
104
- .pts-contract-icon svg rect{
105
- fill: var(--dark-orientation-active);
106
- }
107
-
108
-
109
- .pts-navigation-close-text{
110
- color: var(--dark-action);
111
- }
112
-
113
- .pts-navigation-close-button{
114
- background: var(--dark-main);
115
- color: var(--dark-action);
116
- }
117
-
118
- .pts-navigation-close-button svg path{
119
- stroke: var(--dark-action);
120
- }
121
- .pts-navigation-link-expand-button{
122
- background-color: var(--dark-main);
123
- }
124
-
125
- .pts-navigation-link-expand-button svg path{
126
- stroke: var(--dark-main)!important;
127
- }
128
-
129
- .pts-navigation-with-close-button,
130
- .pts-navigation-menu-container,
131
- .pts-navigation-button,
132
- .pts-navigation-close-container,
133
- .pts-sub-navigation-item,
134
- .pts-sub-navigation-item a,
135
- .pts-navigation-button a {
136
- background: var(--dark-main);
137
- color: var(--dark-text);
138
- border-color: var(--dark-background-third);
139
- }
140
-
141
- .pts-sub-navigation-container {
142
- background-color: #d5b9dd;
143
- border-left: var(--dark-action) 5px solid;
144
- }
145
-
146
- /*--------BREADCRUMBS------*/
147
- .pts-breadcrumbs {
148
- background-color: var(--dark-background-third);
149
- }
150
-
151
-
152
70
  /*-------MAIN CONTENT-------*/
153
71
  section,
154
72
  .pts-form-step-header {
@@ -169,7 +87,6 @@ background-color: var(--dark-main);
169
87
  .MoreInfoIcon svg {
170
88
  background-color: var(--dark-action);
171
89
  }
172
-
173
90
 
174
91
  .pts-serviceHeadlineAndBody-container a svg path,
175
92
  .MoreInfoIcon svg path {
@@ -244,6 +161,8 @@ background-color: var(--dark-main);
244
161
  color: var(--dark-error);
245
162
  }
246
163
 
164
+ .pts-root-question-input-error-border,
165
+ .pts-root-question-input-error-border,
247
166
  .pts-root-question-input-error-border {
248
167
  border: 0.15rem solid var(--dark-error) !important;
249
168
  }
@@ -486,21 +405,4 @@ background-color: var(--dark-main);
486
405
  input:-moz-autofill {
487
406
  box-shadow: 0 0 0 1000px transparent inset !important;
488
407
  }
489
-
490
- /***NYTT FLYTTA?? ***/
491
- .pts-standard-link-icon svg {
492
- background-color: var(--dark-action);
493
- }
494
- .pts-standard-link svg path{
495
- fill: var(--dark-main);
496
- color: #000000;
497
- }
498
- .pts-icon-circle {
499
- border: 2px solid var(--dark-action);
500
- background-color: var(--dark-action);
501
- }
502
-
503
- .pts-collapse-content{
504
- color:var(--dark-text);
505
- }
506
408
  }
@@ -3,84 +3,6 @@
3
3
  /********************************************/
4
4
 
5
5
  @media (max-width: 1085px) {
6
-
7
- .pts-navigation-header-container {
8
- padding:unset;
9
- border-bottom: 2px solid #ddd;
10
- }
11
- .pts-navigation-header-content {
12
- display: block;
13
- }
14
-
15
- .pts-navigation-header-logo-container {
16
- padding: 1.6rem 0px;
17
- width: 100%;
18
- text-align: center;
19
- border-bottom: 2px solid #ddd;
20
- }
21
-
22
- .pts-navigation-header-headline-container{
23
- border-bottom: 2px solid #ddd;
24
- height: 48px;
25
- align-items: center;
26
- }
27
-
28
- .pts-site-headline,
29
- .pts-navigation-header-headline-container p{
30
- font-size: 1.6rem;
31
- top:auto;
32
- }
33
-
34
- .pts-navigation-header-nav-container {
35
- align-items: center;
36
- justify-content: center;
37
- height: 48px;
38
- }
39
-
40
- .pts-navigation-header-nav-container button {
41
- width: 100%;
42
- }
43
-
44
-
45
- .pts-navigation-close-button {
46
- align-items: center;
47
- justify-content: center;
48
- margin-top: 1rem;
49
- margin-bottom: 1rem;
50
- }
51
-
52
- /**Navigation menu**/
53
-
54
- .pts-navigation-menu-container {
55
- top: -50px;
56
- width: 100%;
57
- max-width: unset;
58
- position: relative;
59
- }
60
-
61
- .pts-navigation-close-container {
62
- position: relative;
63
- padding: 1px 1px;
64
- height: 48px;
65
- justify-content: center;
66
- }
67
-
68
- .nav-parent-button {
69
- padding-right: 5px !important;
70
- border: 0px !important;
71
- }
72
-
73
- /**Breadcrumbs**/
74
- .pts-breadcrumbs a,
75
- .pts-crumb-label {
76
- font-size: 14px;
77
- }
78
-
79
- .pts-breadcrumbs {
80
- padding-left: 20px;
81
- height: 30px !important;
82
- }
83
-
84
6
  .pts-footer-content {
85
7
  display: flex;
86
8
  height: auto;
@@ -119,7 +119,26 @@ section {
119
119
  margin-right: 0.8rem;
120
120
  margin-top: 1.6rem;
121
121
  }
122
+ /* ?? Make changes in html ?? ----
123
+ .pts-button{
124
+ background-color: var(--action);
125
+ border: 2px solid var(--action);
126
+ color: var(--main);
127
+ padding: 8px 20px;
128
+ border-radius: 8px;
129
+ font-size: 16px;
130
+ cursor: pointer;
131
+ margin-left: 1.6rem;
132
+ }
122
133
 
134
+ .pts-button:focus,
135
+ .pts-button:hover{
136
+ background-color: var(--main);
137
+ border: 2px solid var(--action);
138
+ color: var(--action);
139
+ transition: 0.2s;
140
+ }
141
+ --- ?? Make changes in html ?? */
123
142
 
124
143
  p[aria-live='assertive']:empty {
125
144
  margin: 0;
@@ -348,282 +367,16 @@ input:focus-visible:-webkit-autofill {
348
367
  text-decoration: underline 0.2rem;
349
368
  }
350
369
 
351
- /**Header with navigation**/
352
-
353
-
354
-
355
- .pts-navigation-header-container {
356
- display: flex;
357
- min-height: 80px;
358
- padding: 0px 70px;
359
- align-items: center;
360
- justify-content: space-between;
361
- background-color: var(--main);
362
- }
363
-
364
- .pts-navigation-header-content {
365
- width: 100%;
366
- display: grid;
367
- grid-template-columns: 1fr auto 1fr;
368
- align-items: center;
369
- }
370
-
371
-
372
- .pts-navigation-header-logo svg {
373
- height: 4.7rem;
374
- width: auto;
375
- }
376
-
377
- .pts-navigation-header-headline-container{
378
- display:flex;
379
- justify-content: center;
380
- align-items: flex-end;
381
- }
382
-
383
- .pts-navigation-header-headline-container p{
384
- position: relative;
385
- font-family: 'Aeonik';
386
- font-size: 24px;
387
- font-weight: 700;
388
- top: 8px;
389
- }
390
-
391
- .pts-navigation-header-icons{
392
- position: relative;
393
- top: 2px;
394
- }
395
-
396
- .pts-close-icon{
397
- position: relative;
398
- bottom: -1px;
399
- }
400
-
401
- .pts-open-icon{
402
- position: relative;
403
- top: 4px;
404
- }
405
-
406
- .pts-navigation-overlay{
407
- position: fixed;
408
- left: 0;
409
- width: 100%;
410
- height: 100%;
411
- background-color: rgba(0, 0, 0, 0.5);
412
- display: flex;
413
- align-items: center;
414
- justify-content: center;
415
- z-index: 998;
416
- }
417
-
418
- .pts-navigation-header-nav-container{
419
- display: flex;
420
- justify-content: flex-end;
421
- width: 100%;
422
- align-items: flex-end;
423
- height: 5rem;
424
- }
425
-
426
- .pts-navigation-header-nav-container button {
427
- background: none;
428
- line-height: 2.4rem;
429
- text-decoration-skip-ink: none;
430
- border: none;
431
- color: var(--action);
432
- font-size: 1.6rem;
433
- padding: 0;
434
- cursor: pointer;
435
- width: 13rem;
436
- z-index: 999;
437
- }
438
-
439
- .pts-navigation-header-button-label {
440
- position: relative;
441
- padding-left: 0.8rem;
442
- }
443
-
444
-
445
- /******NAVIGATION MENU********/
446
- .pts-navigation-menu-container {
447
- background-color:var(--main);
448
- position: absolute;
449
- top: 0px;
450
- right: 0;
451
- width: 100%;
452
- max-width: 570px;
453
- z-index: 999;
454
- }
455
-
456
-
457
- .pts-navigation-close-text {
458
- padding-left: 0.8rem;
459
- font-size: 16px;
460
- }
461
-
462
- .pts-navigation-link-list,
463
- .pts-navigation-link,
464
- .pts-sub-navigation-list {
465
- all: unset;
466
- list-style: none;
467
- background-color:var(--main);;
468
- }
469
-
470
- .pts-navigation-link-list {
471
- width: 100%;
472
- padding-inline-start: 0px;
473
- }
474
-
475
- .pts-navigation-button a,
476
- .pts-sub-navigation-item a {
477
- text-decoration: none;
478
- color: var(--text)
479
- }
480
-
481
- .pts-navigation-link-expand-button {
482
- border: none;
483
- padding: 0;
484
- cursor: pointer;
485
- }
486
-
487
- .pts-sub-navigation-container {
488
- background-color: #d5b9dd;
489
- border-left: var(--action) 5px solid;
490
- padding-left: 3.6rem;
491
- display: flex ;
492
- align-items: flex-end ;
493
- gap: 18px ;
494
- }
495
-
496
- .pts-sub-navigation-list {
497
- display:block;
498
- width: 100%;
499
- }
500
-
501
- .pts-sub-navigation-item {
502
- height: 5.1rem;
503
- display: flex;
504
- align-items: center;
505
- justify-content: flex-start;
506
- border-bottom: 2px solid var(--background) ;
507
- padding-left: 3rem;
508
- }
509
-
510
-
511
- .pts-navigation-button,
512
- .pts-navigation-close-container {
513
- padding: 2.1rem 3.6rem;
514
- border-width: 0px;
515
- border-bottom: 2px solid var(--background);
516
- background-color: var(--main);
517
- text-align: left;
518
- display: flex;
519
- justify-content: space-between;
520
- align-items: center;
521
- }
522
-
523
- .pts-navigation-close-button {
524
- border: none;
525
- color: var(--action);
526
- background-color: var(--main);
527
- display: flex;
528
- align-items: center;
529
- justify-content: flex-start;
530
- margin-top: 1.5rem;
531
- margin-bottom: 1.5rem;
532
- cursor: pointer;
533
- }
534
-
535
- /*******Breadcrumbs********/
536
- .pts-breadcrumbs nav {
537
- background-color: unset;
538
- position: unset;
539
- display: flex;
540
- }
541
-
542
- .pts-breadcrumbs {
543
- background-color: var(--background-third);
544
- height: 4rem;
545
- display: flex;
546
- align-items: center;
547
- padding-left: 6rem;
548
- padding-top: 2px;
549
-
550
- }
551
-
552
- .pts-breadcrumbs ol{
553
- all: unset;
554
- }
555
-
556
- .pts-breadcrumbs li{
557
- all: unset;
558
- list-style: none;
559
- }
560
-
561
-
562
- .pts-breadcrumbs a:hover {
563
- color: var(--main);
564
- text-decoration: underline 2px;
565
- }
566
-
567
- .pts-breadcrumbs a {
568
- text-decoration: underline;
569
- }
570
-
571
- .pts-crumb-label,
572
- .pts-breadcrumbs a {
573
- color: var(--main);
574
- position: relative;
575
- line-height: 2rem;
576
- }
577
-
578
- .pts-breadcrumbs svg {
579
- margin: 0 1.6rem;
580
- top: 3px;
581
- position: relative;
582
- }
583
-
584
-
585
- /******SEARCH BAR*******/
586
- .pts-searchBar-container {
587
- height: 7rem;
588
- background-color: var(--background);
589
- display: flex;
590
- align-items: center;
591
- justify-content: center;
592
- }
593
-
594
- .pts-searchBar-button {
595
- height: 3.9rem;
596
- background-color: var(--action);
597
- border-radius: 8px;
598
- border: var(--action) solid 1px;
599
- color: var(--main);
600
- }
601
-
602
- .pts-searchBar-Button svg {
603
- margin-right: 0.5rem;
604
- }
605
-
606
- .pts-searchBar-container input {
607
- border-radius: 8px;
608
- width: 65vw;
609
- border: var(--action) solid 1px;
610
- margin-right: -10px;
611
- padding: 1rem;
612
- border-top-right-radius: 0px;
613
- border-bottom-right-radius: 0px;
614
- }
615
-
616
370
  /* ---------- TextBODY ---------- */
617
371
 
618
372
  .pts-textBody-container p {
619
373
  margin-bottom: 1.6rem;
620
374
  }
621
375
 
622
- .pts-standard-link-icon{
376
+ .MoreInfoIcon {
623
377
  margin-top: 2px;
624
378
  }
625
379
 
626
-
627
380
  .MoreInfoIcon svg {
628
381
  width: 1.6rem;
629
382
  height: 1.6rem;
@@ -634,9 +387,7 @@ input:focus-visible:-webkit-autofill {
634
387
  margin-right: 1.6rem;
635
388
  }
636
389
 
637
-
638
- .MoreInfoIcon svg path,
639
- .MoreInfoIcon {
390
+ .MoreInfoIcon svg path {
640
391
  fill: var(--main);
641
392
  }
642
393
 
@@ -1086,94 +837,3 @@ input:focus-visible:-webkit-autofill {
1086
837
  white-space: nowrap;
1087
838
  border: 0;
1088
839
  }
1089
-
1090
-
1091
-
1092
-
1093
- /****New STUFF****/
1094
- .pts-collapse {
1095
- position: relative;
1096
- }
1097
-
1098
- .pts-collapse-button {
1099
- background-color: var(--action);
1100
- color: white;
1101
- cursor: pointer;
1102
- padding: 12px 16px;
1103
- width: 100%;
1104
- border: none;
1105
- border-radius: 8px;
1106
- outline: none;
1107
- display: grid;
1108
- text-align: left;
1109
- grid-template-columns: 95% 5%;
1110
- align-items: center;
1111
- }
1112
-
1113
- .pts-collapse-button.open {
1114
- border-radius: 8px 8px 0 0;
1115
- }
1116
-
1117
- .pts-collapse-title {
1118
- all: unset;
1119
- font-family: Arial;
1120
- font-size: 16px;
1121
- font-style: normal;
1122
- font-weight: 400;
1123
- }
1124
-
1125
- .pts-collapse-body {
1126
- position: relative;
1127
- display: grid;
1128
- grid-template-rows: 0fr;
1129
- transition: grid-template-rows 0.3s ease;
1130
- }
1131
-
1132
- .pts-collapse-body.open {
1133
- grid-template-rows: 1fr;
1134
- border: 2px solid var(--info);
1135
- border-top: none;
1136
- }
1137
-
1138
- .pts-collapse-content {
1139
- overflow: hidden;
1140
- }
1141
-
1142
-
1143
- /******Links ********/
1144
-
1145
- .pts-icon-circle {
1146
- display: inline-flex;
1147
- align-items: center;
1148
- justify-content: center;
1149
- min-width: 2rem;
1150
- width: 2rem;
1151
- height: 2rem;
1152
- border-radius: 50%;
1153
- border: 2px solid var(--action);
1154
- background-color: var(--action);
1155
- margin-right: 1.6rem;
1156
- }
1157
-
1158
- .pts-icon-circle.pts-fileIcon svg{
1159
- margin-left: 2px;
1160
- }
1161
-
1162
- .pts-linkList-container {
1163
- margin: 0;
1164
- padding: 0;
1165
- }
1166
-
1167
- .pts-linkList-container ul {
1168
- all :unset;
1169
- margin: 0;
1170
- padding: 0;
1171
- }
1172
- .pts-linkList-container li {
1173
- padding: 6px;
1174
- list-style: none;
1175
- }
1176
-
1177
- [hidden]{
1178
- display:none;
1179
- }