@npm_leadtech/legal-lib-components 5.12.7 → 5.12.9

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.
Binary file
@@ -2,6 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Button } from '../../atoms';
3
3
  import { SubtypeDocumentCardStyled } from './SubtypeDocumentCard.styled';
4
4
  const SubtypeDocumentCard = ({ title, description, children, pdfButton, wordButton, createDocButton }) => {
5
- return (_jsxs(SubtypeDocumentCardStyled, { children: [_jsx("div", { children: children }), _jsxs("div", { className: 'content', children: [_jsx("h1", { className: 'title', children: title }), _jsx("p", { className: 'description', children: description }), _jsxs("div", { className: 'buttons-container', children: [_jsx(Button, { ...createDocButton }), _jsxs("div", { className: 'downloadable-buttons', children: [_jsx(Button, { ...pdfButton }), _jsx(Button, { ...wordButton })] })] })] })] }));
5
+ return (_jsxs(SubtypeDocumentCardStyled, { children: [_jsx("div", { className: 'image-container', children: children }), _jsxs("div", { className: 'content', children: [_jsx("h1", { className: 'title', children: title }), _jsx("p", { className: 'description', children: description }), _jsxs("div", { className: 'buttons-container', children: [_jsx(Button, { ...createDocButton }), _jsxs("div", { className: 'downloadable-buttons', children: [_jsx(Button, { ...pdfButton }), _jsx(Button, { ...wordButton })] })] })] })] }));
6
6
  };
7
7
  export default SubtypeDocumentCard;
@@ -15,6 +15,10 @@ export const SubtypeDocumentCardStyled = styled.div `
15
15
  box-shadow: 0px 2px 6px 0px var(--neutral-neutral-3);
16
16
  background-color: var(--secondary-main-light-5);
17
17
 
18
+ .image-container {
19
+ width: 70%;
20
+ }
21
+
18
22
  @media (min-width: ${size.xs}) {
19
23
  width: 428px;
20
24
  }
@@ -25,6 +29,14 @@ export const SubtypeDocumentCardStyled = styled.div `
25
29
  min-height: 380px;
26
30
  align-items: flex-start;
27
31
  flex-direction: row;
32
+
33
+ .image-container {
34
+ width: 40%;
35
+
36
+ @media (min-width: ${size.lg}) {
37
+ width: 30%;
38
+ }
39
+ }
28
40
  }
29
41
 
30
42
  @media (min-width: ${size.lg}) {
@@ -42,6 +54,10 @@ export const SubtypeDocumentCardStyled = styled.div `
42
54
  @media ${device['landscape-tablets']} {
43
55
  margin-left: 1rem;
44
56
  }
57
+
58
+ @media (min-width: ${size.md}) {
59
+ width: 65%;
60
+ }
45
61
  }
46
62
 
47
63
  .title {
@@ -80,6 +96,7 @@ export const SubtypeDocumentCardStyled = styled.div `
80
96
  @media ${device.laptop} {
81
97
  align-self: flex-start;
82
98
  width: auto;
99
+ margin-top: 0.5rem;
83
100
  }
84
101
 
85
102
  @media ${device.desktop} {
@@ -93,19 +110,29 @@ export const SubtypeDocumentCardStyled = styled.div `
93
110
  flex-wrap: wrap;
94
111
  gap: 1rem;
95
112
  width: 100%;
96
- margin-top: 0.75rem;
97
113
  justify-content: space-between;
98
114
 
99
115
  a {
100
116
  min-width: 46.5%;
117
+ max-width: 46.5%;
118
+ margin-top: 0.75rem;
101
119
  }
102
120
 
103
121
  @media ${device.laptop} {
104
122
  justify-content: flex-start;
105
123
  width: 100%;
106
124
 
125
+ a {
126
+ min-width: 46.5%;
127
+ max-width: fit-content;
128
+ margin-top: 0.5rem;
129
+ }
130
+ }
131
+
132
+ @media (min-width: ${size.lg}) {
107
133
  a {
108
134
  min-width: auto;
135
+ max-width: fit-content;
109
136
  }
110
137
  }
111
138
 
@@ -16,6 +16,10 @@ export const SubtypeDocumentCardStyled = styled.div`
16
16
  box-shadow: 0px 2px 6px 0px var(--neutral-neutral-3);
17
17
  background-color: var(--secondary-main-light-5);
18
18
 
19
+ .image-container {
20
+ width: 70%;
21
+ }
22
+
19
23
  @media (min-width: ${size.xs}) {
20
24
  width: 428px;
21
25
  }
@@ -26,6 +30,14 @@ export const SubtypeDocumentCardStyled = styled.div`
26
30
  min-height: 380px;
27
31
  align-items: flex-start;
28
32
  flex-direction: row;
33
+
34
+ .image-container {
35
+ width: 40%;
36
+
37
+ @media (min-width: ${size.lg}) {
38
+ width: 30%;
39
+ }
40
+ }
29
41
  }
30
42
 
31
43
  @media (min-width: ${size.lg}) {
@@ -43,6 +55,10 @@ export const SubtypeDocumentCardStyled = styled.div`
43
55
  @media ${device['landscape-tablets']} {
44
56
  margin-left: 1rem;
45
57
  }
58
+
59
+ @media (min-width: ${size.md}) {
60
+ width: 65%;
61
+ }
46
62
  }
47
63
 
48
64
  .title {
@@ -81,6 +97,7 @@ export const SubtypeDocumentCardStyled = styled.div`
81
97
  @media ${device.laptop} {
82
98
  align-self: flex-start;
83
99
  width: auto;
100
+ margin-top: 0.5rem;
84
101
  }
85
102
 
86
103
  @media ${device.desktop} {
@@ -94,19 +111,29 @@ export const SubtypeDocumentCardStyled = styled.div`
94
111
  flex-wrap: wrap;
95
112
  gap: 1rem;
96
113
  width: 100%;
97
- margin-top: 0.75rem;
98
114
  justify-content: space-between;
99
115
 
100
116
  a {
101
117
  min-width: 46.5%;
118
+ max-width: 46.5%;
119
+ margin-top: 0.75rem;
102
120
  }
103
121
 
104
122
  @media ${device.laptop} {
105
123
  justify-content: flex-start;
106
124
  width: 100%;
107
125
 
126
+ a {
127
+ min-width: 46.5%;
128
+ max-width: fit-content;
129
+ margin-top: 0.5rem;
130
+ }
131
+ }
132
+
133
+ @media (min-width: ${size.lg}) {
108
134
  a {
109
135
  min-width: auto;
136
+ max-width: fit-content;
110
137
  }
111
138
  }
112
139
 
@@ -15,7 +15,7 @@ const SubtypeDocumentCard: FC<SubtypeDocumentCardProps> = ({
15
15
  }) => {
16
16
  return (
17
17
  <SubtypeDocumentCardStyled>
18
- <div>{children}</div>
18
+ <div className='image-container'>{children}</div>
19
19
  <div className='content'>
20
20
  <h1 className='title'>{title}</h1>
21
21
  <p className='description'>{description}</p>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "5.12.7",
3
+ "version": "5.12.9",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",