@npm_leadtech/legal-lib-components 7.12.19 → 7.12.21

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 (7) hide show
  1. package/dist/src/components/organisms/MenuItems/MenuItems.styled.js +32 -19
  2. package/dist/src/components/organisms/MenuItems/MenuItems.styled.ts +32 -19
  3. package/dist/src/components/organisms/NavMenu/NavMenu.styled.js +32 -13
  4. package/dist/src/components/organisms/NavMenu/NavMenu.styled.ts +32 -13
  5. package/dist/src/components/sections/Header/Header.styled.js +1 -0
  6. package/dist/src/components/sections/Header/Header.styled.ts +1 -0
  7. package/package.json +1 -1
package/dist/src/components/organisms/MenuItems/MenuItems.styled.js CHANGED
@@ -8,7 +8,7 @@ export const MenuItemsStyled = styled.div `
8
8
 
9
9
  &__wrapper {
10
10
  width: 100%;
11
- margin-top: 3rem;
11
+ margin-top: 1rem;
12
12
  left: 0;
13
13
  background: var(--others-white);
14
14
  position: fixed;
@@ -29,7 +29,6 @@ export const MenuItemsStyled = styled.div `
29
29
  display: none;
30
30
  flex-flow: row wrap;
31
31
  justify-content: flex-end;
32
- margin-left: 1rem;
33
32
  }
34
33
 
