@npm_leadtech/legal-lib-components 5.11.7 → 5.11.10

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 (11) hide show
  1. package/dist/src/components/molecules/BottomOverlay/BottomOverlay.styled.js +2 -2
  2. package/dist/src/components/molecules/BottomOverlay/BottomOverlay.styled.ts +2 -2
  3. package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.js +5 -0
  4. package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.ts +5 -0
  5. package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.js +5 -12
  6. package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.ts +5 -12
  7. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.js +1 -1
  8. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.js +7 -6
  9. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.ts +7 -6
  10. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.tsx +1 -1
  11. package/package.json +1 -1
package/dist/src/components/molecules/BottomOverlay/BottomOverlay.styled.js CHANGED
@@ -76,10 +76,10 @@ export const BottomOverlayStyled = styled.div `
76
76
 
77
77
  .overlay__scrollable-section {
78
78
  position: sticky;
79
- max-height: 21rem;
79
+ max-height: 30rem;
80
80
  min-height: 8.5rem;
81
81
  display: flex;
82
- overflow-y: scroll;
82
+ overflow-y: auto;
83
83
  padding-left: 1.5rem;
84
84
  padding-right: 1.5rem;
85
85
  width: 100%;
package/dist/src/components/molecules/BottomOverlay/BottomOverlay.styled.ts CHANGED
@@ -77,10 +77,10 @@ export const BottomOverlayStyled = styled.div`
77
77
 
78
78
  .overlay__scrollable-section {
79
79
  position: sticky;
80
- max-height: 21rem;
80
+ max-height: 30rem;
81
81
  min-height: 8.5rem;
82
82
  display: flex;
83
- overflow-y: scroll;
83
+ overflow-y: auto;
84
84
  padding-left: 1.5rem;
85
85
  padding-right: 1.5rem;
86
86
  width: 100%;
package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.js CHANGED
@@ -29,6 +29,11 @@ export const MoreDocsDesktopStyled = styled.div `
29
29
  letter-spacing: -0.3px;
30
30
  padding: 0 0 1.5rem 0;
31
31
  width: 100%;
32
+
33
+ @media only screen and (max-width: ${size.md}) {
34
+ display: flex;
35
+ justify-content: center;
36
+ }
32
37
  }
33
38
 
34
39
  .docs-container {
package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.ts CHANGED
@@ -30,6 +30,11 @@ export const MoreDocsDesktopStyled = styled.div`
30
30
  letter-spacing: -0.3px;
31
31
  padding: 0 0 1.5rem 0;
32
32
  width: 100%;
33
+
34
+ @media only screen and (max-width: ${size.md}) {
35
+ display: flex;
36
+ justify-content: center;
37
+ }
33
38
  }
34
39
 
35
40
  .docs-container {
package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.js CHANGED
@@ -1,12 +1,8 @@
1
- import { device } from '../../../globalStyles/breakpoints';
2
1
  import styled from 'styled-components';
3
2
  export const MoreDocsMobileStyled = styled.div `
4
3
  .more-docs-mobile {
5
4
  margin: 0 1.5rem 2.5rem 1.5rem;
6
- @media ${device['portrait-tablets']} {
7
- margin: 0 4.5rem 2.5rem 4.5rem;
8
- }
9
- padding: 0.3125rem 0;
5
+ padding: 5px 0;
10
6
  border-radius: 4px;
11
7
  border: solid 2px #dfe5e8;
12
8
  display: flex;
@@ -46,11 +42,8 @@ export const MoreDocsMobileStyled = styled.div `
46
42
  }
47
43
 
