@npm_leadtech/legal-lib-components 7.12.5 → 7.12.7

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 (3) hide show
  1. package/dist/src/components/sections/Header/Header.styled.js +75 -78
  2. package/dist/src/components/sections/Header/Header.styled.ts +75 -78
  3. package/package.json +1 -1
package/dist/src/components/sections/Header/Header.styled.js CHANGED
@@ -1,6 +1,12 @@
1
1
  import { device, size } from '../../../globalStyles/breakpoints';
2
2
  import styled from 'styled-components';
3
3
  export const HeaderStyled = styled.header `
4
+ background-color: var(--primary-main-light-6);
5
+ position: sticky;
6
+ top: 0;
7
+ transition: all 0.3s ease;
8
+ z-index: 1000;
9
+
4
10
  @media (max-width: ${size.sm}) {
5
11
  position: fixed;
6
12
  top: 0;
@@ -8,6 +14,7 @@ export const HeaderStyled = styled.header `
8
14
  width: 100%;
9
15
  z-index: 11111111111111;
10
16
  }
17
+
11
18
  html[data-theme='lawdistrict'] {
12
19
  .header {
13
20
  &.product-header-background {
@@ -17,108 +24,98 @@ export const HeaderStyled = styled.header `
17
24
  }
18
25
 
19
26
  .scrollDown {
20
- header:not(.hide-header-in-mobile) {
21
- background-color: var(--others-white) !important;
22
- box-shadow: var(--box-shadow-small);
23
- }
27
+ background-color: var(--others-white) !important;
28
+ box-shadow: var(--box-shadow-small);
24
29
  }
25
30
 
26
- .header {
27
- background-color: var(--primary-main-light-6);
28
- position: sticky;
29
- top: 0;
30
- transition: all 0.3s ease;
31
- z-index: 1000;
31
+ .top-bar-wrapper {
32
+ .top-bar {
33
+ font-size: 0.78rem;
34
+ letter-spacing: -0.5px;
35
+ }
32
36
 
33
- .top-bar-wrapper {
34
- .top-bar {
35
- font-size: 0.78rem;
36
- letter-spacing: -0.5px;
37
+ .top-bar-content {
38
+ width: 100%;
39
+ display: flex;
40
+ justify-content: space-around;
41
+ @media ${device['landscape-tablets']} {
42
+ justify-content: center;
43
+ width: auto;
37
44
  }
45
+ span {
46
+ display: none;
38
47
 
39
- .top-bar-content {
40
- width: 100%;
41
- display: flex;
42
- justify-content: space-around;
43
- @media ${device['landscape-tablets']} {
44
- justify-content: center;
45
- width: auto;
46
- }
47
- span {
48
- display: none;
49
-
50
- @media ${device['laptop']} {
51
- display: inline;
52
- }
48
+ @media ${device['laptop']} {
49
+ display: inline;
53
50
  }
54
51
  }
55
52
  }
53
+ }
56
54
 
57
- .top-bar-mobile {
58
- font-size: 14px;
59
- padding: 8px 10px;
60
- letter-spacing: normal;
61
- }
55
+ .top-bar-mobile {
56
+ font-size: 14px;
57
+ padding: 8px 10px;
58
+ letter-spacing: normal;
59
+ }
62
60
 
63
- &.hide-header-in-mobile {
64
- position: relative;
61
+ &.hide-header-in-mobile {
62
+ position: relative;
65
63
 
66
- @media ${device['landscape-tablets']} {
67
- position: sticky;
68
- }
64
+ @media ${device['landscape-tablets']} {
65
+ position: sticky;
69
66
  }
67
+ }
70
68
 
71
- &__inner {
72
- max-width: 1200px;
73
- padding: 1rem 1.5rem;
74
- align-items: center;
75
- justify-content: space-between;
69
+ &__inner {
70
+ max-width: 1200px;
71
+ padding: 1rem 1.5rem;
72
+ align-items: center;
73
+ justify-content: space-between;
76
74
 
77
- @media (min-width: ${size.sm}) {
78
- padding: 1rem;
79
- }
75
+ @media (min-width: ${size.sm}) {
76
+ padding: 1rem;
80
77
  }
78
+ }
81
79
 
82
- &__logo {
83
- z-index: 200;
84
- min-width: max-content;
85
- }
80
+ &__logo {
81
+ z-index: 200;
82
+ min-width: max-content;
83
+ }
86
84
 
87
- &.transparent-header-background {
88
- background-color: transparent;
89
- }
85
+ &.transparent-header-background {
86
+ background-color: transparent;
87
+ }
90
88
 
91
- &.form-header-background {
92
- background-color: var(--others-white);
93
- }
89
+ &.form-header-background {
90
+ background-color: var(--others-white);
91
+ }
94
92
 
95
- &.esignature-header-background {
96
- background-color: var(--neutral-neutral-5);
97
- }
93
+ &.esignature-header-background {
94
+ background-color: var(--neutral-neutral-5);
95
+ }
98
96
 
99
- .--no-grid {
100
- padding: 0 2rem;
101
- }
97
+ .--no-grid {
98
+ padding: 0 2rem;
99
+ }
102
100
 
103
- &.--is-open {
104
- background: var(--others-white);
105
- position: fixed;
106
- width: 100%;
107
- }
101
+ &.--is-open {
102
+ background: var(--others-white);
103
+ position: fixed;
104
+ width: 100%;
105
+ }
108
106
 
109
- a {
110
- text-decoration: none;
111
- }
107
+ a {
108
+ text-decoration: none;
109
+ }
112
110
 
113
- .refresh-container {
114
- height: 70px;
115
- padding-top: 10px;
111
+ .refresh-container {
112
+ height: 70px;
113
+ padding-top: 10px;
116
114
 
117
- .e-button {
118
- width: 140px;
119
- margin-left: auto;
120
- margin-right: auto;
121
- }
115
+ .e-button {
116
+ width: 140px;
117
+ margin-left: auto;
118
+ margin-right: auto;
122
119
  }
123
120
  }
124
121
  `;
package/dist/src/components/sections/Header/Header.styled.ts CHANGED
@@ -2,6 +2,12 @@ import { device, size } from '../../../globalStyles/breakpoints'
2
2
  import styled from 'styled-components'
3
3
 
4
4
  export const HeaderStyled = styled.header`
5
+ background-color: var(--primary-main-light-6);
6
+ position: sticky;
7
+ top: 0;
8
+ transition: all 0.3s ease;
9
+ z-index: 1000;
10
+
5
11
  @media (max-width: ${size.sm}) {
6
12
  position: fixed;
7
13
  top: 0;
@@ -9,6 +15,7 @@ export const HeaderStyled = styled.header`
9
15
  width: 100%;
10
16
  z-index: 11111111111111;
11
17
  }
18
+
12
19
  html[data-theme='lawdistrict'] {
13
20
  .header {
14
21
  &.product-header-background {
@@ -18,108 +25,98 @@ export const HeaderStyled = styled.header`
18
25
  }
19
26
 
20
27
  .scrollDown {
21
- header:not(.hide-header-in-mobile) {
22
- background-color: var(--others-white) !important;
23
- box-shadow: var(--box-shadow-small);
24
- }
28
+ background-color: var(--others-white) !important;
29
+ box-shadow: var(--box-shadow-small);
25
30
  }
26
31
 
27
- .header {
28
- background-color: var(--primary-main-light-6);
29
- position: sticky;
30
- top: 0;
31
- transition: all 0.3s ease;
32
- z-index: 1000;
32
+ .top-bar-wrapper {
33
+ .top-bar {
34
+ font-size: 0.78rem;
35
+ letter-spacing: -0.5px;
36
+ }
33
37
 
34
- .top-bar-wrapper {
35
- .top-bar {
36
- font-size: 0.78rem;
37
- letter-spacing: -0.5px;
38
+ .top-bar-content {
39
+ width: 100%;
40
+ display: flex;
41
+ justify-content: space-around;
42
+ @media ${device['landscape-tablets']} {
43
+ justify-content: center;
44
+ width: auto;
38
45
  }
46
+ span {
47
+ display: none;
39
48
 
40
- .top-bar-content {
41
- width: 100%;
42
- display: flex;
43
- justify-content: space-around;
44
- @media ${device['landscape-tablets']} {
45
- justify-content: center;
46
- width: auto;
47
- }
48
- span {
49
- display: none;
50
-
51
- @media ${device['laptop']} {
52
- display: inline;
53
- }
49
+ @media ${device['laptop']} {
50
+ display: inline;
54
51
  }
55
52
  }
56
53
  }
54
+ }
57
55
 
58
- .top-bar-mobile {
59
- font-size: 14px;
60
- padding: 8px 10px;
61
- letter-spacing: normal;
62
- }
56
+ .top-bar-mobile {
57
+ font-size: 14px;
58
+ padding: 8px 10px;
59
+ letter-spacing: normal;
60
+ }
63
61
 
64
- &.hide-header-in-mobile {
65
- position: relative;
62
+ &.hide-header-in-mobile {
63
+ position: relative;
66
64
 
67
- @media ${device['landscape-tablets']} {
68
- position: sticky;
69
- }
65
+ @media ${device['landscape-tablets']} {
66
+ position: sticky;
70
67
  }
68
+ }
71
69
 
72
- &__inner {
73
- max-width: 1200px;
74
- padding: 1rem 1.5rem;
75
- align-items: center;
76
- justify-content: space-between;
70
+ &__inner {
71
+ max-width: 1200px;
72
+ padding: 1rem 1.5rem;
73
+ align-items: center;
74
+ justify-content: space-between;
77
75
 
78
- @media (min-width: ${size.sm}) {
79
- padding: 1rem;
80
- }
76
+ @media (min-width: ${size.sm}) {
77
+ padding: 1rem;
81
78
  }
79
+ }
82
80
 
83
- &__logo {
84
- z-index: 200;
85
- min-width: max-content;
86
- }
81
+ &__logo {
82
+ z-index: 200;
83
+ min-width: max-content;
84
+ }
87
85
 
88
- &.transparent-header-background {
89
- background-color: transparent;
90
- }
86
+ &.transparent-header-background {
87
+ background-color: transparent;
88
+ }
91
89
 
92
- &.form-header-background {
93
- background-color: var(--others-white);
94
- }
90
+ &.form-header-background {
91
+ background-color: var(--others-white);
92
+ }
95
93
 
96
- &.esignature-header-background {
97
- background-color: var(--neutral-neutral-5);
98
- }
94
+ &.esignature-header-background {
95
+ background-color: var(--neutral-neutral-5);
96
+ }
99
97
 
100
- .--no-grid {
101
- padding: 0 2rem;
102
- }
98
+ .--no-grid {
99
+ padding: 0 2rem;
100
+ }
103
101
 
104
- &.--is-open {
105
- background: var(--others-white);
106
- position: fixed;
107
- width: 100%;
108
- }
102
+ &.--is-open {
103
+ background: var(--others-white);
104
+ position: fixed;
105
+ width: 100%;
106
+ }
109
107
 
110
- a {
111
- text-decoration: none;
112
- }
108
+ a {
109
+ text-decoration: none;
110
+ }
113
111
 
114
- .refresh-container {
115
- height: 70px;
116
- padding-top: 10px;
112
+ .refresh-container {
113
+ height: 70px;
114
+ padding-top: 10px;
117
115
 
118
- .e-button {
119
- width: 140px;
120
- margin-left: auto;
121
- margin-right: auto;
122
- }
116
+ .e-button {
117
+ width: 140px;
118
+ margin-left: auto;
119
+ margin-right: auto;
123
120
  }
124
121
  }
125
122
  `
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "7.12.5",
3
+ "version": "7.12.7",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",