35
34
  &__spacer {
@@ -40,7 +39,6 @@ export const MenuItemsStyled = styled.div `
40
39
  .left-nav {
41
40
  display: flex;
42
41
  align-items: center;
43
- margin-left: 1rem;
44
42
  }
45
43
 
46
44
  .header-phone {
@@ -90,11 +88,11 @@ export const MenuItemsStyled = styled.div `
90
88
  .navigation-pane__resources,
91
89
  .navigation-pane__help {
92
90
  position: relative;
93
- //margin-left: 0.5rem;
91
+ margin-left: 0.5rem;
94
92
  padding: 0.75rem 0;
95
93
  cursor: pointer;
96
94
 
97
- @media ${device['desktop']} {
95
+ @media ${device['portrait-tablets']} {
98
96
  margin-right: 1.5rem;
99
97
  padding-bottom: 0.5rem;
100
98
  }
@@ -238,15 +236,17 @@ export const MenuItemsStyled = styled.div `
238
236
 
239
237
  .navigation-pane__resources {
240
238
  margin-right: 1rem;
239
+
241
240
  @media ${device['mobile']} {
242
241
  width: 100%;
243
242
  }
244
- & > ul {
245
- width: 150px;
243
+
244
+ @media (min-width: ${size.sm}) and (max-width: ${size.md}) {
245
+ display: none;
246
246
  }
247
247
 
248
- @media ${device['landscape-tablets']} {
249
- display: block;
248
+ & > ul {
249
+ width: 150px;
250
250
  }
251
251
 
252
252
  &__title {
@@ -415,7 +415,7 @@ export const MenuItemsStyled = styled.div `
415
415
  .--is-open .--is-mobile .navigation-pane {
416
416
  .navigation-pane__wrapper {
417
417
  width: 100%;
418
- margin-top: 3rem;
418
+ margin-top: 1rem;
419
419
  left: 0;
420
420
  background: var(--others-white);
421
421
  position: fixed;
@@ -501,12 +501,12 @@ export const MenuItemsStyled = styled.div `
501
501
  display: none;
502
502
  }
503
503
 
504
- &__resources {
504
+ .navigation-pane__resources {
505
505
  display: flex;
506
506
  flex-direction: column;
507
507
  align-items: flex-start;
508
- padding: 1.5rem 0 0 0;
509
- margin: 0 1.5rem 1.5rem 1.5rem;
508
+ padding: 1.5rem 0;
509
+ margin: 0 1.5rem 2rem 1.5rem;
510
510
  border-top: 1px solid var(--neutral-neutral-4);
511
511
  border-bottom: 1px solid var(--neutral-neutral-4);
512
512
  }
@@ -517,7 +517,7 @@ export const MenuItemsStyled = styled.div `
517
517
  .navigation-pane {
518
518
  .navigation-pane__wrapper {
519
519
  width: 100%;
520
- margin-top: 3rem;
520
+ margin-top: 1rem;
521
521
  left: 0;
522
522
  background: var(--others-white);
523
523
  position: fixed;
@@ -629,7 +629,7 @@ export const MenuItemsStyled = styled.div `
629
629
  display: flex;
630
630
  flex-direction: column;
631
631
  width: 100%;
632
- margin-top: 3rem;
632
+ margin-top: 1rem;
633
633
  left: 0;
634
634
  background: var(--others-white);
635
635
  position: fixed;
@@ -652,11 +652,25 @@ export const MenuItemsStyled = styled.div `
652
652
  }
653
653
  }
654
654
 
655
+ .navigation-pane__user-menu {
656
+ display: flex;
657
+ flex-flow: row nowrap;
658
+ justify-content: center;
659
+ align-content: center;
660
+ padding: 1.5rem 0;
661
+ margin: 0 1rem;
662
+
663
+ .log-in {
664
+ min-width: 120px;
665
+ margin-right: 0.5rem;
666
+ }
667
+ }
668
+
655
669
  .navigation-pane__ratafia,
656
670
  .navigation-pane__link,
657
671
  .navigation-pane__esignature {
658
672
  order: 3;
659
- padding-left: 1.5rem;
673
+ padding: 1.5rem 0 0.5rem 1.5rem;
660
674
  }
661
675
 
662
676
  .navigation-pane__products {
@@ -667,10 +681,9 @@ export const MenuItemsStyled = styled.div `
667
681
  display: flex;
668
682
  flex-direction: column;
669
683
  align-items: flex-start;
670
- padding: 1.5rem 0 0 0;
671
- margin: 0 1.5rem 1.5rem 1.5rem;
684
+ padding: 1rem 0;
685
+ margin: 0 1.5rem 2rem 1.5rem;
672
686
  border-top: 1px solid var(--neutral-neutral-4);
673
- border-bottom: 1px solid var(--neutral-neutral-4);
674
687
  width: -webkit-fill-available;
675
688
  }
676
689
  }
package/dist/src/components/organisms/MenuItems/MenuItems.styled.ts CHANGED
@@ -9,7 +9,7 @@ export const MenuItemsStyled = styled.div`
9
9
 
10
10
  &__wrapper {
11
11
  width: 100%;
12
- margin-top: 3rem;
12
+ margin-top: 1rem;
13
13
  left: 0;
14
14
  background: var(--others-white);
15
15
  position: fixed;
@@ -30,7 +30,6 @@ export const MenuItemsStyled = styled.div`
30
30
  display: none;
31
31
  flex-flow: row wrap;
32
32
  justify-content: flex-end;
33
- margin-left: 1rem;
34
33
  }
35
34
 
36
35
  &__spacer {
@@ -41,7 +40,6 @@ export const MenuItemsStyled = styled.div`
41
40
  .left-nav {
42
41
  display: flex;
43
42
  align-items: center;
44
- margin-left: 1rem;
45
43
  }
46
44
 
47
45
  .header-phone {
@@ -91,11 +89,11 @@ export const MenuItemsStyled = styled.div`
91
89
  .navigation-pane__resources,
92
90
  .navigation-pane__help {
93
91
  position: relative;
94
- //margin-left: 0.5rem;
92
+ margin-left: 0.5rem;
95
93
  padding: 0.75rem 0;
96
94
  cursor: pointer;
97
95
 
98
- @media ${device['desktop']} {
96
+ @media ${device['portrait-tablets']} {
99
97
  margin-right: 1.5rem;
100
98
  padding-bottom: 0.5rem;
101
99
  }
@@ -239,15 +237,17 @@ export const MenuItemsStyled = styled.div`
239
237
 
240
238
  .navigation-pane__resources {
241
239
  margin-right: 1rem;
240
+
242
241
  @media ${device['mobile']} {
243
242
  width: 100%;
244
243
  }
245
- & > ul {
246
- width: 150px;
244
+
245
+ @media (min-width: ${size.sm}) and (max-width: ${size.md}) {
246
+ display: none;
247
247
  }
248
248
 
249
- @media ${device['landscape-tablets']} {
250
- display: block;
249
+ & > ul {
250
+ width: 150px;
251
251
  }
252
252
 
253
253
  &__title {
@@ -416,7 +416,7 @@ export const MenuItemsStyled = styled.div`
416
416
  .--is-open .--is-mobile .navigation-pane {
417
417
  .navigation-pane__wrapper {
418
418
  width: 100%;
419
- margin-top: 3rem;
419
+ margin-top: 1rem;
420
420
  left: 0;
421
421
  background: var(--others-white);
422
422
  position: fixed;
@@ -502,12 +502,12 @@ export const MenuItemsStyled = styled.div`
502
502
  display: none;
503
503
  }
504
504
 
505
- &__resources {
505
+ .navigation-pane__resources {
506
506
  display: flex;
507
507
  flex-direction: column;
508
508
  align-items: flex-start;
509
- padding: 1.5rem 0 0 0;
510
- margin: 0 1.5rem 1.5rem 1.5rem;
509
+ padding: 1.5rem 0;
510
+ margin: 0 1.5rem 2rem 1.5rem;
511
511
  border-top: 1px solid var(--neutral-neutral-4);
512
512
  border-bottom: 1px solid var(--neutral-neutral-4);
513
513
  }
@@ -518,7 +518,7 @@ export const MenuItemsStyled = styled.div`
518
518
  .navigation-pane {
519
519
  .navigation-pane__wrapper {
520
520
  width: 100%;
521
- margin-top: 3rem;
521
+ margin-top: 1rem;
522
522
  left: 0;
523
523
  background: var(--others-white);
524
524
  position: fixed;
@@ -630,7 +630,7 @@ export const MenuItemsStyled = styled.div`
630
630
  display: flex;
631
631
  flex-direction: column;
632
632
  width: 100%;
633
- margin-top: 3rem;
633
+ margin-top: 1rem;
634
634
  left: 0;
635
635
  background: var(--others-white);
636
636
  position: fixed;
@@ -656,11 +656,25 @@ export const MenuItemsStyled = styled.div`
656
656
  }
657
657
  }
658
658
 
659
+ .navigation-pane__user-menu {
660
+ display: flex;
661
+ flex-flow: row nowrap;
662
+ justify-content: center;
663
+ align-content: center;
664
+ padding: 1.5rem 0;
665
+ margin: 0 1rem;
666
+
667
+ .log-in {
668
+ min-width: 120px;
669
+ margin-right: 0.5rem;
670
+ }
671
+ }
672
+
659
673
  .navigation-pane__ratafia,
660
674
  .navigation-pane__link,
661
675
  .navigation-pane__esignature {
662
676
  order: 3;
663
- padding-left: 1.5rem;
677
+ padding: 1.5rem 0 0.5rem 1.5rem;
664
678
  }
665
679
 
666
680
  .navigation-pane__products {
@@ -671,10 +685,9 @@ export const MenuItemsStyled = styled.div`
671
685
  display: flex;
672
686
  flex-direction: column;
673
687
  align-items: flex-start;
674
- padding: 1.5rem 0 0 0;
675
- margin: 0 1.5rem 1.5rem 1.5rem;
688
+ padding: 1rem 0;
689
+ margin: 0 1.5rem 2rem 1.5rem;
676
690
  border-top: 1px solid var(--neutral-neutral-4);
677
- border-bottom: 1px solid var(--neutral-neutral-4);
678
691
  width: -webkit-fill-available;
679
692
  }
680
693
  }
package/dist/src/components/organisms/NavMenu/NavMenu.styled.js CHANGED
@@ -2,6 +2,9 @@ import { device, size } from '../../../globalStyles/breakpoints';
2
2
  import styled from 'styled-components';
3
3
  export const NavMenuStyled = styled.nav `
4
4
  width: 100%;
5
+ display: flex;
6
+ justify-content: flex-end;
7
+
5
8
  .navigation-pane {
6
9
  &__spacer {
7
10
  display: flex;
@@ -19,7 +22,6 @@ export const NavMenuStyled = styled.nav `
19
22
  .left-nav {
20
23
  display: flex;
21
24
  align-items: center;
22
- margin-left: 1rem;
23
25
  }
24
26
 
25
27
  .header-phone {
@@ -68,11 +70,11 @@ export const NavMenuStyled = styled.nav `
68
70
  .navigation-pane__help,
69
71
  .navigation-pane__resources {
70
72
  position: relative;
71
- //margin-left: 0.5rem;
73
+ margin-left: 0.5rem;
72
74
  padding: 0.75rem 0;
73
75
  cursor: pointer;
74
76
 
75
- @media ${device['desktop']} {
77
+ @media ${device['portrait-tablets']} {
76
78
  margin-right: 1.5rem;
77
79
  padding-bottom: 0.5rem;
78
80
  }
@@ -207,15 +209,17 @@ export const NavMenuStyled = styled.nav `
207
209
 
208
210
  .navigation-pane__resources {
209
211
  margin-right: 1rem;
212
+
210
213
  @media ${device['mobile']} {
211
214
  width: 100%;
212
215
  }
213
- & > ul {
214
- width: 150px;
216
+
217
+ @media (min-width: ${size.sm}) and (max-width: ${size.md}) {
218
+ display: none;
215
219
  }
216
220
 
217
- @media ${device['landscape-tablets']} {
218
- display: block;
221
+ & > ul {
222
+ width: 150px;
219
223
  }
220
224
 
221
225
  &__title {
@@ -397,7 +401,7 @@ export const NavMenuStyled = styled.nav `
397
401
  .navigation-pane {
398
402
  .navigation-pane__wrapper {
399
403
  width: 100%;
400
- margin-top: 3rem;
404
+ margin-top: 1rem;
401
405
  left: 0;
402
406
  background: var(--others-white);
403
407
  position: fixed;
@@ -489,8 +493,8 @@ export const NavMenuStyled = styled.nav `
489
493
  display: flex;
490
494
  flex-direction: column;
491
495
  align-items: flex-start;
492
- padding: 1.5rem 0 0 0;
493
- margin: 0 1.5rem 1.5rem 1.5rem;
496
+ padding: 1.5rem 0;
497
+ margin: 0 1.5rem 2rem 1.5rem;
494
498
  border-top: 1px solid var(--neutral-neutral-4);
495
499
  }
496
500
  }
@@ -576,7 +580,7 @@ export const NavMenuStyled = styled.nav `
576
580
  display: flex;
577
581
  flex-direction: column;
578
582
  width: 100%;
579
- margin-top: 3rem;
583
+ margin-top: 1rem;
580
584
  left: 0;
581
585
  background: var(--others-white);
582
586
  position: fixed;
@@ -594,6 +598,20 @@ export const NavMenuStyled = styled.nav `
594
598
  }
595
599
  }
596
600
 
601
+ .navigation-pane__user-menu {
602
+ display: flex;
603
+ flex-flow: row nowrap;
604
+ justify-content: center;
605
+ align-content: center;
606
+ padding: 1.5rem 0;
607
+ margin: 0 1rem;
608
+
609
+ .log-in {
610
+ min-width: 120px;
611
+ margin-right: 0.5rem;
612
+ }
613
+ }
614
+
597
615
  .navigation-pane__ratafia,
598
616
  .navigation-pane__esignature {
599
617
  order: 3;
@@ -608,9 +626,10 @@ export const NavMenuStyled = styled.nav `
608
626
  display: flex;
609
627
  flex-direction: column;
610
628
  align-items: flex-start;
611
- padding: 1.5rem 0 0 0;
612
- margin: 0 1.5rem 1.5rem 1.5rem;
629
+ padding: 1rem 0;
630
+ margin: 0 1.5rem 2rem 1.5rem;
613
631
  border-top: 1px solid var(--neutral-neutral-4);
632
+ width: -webkit-fill-available;
614
633
  }
615
634
  }
616
635
  `;
package/dist/src/components/organisms/NavMenu/NavMenu.styled.ts CHANGED
@@ -3,6 +3,9 @@ import styled from 'styled-components'
3
3
 
4
4
  export const NavMenuStyled = styled.nav`
5
5
  width: 100%;
6
+ display: flex;
7
+ justify-content: flex-end;
8
+
6
9
  .navigation-pane {
7
10
  &__spacer {
8
11
  display: flex;
@@ -20,7 +23,6 @@ export const NavMenuStyled = styled.nav`
20
23
  .left-nav {
21
24
  display: flex;
22
25
  align-items: center;
23
- margin-left: 1rem;
24
26
  }
25
27
 
26
28
  .header-phone {
@@ -69,11 +71,11 @@ export const NavMenuStyled = styled.nav`
69
71
  .navigation-pane__help,
70
72
  .navigation-pane__resources {
71
73
  position: relative;
72
- //margin-left: 0.5rem;
74
+ margin-left: 0.5rem;
73
75
  padding: 0.75rem 0;
74
76
  cursor: pointer;
75
77
 
76
- @media ${device['desktop']} {
78
+ @media ${device['portrait-tablets']} {
77
79
  margin-right: 1.5rem;
78
80
  padding-bottom: 0.5rem;
79
81
  }
@@ -208,15 +210,17 @@ export const NavMenuStyled = styled.nav`
208
210
 
209
211
  .navigation-pane__resources {
210
212
  margin-right: 1rem;
213
+
211
214
  @media ${device['mobile']} {
212
215
  width: 100%;
213
216
  }
214
- & > ul {
215
- width: 150px;
217
+
218
+ @media (min-width: ${size.sm}) and (max-width: ${size.md}) {
219
+ display: none;
216
220
  }
217
221
 
218
- @media ${device['landscape-tablets']} {
219
- display: block;
222
+ & > ul {
223
+ width: 150px;
220
224
  }
221
225
 
222
226
  &__title {
@@ -398,7 +402,7 @@ export const NavMenuStyled = styled.nav`
398
402
  .navigation-pane {
399
403
  .navigation-pane__wrapper {
400
404
  width: 100%;
401
- margin-top: 3rem;
405
+ margin-top: 1rem;
402
406
  left: 0;
403
407
  background: var(--others-white);
404
408
  position: fixed;
@@ -490,8 +494,8 @@ export const NavMenuStyled = styled.nav`
490
494
  display: flex;
491
495
  flex-direction: column;
492
496
  align-items: flex-start;
493
- padding: 1.5rem 0 0 0;
494
- margin: 0 1.5rem 1.5rem 1.5rem;
497
+ padding: 1.5rem 0;
498
+ margin: 0 1.5rem 2rem 1.5rem;
495
499
  border-top: 1px solid var(--neutral-neutral-4);
496
500
  }
497
501
  }
@@ -577,7 +581,7 @@ export const NavMenuStyled = styled.nav`
577
581
  display: flex;
578
582
  flex-direction: column;
579
583
  width: 100%;
580
- margin-top: 3rem;
584
+ margin-top: 1rem;
581
585
  left: 0;
582
586
  background: var(--others-white);
583
587
  position: fixed;
@@ -598,6 +602,20 @@ export const NavMenuStyled = styled.nav`
598
602
  }
599
603
  }
600
604
 
605
+ .navigation-pane__user-menu {
606
+ display: flex;
607
+ flex-flow: row nowrap;
608
+ justify-content: center;
609
+ align-content: center;
610
+ padding: 1.5rem 0;
611
+ margin: 0 1rem;
612
+
613
+ .log-in {
614
+ min-width: 120px;
615
+ margin-right: 0.5rem;
616
+ }
617
+ }
618
+
601
619
  .navigation-pane__ratafia,
602
620
  .navigation-pane__esignature {
603
621
  order: 3;
@@ -612,9 +630,10 @@ export const NavMenuStyled = styled.nav`
612
630
  display: flex;
613
631
  flex-direction: column;
614
632
  align-items: flex-start;
615
- padding: 1.5rem 0 0 0;
616
- margin: 0 1.5rem 1.5rem 1.5rem;
633
+ padding: 1rem 0;
634
+ margin: 0 1.5rem 2rem 1.5rem;
617
635
  border-top: 1px solid var(--neutral-neutral-4);
636
+ width: -webkit-fill-available;
618
637
  }
619
638
  }
620
639
  `
package/dist/src/components/sections/Header/Header.styled.js CHANGED
@@ -26,6 +26,7 @@ export const HeaderStyled = styled.header `
26
26
  justify-content: space-between;
27
27
  max-width: 1200px;
28
28
  padding: 1rem 1.5rem;
29
+ margin-bottom: 0.1rem;
29
30
 
30
31
  @media (min-width: ${size.sm}) {
31
32
  padding: 1rem;
package/dist/src/components/sections/Header/Header.styled.ts CHANGED
@@ -27,6 +27,7 @@ export const HeaderStyled = styled.header`
27
27
  justify-content: space-between;
28
28
  max-width: 1200px;
29
29
  padding: 1rem 1.5rem;
30
+ margin-bottom: 0.1rem;
30
31
 
31
32
  @media (min-width: ${size.sm}) {
32
33
  padding: 1rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "7.12.19",
3
+ "version": "7.12.21",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",