48
44
  .more-docs-list {
49
- margin: -2.5rem 1.5rem 2.5rem 1.5rem;
50
- @media ${device['portrait-tablets']} {
51
- margin: -2.5rem 4.5rem 2.5rem 4.5rem;
52
- }
53
- padding: 1rem 0.5rem 1rem 0.5rem;
45
+ margin: -40px 24px 40px 24px;
46
+ padding: 16px 8px 16px 8px;
54
47
  border-radius: 4px;
55
48
  border: solid 2px #dfe5e8;
56
49
  display: flex;
@@ -63,8 +56,8 @@ export const MoreDocsMobileStyled = styled.div `
63
56
 
64
57
  .separation-line {
65
58
  width: calc(100% - 20px);
66
- height: 0.0625rem;
67
- margin: 1rem 0.625rem;
59
+ height: 1px;
60
+ margin: 16px 10px;
68
61
  background-color: var(--neutral-neutral-3);
69
62
  }
70
63
 
package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.ts CHANGED
@@ -1,13 +1,9 @@
1
- import { device } from '../../../globalStyles/breakpoints'
2
1
  import styled from 'styled-components'
3
2
 
4
3
  export const MoreDocsMobileStyled = styled.div`
5
4
  .more-docs-mobile {
6
5
  margin: 0 1.5rem 2.5rem 1.5rem;
7
- @media ${device['portrait-tablets']} {
8
- margin: 0 4.5rem 2.5rem 4.5rem;
9
- }
10
- padding: 0.3125rem 0;
6
+ padding: 5px 0;
11
7
  border-radius: 4px;
12
8
  border: solid 2px #dfe5e8;
13
9
  display: flex;
@@ -47,11 +43,8 @@ export const MoreDocsMobileStyled = styled.div`
47
43
  }
48
44
 
49
45
  .more-docs-list {
50
- margin: -2.5rem 1.5rem 2.5rem 1.5rem;
51
- @media ${device['portrait-tablets']} {
52
- margin: -2.5rem 4.5rem 2.5rem 4.5rem;
53
- }
54
- padding: 1rem 0.5rem 1rem 0.5rem;
46
+ margin: -40px 24px 40px 24px;
47
+ padding: 16px 8px 16px 8px;
55
48
  border-radius: 4px;
56
49
  border: solid 2px #dfe5e8;
57
50
  display: flex;
@@ -64,8 +57,8 @@ export const MoreDocsMobileStyled = styled.div`
64
57
 
65
58
  .separation-line {
66
59
  width: calc(100% - 20px);
67
- height: 0.0625rem;
68
- margin: 1rem 0.625rem;
60
+ height: 1px;
61
+ margin: 16px 10px;
69
62
  background-color: var(--neutral-neutral-3);
70
63
  }
71
64
 
package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.js CHANGED
@@ -7,6 +7,6 @@ const RatafiaSubscriptionCard = ({ cardStyle, iconTitle, title, priceText, mainF
7
7
  return null;
8
8
  const buttonStyle = cardStyle === 'Secondary' ? 'primary3' : 'primary';
9
9
  const renderFeatures = (features, className) => features.map((feature) => (_jsxs("div", { className: `ratafia-card__feature ${className ?? ''}`, children: [feature.image?.url && _jsx(IconSvgURLWithThemeColor, { url: feature.image.url, height: '16', width: '16' }), _jsx(RichTextStrapi, { html: feature.title })] }, feature.title)));
10
- return (_jsxs(RatafiaSubscriptionCardStyled, { className: `ratafia-card ${cardStyle ? stringSlugify(cardStyle) : 'primary'}`, children: [_jsxs("div", { className: 'ratafia-card__header', children: [title && (_jsxs("div", { className: 'ratafia-card__title', children: [iconTitle?.url && _jsx(IconSvgURLWithThemeColor, { url: iconTitle.url, height: '26', width: '26' }), _jsx(RichTextStrapi, { html: title })] })), priceText && _jsx("div", { className: 'ratafia-card__price-text', children: priceText })] }), _jsx("hr", {}), _jsxs("div", { className: 'ratafia-card__body', children: [mainFeatures && renderFeatures(mainFeatures, 'main-feature'), AIFeatures && renderFeatures(AIFeatures, 'ai-feature')] }), buttonText && (_jsx("div", { className: 'ratafia-card__footer', children: _jsx(Button, { dataQa: 'ratafia-card-button', givenClass: 'ratafia-card__button', color: buttonStyle, label: buttonText, link: linkText ?? '#' }) }))] }));
10
+ return (_jsxs(RatafiaSubscriptionCardStyled, { className: `ratafia-card ${cardStyle ? stringSlugify(cardStyle) : 'primary'}`, children: [_jsxs("div", { className: 'ratafia-card__header', children: [title && (_jsxs("div", { className: 'ratafia-card__title', children: [iconTitle?.url && _jsx(IconSvgURLWithThemeColor, { url: iconTitle.url, height: '26', width: '26' }), _jsx(RichTextStrapi, { html: title })] })), priceText && _jsx("div", { className: 'ratafia-card__price-text', children: priceText })] }), _jsx("hr", {}), _jsxs("div", { className: 'ratafia-card__body', children: [mainFeatures && renderFeatures(mainFeatures, 'main-feature'), AIFeatures && renderFeatures(AIFeatures, 'ratafia-feature')] }), buttonText && (_jsx("div", { className: 'ratafia-card__footer', children: _jsx(Button, { dataQa: 'ratafia-card-button', givenClass: 'ratafia-card__button', color: buttonStyle, label: buttonText, link: linkText ?? '#' }) }))] }));
11
11
  };
12
12
  export default RatafiaSubscriptionCard;
package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.js CHANGED
@@ -4,7 +4,7 @@ export const RatafiaSubscriptionCardStyled = styled.div `
4
4
  flex-flow: column nowrap;
5
5
  flex: 1;
6
6
  gap: 0.5rem;
7
- min-width: 320px;
7
+ min-width: 270px;
8
8
  padding: 1rem;
9
9
  border-radius: var(--global-border-radius);
10
10
 
@@ -16,21 +16,21 @@ export const RatafiaSubscriptionCardStyled = styled.div `
16
16
  }
17
17
 
18
18
  .ratafia-card__feature {
19
- &.ratafia-card__ai-feature {
19
+ &.ratafia-feature {
20
20
  background-color: var(--primary-main-light-6);
21
21
  }
22
22
  }
23
23
  }
24
24
 
25
25
  &.secondary {
26
- background-color: var(--primary-main-light-4);
26
+ background-color: var(--secondary-main-light-4);
27
27
 
28
28
  .icon-svg-with-theme-color {
29
- background-color: var(--primary-main-dark-2);
29
+ background-color: var(--secondary-main-dark-2);
30
30
  }
31
31
 
32
32
  .ratafia-card__feature {
33
- &.ratafia-card__ai-feature {
33
+ &.ratafia-feature {
34
34
  background-color: var(--secondary-main-light-3);
35
35
  }
36
36
  }
@@ -79,9 +79,10 @@ export const RatafiaSubscriptionCardStyled = styled.div `
79
79
  margin-top: 0.2rem;
80
80
  }
81
81
 
82
- &.ratafia-card__ai-feature {
82
+ &.ratafia-feature {
83
83
  background-color: var(--primary-main-light-6);
84
84
  padding-left: 0.5rem;
85
+ padding-right: 0.5rem;
85
86
  }
86
87
  }
87
88
 
package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.ts CHANGED
@@ -5,7 +5,7 @@ export const RatafiaSubscriptionCardStyled = styled.div`
5
5
  flex-flow: column nowrap;
6
6
  flex: 1;
7
7
  gap: 0.5rem;
8
- min-width: 320px;
8
+ min-width: 270px;
9
9
  padding: 1rem;
10
10
  border-radius: var(--global-border-radius);
11
11
 
@@ -17,21 +17,21 @@ export const RatafiaSubscriptionCardStyled = styled.div`
17
17
  }
18
18
 
19
19
  .ratafia-card__feature {
20
- &.ratafia-card__ai-feature {
20
+ &.ratafia-feature {
21
21
  background-color: var(--primary-main-light-6);
22
22
  }
23
23
  }
24
24
  }
25
25
 
26
26
  &.secondary {
27
- background-color: var(--primary-main-light-4);
27
+ background-color: var(--secondary-main-light-4);
28
28
 
29
29
  .icon-svg-with-theme-color {
30
- background-color: var(--primary-main-dark-2);
30
+ background-color: var(--secondary-main-dark-2);
31
31
  }
32
32
 
33
33
  .ratafia-card__feature {
34
- &.ratafia-card__ai-feature {
34
+ &.ratafia-feature {
35
35
  background-color: var(--secondary-main-light-3);
36
36
  }
37
37
  }
@@ -80,9 +80,10 @@ export const RatafiaSubscriptionCardStyled = styled.div`
80
80
  margin-top: 0.2rem;
81
81
  }
82
82
 
83
- &.ratafia-card__ai-feature {
83
+ &.ratafia-feature {
84
84
  background-color: var(--primary-main-light-6);
85
85
  padding-left: 0.5rem;
86
+ padding-right: 0.5rem;
86
87
  }
87
88
  }
88
89
 
package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.tsx CHANGED
@@ -39,7 +39,7 @@ const RatafiaSubscriptionCard: FC<RatafiaSubscriptionCardProps> = ({
39
39
  <hr />
40
40
  <div className='ratafia-card__body'>
41
41
  {mainFeatures && renderFeatures(mainFeatures as unknown as BenefitProps[], 'main-feature')}
42
- {AIFeatures && renderFeatures(AIFeatures as unknown as BenefitProps[], 'ai-feature')}
42
+ {AIFeatures && renderFeatures(AIFeatures as unknown as BenefitProps[], 'ratafia-feature')}
43
43
  </div>
44
44
  {buttonText && (
45
45
  <div className='ratafia-card__footer'>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "5.11.7",
3
+ "version": "5.11.10",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",