@npm_leadtech/legal-lib-components 5.11.11 → 5.11.13

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 (137) hide show
  1. package/dist/css/styles.css +1 -848
  2. package/dist/src/components/atoms/MenuItems/MenuItemProps.types.d.ts +1 -0
  3. package/dist/src/components/atoms/MenuItems/MenuItemProps.types.ts +1 -0
  4. package/dist/src/components/atoms/SearchSelect/SearchSelect.styled.js +1 -1
  5. package/dist/src/components/atoms/SearchSelect/SearchSelect.styled.ts +1 -1
  6. package/dist/src/components/molecules/BottomOverlay/BottomOverlay.js +12 -0
  7. package/dist/src/components/molecules/BottomOverlay/BottomOverlay.tsx +12 -0
  8. package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.js +0 -5
  9. package/dist/src/components/molecules/MoreDocsDesktop/MoreDocsDesktop.styled.ts +0 -5
  10. package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.js +12 -5
  11. package/dist/src/components/molecules/MoreDocsMobile/MoreDocsMobile.styled.ts +12 -5
  12. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.js +7 -0
  13. package/dist/src/components/molecules/RatafiaSubscriptionCard/RatafiaSubscriptionCard.styled.ts +7 -0
  14. package/dist/src/components/molecules/TextInput/TextInput.scss +1 -1
  15. package/dist/src/components/organisms/AboutUsContent/AboutUsContent.js +2 -2
  16. package/dist/src/components/organisms/AboutUsContent/AboutUsContent.styled.d.ts +1 -0
  17. package/dist/src/components/organisms/AboutUsContent/AboutUsContent.styled.js +59 -0
  18. package/dist/src/components/organisms/AboutUsContent/{AboutUsContent.scss → AboutUsContent.styled.ts} +13 -11
  19. package/dist/src/components/organisms/AboutUsContent/AboutUsContent.tsx +3 -3
  20. package/dist/src/components/organisms/Accordion/Accordion.js +2 -2
  21. package/dist/src/components/organisms/Accordion/Accordion.styled.d.ts +1 -0
  22. package/dist/src/components/organisms/Accordion/Accordion.styled.js +5 -0
  23. package/dist/src/components/organisms/Accordion/Accordion.styled.ts +6 -0
  24. package/dist/src/components/organisms/Accordion/Accordion.tsx +3 -4
  25. package/dist/src/components/organisms/ArticlesList/ArticlesList.js +2 -2
  26. package/dist/src/components/organisms/ArticlesList/ArticlesList.styled.d.ts +1 -0
  27. package/dist/src/components/organisms/ArticlesList/ArticlesList.styled.js +11 -0
  28. package/dist/src/components/organisms/ArticlesList/ArticlesList.styled.ts +12 -0
  29. package/dist/src/components/organisms/ArticlesList/ArticlesList.tsx +3 -3
  30. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.js +3 -3
  31. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.styled.d.ts +1 -0
  32. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.styled.js +22 -0
  33. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.styled.ts +23 -0
  34. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.tsx +3 -3
  35. package/dist/src/components/organisms/CardFunctionality/CardFunctionality.js +2 -2
  36. package/dist/src/components/organisms/CardFunctionality/CardFunctionality.styled.d.ts +1 -0
  37. package/dist/src/components/organisms/CardFunctionality/CardFunctionality.styled.js +60 -0
  38. package/dist/src/components/organisms/CardFunctionality/{CardFunctionality.scss → CardFunctionality.styled.ts} +3 -3
  39. package/dist/src/components/organisms/CardFunctionality/CardFunctionality.tsx +3 -3
  40. package/dist/src/components/organisms/ContactJumbotron/ContactJumbotron.js +2 -2
  41. package/dist/src/components/organisms/ContactJumbotron/ContactJumbotron.styled.d.ts +1 -0
  42. package/dist/src/components/organisms/ContactJumbotron/ContactJumbotron.styled.js +43 -0
  43. package/dist/src/components/organisms/ContactJumbotron/{ContactJumbotron.scss → ContactJumbotron.styled.ts} +6 -7
  44. package/dist/src/components/organisms/ContactJumbotron/ContactJumbotron.tsx +3 -3
  45. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.js +2 -2
  46. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.styled.d.ts +1 -0
  47. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.styled.js +48 -0
  48. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.styled.ts +49 -0
  49. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.tsx +11 -13
  50. package/dist/src/components/organisms/ErrorContentRatafia/ErrorContentRatafia.js +2 -2
  51. package/dist/src/components/organisms/ErrorContentRatafia/ErrorContentRatafia.styled.d.ts +1 -0
  52. package/dist/src/components/organisms/ErrorContentRatafia/ErrorContentRatafia.styled.js +18 -0
  53. package/dist/src/components/organisms/ErrorContentRatafia/{ErrorContentRatafia.scss → ErrorContentRatafia.styled.ts} +7 -6
  54. package/dist/src/components/organisms/ErrorContentRatafia/ErrorContentRatafia.tsx +3 -3
  55. package/dist/src/components/organisms/FaqGroup/FaqGroup.js +2 -2
  56. package/dist/src/components/organisms/FaqGroup/FaqGroup.styled.d.ts +1 -0
  57. package/dist/src/components/organisms/FaqGroup/FaqGroup.styled.js +21 -0
  58. package/dist/src/components/organisms/FaqGroup/{FaqGroup.scss → FaqGroup.styled.ts} +3 -3
  59. package/dist/src/components/organisms/FaqGroup/FaqGroup.tsx +3 -3
  60. package/dist/src/components/organisms/FeaturesRatafiaContent/FeaturesRatafiaContent.js +2 -2
  61. package/dist/src/components/organisms/FeaturesRatafiaContent/FeaturesRatafiaContent.styled.d.ts +1 -0
  62. package/dist/src/components/organisms/FeaturesRatafiaContent/FeaturesRatafiaContent.styled.js +27 -0
  63. package/dist/src/components/organisms/FeaturesRatafiaContent/{FeaturesRatafiaContent.scss → FeaturesRatafiaContent.styled.ts} +4 -4
  64. package/dist/src/components/organisms/FeaturesRatafiaContent/FeaturesRatafiaContent.tsx +3 -3
  65. package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.js +3 -3
  66. package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.styled.d.ts +1 -0
  67. package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.styled.js +138 -0
  68. package/dist/src/components/organisms/GuidelinesContent/{GuidelinesContent.scss → GuidelinesContent.styled.ts} +17 -17
  69. package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.tsx +3 -3
  70. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.js +2 -2
  71. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.styled.d.ts +1 -0
  72. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.styled.js +26 -0
  73. package/dist/src/components/organisms/JumbotronRatafiaContent/{JumbotronRatafiaContent.scss → JumbotronRatafiaContent.styled.ts} +6 -7
  74. package/dist/src/components/organisms/JumbotronRatafiaContent/JumbotronRatafiaContent.tsx +3 -3
  75. package/dist/src/components/organisms/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.js +2 -2
  76. package/dist/src/components/organisms/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.styled.d.ts +1 -0
  77. package/dist/src/components/organisms/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.styled.js +144 -0
  78. package/dist/src/components/organisms/KeyFactsLoadingContentRatafia/{KeyFactsLoadingContentRatafia.scss → KeyFactsLoadingContentRatafia.styled.ts} +24 -25
  79. package/dist/src/components/organisms/KeyFactsLoadingContentRatafia/KeyFactsLoadingContentRatafia.tsx +3 -3
  80. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.js +2 -2
  81. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.styled.d.ts +1 -0
  82. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.styled.js +21 -0
  83. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.styled.ts +22 -0
  84. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.tsx +3 -3
  85. package/dist/src/components/organisms/LanguageSelectorMobile/LanguageSelectorMobile.js +2 -2
  86. package/dist/src/components/organisms/LanguageSelectorMobile/LanguageSelectorMobile.styled.d.ts +5 -0
  87. package/dist/src/components/organisms/LanguageSelectorMobile/{LanguageSelectorMobile.scss → LanguageSelectorMobile.styled.js} +6 -6
  88. package/dist/src/components/organisms/LanguageSelectorMobile/LanguageSelectorMobile.styled.ts +70 -0
  89. package/dist/src/components/organisms/LanguageSelectorMobile/LanguageSelectorMobile.tsx +3 -3
  90. package/dist/src/components/organisms/LayoutRatafia/LayoutRatafia.js +2 -2
  91. package/dist/src/components/organisms/LayoutRatafia/LayoutRatafia.styled.d.ts +1 -0
  92. package/dist/src/components/organisms/LayoutRatafia/LayoutRatafia.styled.js +91 -0
  93. package/dist/src/components/organisms/LayoutRatafia/{LayoutRatafia.scss → LayoutRatafia.styled.ts} +12 -13
  94. package/dist/src/components/organisms/LayoutRatafia/LayoutRatafia.tsx +3 -3
  95. package/dist/src/components/organisms/ListStepsGetForm/ListStepsGetForm.js +2 -2
  96. package/dist/src/components/organisms/ListStepsGetForm/ListStepsGetForm.styled.d.ts +1 -0
  97. package/dist/src/components/organisms/ListStepsGetForm/ListStepsGetForm.styled.js +34 -0
  98. package/dist/src/components/organisms/ListStepsGetForm/{ListStepsGetForm.scss → ListStepsGetForm.styled.ts} +7 -7
  99. package/dist/src/components/organisms/ListStepsGetForm/ListStepsGetForm.tsx +3 -3
  100. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.js +2 -2
  101. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.styled.d.ts +1 -0
  102. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.styled.js +14 -0
  103. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.styled.ts +15 -0
  104. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.tsx +3 -3
  105. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBar.js +4 -8
  106. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBar.styled.d.ts +1 -0
  107. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBar.styled.js +45 -0
  108. package/dist/src/components/organisms/MobileBottomBar/{MobileBottomBar.scss → MobileBottomBar.styled.ts} +6 -6
  109. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBar.tsx +5 -10
  110. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBarProps.types.d.ts +0 -1
  111. package/dist/src/components/organisms/MobileBottomBar/MobileBottomBarProps.types.ts +0 -1
  112. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.js +2 -2
  113. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.styled.d.ts +1 -0
  114. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.styled.js +11 -0
  115. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.styled.ts +12 -0
  116. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.tsx +3 -3
  117. package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.js +3 -3
  118. package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.styled.d.ts +1 -0
  119. package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.styled.js +54 -0
  120. package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.styled.ts +55 -0
  121. package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.tsx +3 -3
  122. package/dist/src/components/pages/ErrorRatafiaPage/ErrorRatafiaPage.styled.js +2 -1
  123. package/dist/src/components/pages/ErrorRatafiaPage/ErrorRatafiaPage.styled.ts +2 -1
  124. package/dist/src/components/pages/FaqsPage/FaqsPage.styled.js +5 -4
  125. package/dist/src/components/pages/FaqsPage/FaqsPage.styled.ts +5 -4
  126. package/dist/src/components/pages/KeyFactsResultRatafiaPage/KeyFactsResultRatafiaPage.styled.js +2 -1
  127. package/dist/src/components/pages/KeyFactsResultRatafiaPage/KeyFactsResultRatafiaPage.styled.ts +2 -1
  128. package/dist/src/globalStyles/styles.scss +0 -22
  129. package/dist/tsconfig.build.tsbuildinfo +1 -1
  130. package/package.json +1 -1
  131. package/dist/src/components/organisms/Accordion/Accordion.scss +0 -4
  132. package/dist/src/components/organisms/ArticlesList/ArticlesList.scss +0 -12
  133. package/dist/src/components/organisms/AsSeeInContent/AsSeeInContent.scss +0 -22
  134. package/dist/src/components/organisms/CookiePolicyBar/CookiePolicyBar.scss +0 -54
  135. package/dist/src/components/organisms/KeyFactsResultContentRatafia/KeyFactsResultContentRatafia.scss +0 -23
  136. package/dist/src/components/organisms/LoginRatafiaContent/LoginRatafiaContent.scss +0 -16
  137. package/dist/src/components/organisms/StepsRatafiaContent/StepsRatafiaContent.scss +0 -12
@@ -0,0 +1,138 @@
1
+ import { device } from '../../../globalStyles/breakpoints';
2
+ import styled from 'styled-components';
3
+ export const GuideslinesContentStyled = styled.div `
4
+ .guidelines-section-main {
5
+ display: flex;
6
+ flex-direction: column;
7
+ flex-wrap: nowrap;
8
+ padding: 1.5rem;
9
+
10
+ @media ${device.laptop} {
11
+ flex-direction: row;
12
+ padding: 0;
13
+ }
14
+ }
15
+
16
+ .guidelines-section__texts {
17
+ flex-basis: 50%;
18
+ display: flex;
19
+ flex-direction: column;
20
+ justify-content: center;
21
+ margin-bottom: 1rem;
22
+ margin-right: 0;
23
+ color: var(--neutral-neutral-1);
24
+ font-style: normal;
25
+ font-weight: 400;
26
+ letter-spacing: -0.3px;
27
+
28
+ @media ${device['landscape-tablets']} {
29
+ margin-left: 3rem;
30
+ margin-bottom: 0;
31
+ }
32
+
33
+ &__title {
34
+ font-family: var(--font-serif);
35
+ margin-bottom: 2rem;
36
+ text-align: center;
37
+ font-size: 32px;
38
+ font-style: normal;
39
+ font-weight: 400;
40
+ line-height: 42px;
41
+ letter-spacing: -0.3px;
42
+
43
+ @media ${device['landscape-tablets']} {
44
+ text-align: left;
45
+ }
46
+ }
47
+
48
+ &__body {
49
+ font-family: var(--font-sans);
50
+ font-size: 16px;
51
+ line-height: 22px;
52
+
53
+ a {
54
+ color: var(--primary-main-light-1);
55
+ font-weight: 400 !important;
56
+ }
57
+ }
58
+ }
59
+
60
+ .guidelines-section__image {
61
+ flex-basis: 50%;
62
+ margin-bottom: 2rem;
63
+
64
+ &.big-devices {
65
+ display: none;
66
+
67
+ @media ${device['landscape-tablets']} {
68
+ display: flex;
69
+ }
70
+ }
71
+
72
+ &.is-mobile {
73
+ display: none;
74
+
75
+ @media ${device['landscape-tablets']} {
76
+ display: none;
77
+ }
78
+
79
+ img {
80
+ display: none;
81
+ }
82
+ }
83
+ }
84
+
85
+ .guidelines-section-detail {
86
+ display: flex;
87
+ flex-direction: column;
88
+ gap: 1.5rem;
89
+ margin: 2rem 0 1rem 0;
90
+
91
+ @media ${device.laptop} {
92
+ flex-direction: row;
93
+ }
94
+
95
+ &__item {
96
+ display: flex;
97
+ flex: 1;
98
+ flex-direction: column;
99
+ background: var(--others-white);
100
+ border-radius: 0.5rem;
101
+ padding: 1.5rem;
102
+
103
+ &__image {
104
+ width: 100%;
105
+ border-radius: 0.5rem;
106
+ }
107
+
108
+ &__title {
109
+ font-family: var(--font-serif);
110
+ font-style: normal;
111
+ font-weight: 400;
112
+ font-size: 24px;
113
+ line-height: 32px;
114
+ letter-spacing: -0.3px;
115
+ color: var(--neutral-neutral-1);
116
+ margin: 1.5rem 0 1rem 0;
117
+ }
118
+
119
+ ul {
120
+ list-style-type: disc;
121
+ }
122
+
123
+ ol {
124
+ list-style-type: decimal;
125
+ }
126
+
127
+ ul,
128
+ ol {
129
+ margin-left: 1rem;
130
+ margin-bottom: 1rem;
131
+
132
+ li {
133
+ margin-bottom: 0;
134
+ }
135
+ }
136
+ }
137
+ }
138
+ `;
@@ -1,20 +1,20 @@
1
- @import '../../../globalStyles/variables.scss';
2
- @import '../../../globalStyles/mediaqueries.scss';
1
+ import { device } from '../../../globalStyles/breakpoints'
2
+ import styled from 'styled-components'
3
3
 
4
- .guidelines-section {
5
- &-main {
4
+ export const GuideslinesContentStyled = styled.div`
5
+ .guidelines-section-main {
6
6
  display: flex;
7
7
  flex-direction: column;
8
8
  flex-wrap: nowrap;
9
9
  padding: 1.5rem;
10
10
 
11
- @include laptop {
11
+ @media ${device.laptop} {
12
12
  flex-direction: row;
13
13
  padding: 0;
14
14
  }
15
15
  }
16
16
 
17
- &__texts {
17
+ .guidelines-section__texts {
18
18
  flex-basis: 50%;
19
19
  display: flex;
20
20
  flex-direction: column;
@@ -26,7 +26,7 @@
26
26
  font-weight: 400;
27
27
  letter-spacing: -0.3px;
28
28
 
29
- @include landscape-tablets {
29
+ @media ${device['landscape-tablets']} {
30
30
  margin-left: 3rem;
31
31
  margin-bottom: 0;
32
32
  }
@@ -41,7 +41,7 @@
41
41
  line-height: 42px;
42
42
  letter-spacing: -0.3px;
43
43
 
44
- @include landscape-tablets {
44
+ @media ${device['landscape-tablets']} {
45
45
  text-align: left;
46
46
  }
47
47
  }
@@ -58,14 +58,14 @@
58
58
  }
59
59
  }
60
60
 
61
- &__image {
61
+ .guidelines-section__image {
62
62
  flex-basis: 50%;
63
63
  margin-bottom: 2rem;
64
64
 
65
65
  &.big-devices {
66
66
  display: none;
67
67
 
68
- @include landscape-tablets {
68
+ @media ${device['landscape-tablets']} {
69
69
  display: flex;
70
70
  }
71
71
  }
@@ -73,7 +73,7 @@
73
73
  &.is-mobile {
74
74
  display: none;
75
75
 
76
- @include landscape-tablets {
76
+ @media ${device['landscape-tablets']} {
77
77
  display: none;
78
78
  }
79
79
 
@@ -83,13 +83,13 @@
83
83
  }
84
84
  }
85
85
 
86
- &-detail {
86
+ .guidelines-section-detail {
87
87
  display: flex;
88
88
  flex-direction: column;
89
89
  gap: 1.5rem;
90
90
  margin: 2rem 0 1rem 0;
91
91
 
92
- @include laptop {
92
+ @media ${device.laptop} {
93
93
  flex-direction: row;
94
94
  }
95
95
 
@@ -97,7 +97,7 @@
97
97
  display: flex;
98
98
  flex: 1;
99
99
  flex-direction: column;
100
- background: get-color(others, white);
100
+ background: var(--others-white);
101
101
  border-radius: 0.5rem;
102
102
  padding: 1.5rem;
103
103
 
@@ -107,13 +107,13 @@
107
107
  }
108
108
 
109
109
  &__title {
110
- font-family: $font-serif;
110
+ font-family: var(--font-serif);
111
111
  font-style: normal;
112
112
  font-weight: 400;
113
113
  font-size: 24px;
114
114
  line-height: 32px;
115
115
  letter-spacing: -0.3px;
116
- color: get-color(neutral, neutral-1);
116
+ color: var(--neutral-neutral-1);
117
117
  margin: 1.5rem 0 1rem 0;
118
118
  }
119
119
 
@@ -136,4 +136,4 @@
136
136
  }
137
137
  }
138
138
  }
139
- }
139
+ `
@@ -3,11 +3,11 @@ import React, { type FC } from 'react'
3
3
 
4
4
  import { RichTextInner, RichTextStrapi } from '../../atoms'
5
5
  import { type GuidelinesContentProps } from './GuidelinesContentProps.types'
6
- // import './GuidelinesContent.scss'
6
+ import { GuideslinesContentStyled } from './GuidelinesContent.styled'
7
7
 
8
8
  const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, detail, children }) => {
9
9
  return (
10
- <>
10
+ <GuideslinesContentStyled>
11
11
  <div className='guidelines-section-main wrapper'>
12
12
  <div className='guidelines-section__image big-devices'>{image}</div>
13
13
  <div className='guidelines-section__texts'>
@@ -27,7 +27,7 @@ const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, detail, c
27
27
  ))}
28
28
  </div>
29
29
  )}
30
- </>
30
+ </GuideslinesContentStyled>
31
31
  )
32
32
  }
33
33
 
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { JumbotronRatafiaStyled } from './JumbotronRatafiaContent.styled';
2
3
  import { TagsRatafiaList } from '../../molecules';
3
- // import './JumbotronRatafiaContent.scss'
4
4
  const JumbotronRatafiaContent = ({ title, body, tags }) => {
5
- return (_jsxs("div", { className: 'jumbotron-ratafia-content', children: [_jsx("div", { className: 'jumbotron-ratafia-content__title', children: title }), _jsx("span", { className: 'sans-serif --medium jumbotron-ratafia-content__description', itemProp: 'text', children: body }), _jsx(TagsRatafiaList, { tags: tags })] }));
5
+ return (_jsxs(JumbotronRatafiaStyled, { children: [_jsx("div", { className: 'jumbotron-ratafia-content__title', children: title }), _jsx("span", { className: 'sans-serif --medium jumbotron-ratafia-content__description', itemProp: 'text', children: body }), _jsx(TagsRatafiaList, { tags: tags })] }));
6
6
  };
7
7
  export default JumbotronRatafiaContent;
@@ -0,0 +1 @@
1
+ export declare const JumbotronRatafiaStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -0,0 +1,26 @@
1
+ import styled from 'styled-components';
2
+ export const JumbotronRatafiaStyled = styled.div `
3
+ display: flex;
4
+ flex-direction: column;
5
+ align-items: flex-start;
6
+ gap: 1rem;
7
+
8
+ .jumbotron-ratafia-content__title {
9
+ &__text {
10
+ line-height: 2.25rem;
11
+ font-size: 2rem;
12
+ font-family: 'Inter', sans-serif;
13
+ color: var(--others-white);
14
+
15
+ &__icon {
16
+ padding: 0 0.6rem;
17
+ border-radius: 4px;
18
+ color: var(--primary-main-dark-2);
19
+ background: var(--secondary-main-light-2);
20
+ }
21
+ }
22
+ }
23
+ .jumbotron-ratafia-content__description {
24
+ color: var(--others-white);
25
+ }
26
+ `;
@@ -1,13 +1,12 @@
1
- @import '../../../globalStyles/variables.scss';
2
- @import '../../../globalStyles/mediaqueries.scss';
1
+ import styled from 'styled-components'
3
2
 
4
- .jumbotron-ratafia-content {
3
+ export const JumbotronRatafiaStyled = styled.div`
5
4
  display: flex;
6
5
  flex-direction: column;
7
6
  align-items: flex-start;
8
7
  gap: 1rem;
9
8
 
10
- &__title {
9
+ .jumbotron-ratafia-content__title {
11
10
  &__text {
12
11
  line-height: 2.25rem;
13
12
  font-size: 2rem;
@@ -18,11 +17,11 @@
18
17
  padding: 0 0.6rem;
19
18
  border-radius: 4px;
20
19
  color: var(--primary-main-dark-2);
21
- background: get-color(secondary, main-light-2);
20
+ background: var(--secondary-main-light-2);
22
21
  }
23
22
  }
24
23
  }
25
- &__description {
24
+ .jumbotron-ratafia-content__description {
26
25
  color: var(--others-white);
27
26
  }
28
- }
27
+ `
@@ -1,18 +1,18 @@
1
1
  import React, { type FC } from 'react'
2
2
 
3
3
  import { type JumbotronRatafiaContentProps } from './JumbotronRatafiaContentProps.types'
4
+ import { JumbotronRatafiaStyled } from './JumbotronRatafiaContent.styled'
4
5
  import { TagsRatafiaList } from '../../molecules'
5
- // import './JumbotronRatafiaContent.scss'
6
6
 
7
7
  const JumbotronRatafiaContent: FC<JumbotronRatafiaContentProps> = ({ title, body, tags }) => {
8
8
  return (
9
- <div className='jumbotron-ratafia-content'>
9
+ <JumbotronRatafiaStyled>
10
10
  <div className='jumbotron-ratafia-content__title'>{title}</div>
11
11
  <span className='sans-serif --medium jumbotron-ratafia-content__description' itemProp='text'>
12
12
  {body}
13
13
  </span>
14
14
  <TagsRatafiaList tags={tags} />
15
- </div>
15
+ </JumbotronRatafiaStyled>
16
16
  )
17
17
  }
18
18
 
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- // import './KeyFactsLoadingContentRatafia.scss'
2
+ import { KeyFactsLoadingContentRatafiaStyled } from './KeyFactsLoadingContentRatafia.styled';
3
3
  export const KeyFactsLoadingContentRatafia = ({ documentName, icon, text }) => {
4
- return (_jsxs("div", { className: 'key-facts-loading-content', children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-loading-content__document-name', children: documentName }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper', children: [_jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-1', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-2', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-5' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-3', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-7' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-4', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-8' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] })] }), _jsxs("div", { className: 'key-facts-loading-content__message', children: [_jsx("div", { className: 'key-facts-loading-content__message__icon', children: icon }), _jsx("span", { className: 'sans-serif --medium key-facts-loading-content__message__text', children: text })] })] }));
4
+ return (_jsxs(KeyFactsLoadingContentRatafiaStyled, { children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-loading-content__document-name', children: documentName }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper', children: [_jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-1', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-2', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-5' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-3', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-1' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-7' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-4' })] }), _jsxs("div", { className: 'key-facts-loading-content__animation-wrapper__animation animation-4', children: [_jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-3' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-8' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-2' }), _jsx("div", { className: 'key-facts-loading-content__animation-wrapper__animation__loader item-6' })] })] }), _jsxs("div", { className: 'key-facts-loading-content__message', children: [_jsx("div", { className: 'key-facts-loading-content__message__icon', children: icon }), _jsx("span", { className: 'sans-serif --medium key-facts-loading-content__message__text', children: text })] })] }));
5
5
  };
6
6
  export default KeyFactsLoadingContentRatafia;
@@ -0,0 +1 @@
1
+ export declare const KeyFactsLoadingContentRatafiaStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -0,0 +1,144 @@
1
+ import { device } from '../../../globalStyles/breakpoints';
2
+ import styled from 'styled-components';
3
+ export const KeyFactsLoadingContentRatafiaStyled = styled.div `
4
+ display: flex;
5
+ flex-direction: column;
6
+ align-items: flex-start;
7
+ align-self: stretch;
8
+ gap: 1rem;
9
+
10
+ .key-facts-loading-content__document-name {
11
+ color: var(--neutral-neutral-2);
12
+ font-size: 1rem;
13
+ @media ${device['portrait-tablets']} {
14
+ font-size: 1.125rem;
15
+ }
16
+ }
17
+
18
+ .key-facts-loading-content__animation-wrapper {
19
+ height: calc(0.54 * 100vh);
20
+
21
+ align-self: stretch;
22
+
23
+ padding: 0 2rem 1.5rem 1.5rem;
24
+
25
+ overflow: hidden;
26
+
27
+ border-radius: 4px;
28
+ border-top: 4px solid var(--neutral-neutral-6);
29
+ border-bottom: 4px solid var(--neutral-neutral-6);
30
+ background: var(--neutral-neutral-6);
31
+
32
+ @media ${device['portrait-tablets']} {
33
+ height: 490px;
34
+ }
35
+
36
+ &__animation {
37
+ display: flex;
38
+ flex-direction: column;
39
+ align-items: flex-start;
40
+ justify-content: center;
41
+
42
+ gap: 0.8rem;
43
+
44
+ padding: 2rem 0;
45
+
46
+ border-bottom: 1px solid var(--neutral-neutral-4);
47
+ &__loader {
48
+ background: var(--neutral-neutral-4);
49
+ border-radius: 16px;
50
+ }
51
+ .item-1 {
52
+ height: 10px;
53
+ width: 45%;
54
+ }
55
+ .item-2 {
56
+ height: 7px;
57
+ width: 30%;
58
+ }
59
+ .item-3 {
60
+ height: 10px;
61
+ width: 25%;
62
+ }
63
+ .item-4 {
64
+ height: 7px;
65
+ width: 70%;
66
+ }
67
+ .item-5 {
68
+ height: 7px;
69
+ width: 55%;
70
+ }
71
+ .item-6 {
72
+ height: 7px;
73
+ width: 65%;
74
+ }
75
+ .item-7 {
76
+ height: 7px;
77
+ width: 90%;
78
+ }
79
+ .item-8 {
80
+ height: 7px;
81
+ width: 90%;
82
+ }
83
+ }
84
+ .animation-1 {
85
+ animation:
86
+ appear 4s ease-in-out 1,
87
+ fadeInOut 4s ease-in-out infinite 4s;
88
+ }
89
+ .animation-2 {
90
+ animation:
91
+ appear 5s ease-in-out 1,
92
+ fadeInOut 4s ease-in-out infinite 4s;
93
+ }
94
+ .animation-3 {
95
+ animation:
96
+ appear 6s ease-in-out 1,
97
+ fadeInOut 4s ease-in-out infinite 4s;
98
+ }
99
+ .animation-4 {
100
+ animation:
101
+ appear 6s ease-in-out 1,
102
+ fadeInOut 4s ease-in-out infinite 4s;
103
+ }
104
+ }
105
+
106
+ .key-facts-loading-content__message {
107
+ display: flex;
108
+ justify-content: start;
109
+ align-items: flex-start;
110
+ align-self: stretch;
111
+
112
+ padding: 1rem;
113
+ gap: 0.5rem;
114
+
115
+ border-radius: 4px;
116
+ background: var(--secondary-main-light-4);
117
+
118
+ &__icon img {
119
+ width: 24px;
120
+ }
121
+ &__text {
122
+ color: var(--neutral-neutral-1);
123
+ }
124
+ }
125
+
126
+ @keyframes fadeInOut {
127
+ 0%,
128
+ 100% {
129
+ opacity: 1;
130
+ }
131
+ 50% {
132
+ opacity: 0.2;
133
+ }
134
+ }
135
+
136
+ @keyframes appear {
137
+ 0% {
138
+ opacity: 0;
139
+ }
140
+ 100% {
141
+ opacity: 1;
142
+ }
143
+ }
144
+ `;
@@ -1,23 +1,22 @@
1
- @import '../../../globalStyles/variables.scss';
2
- @import '../../../globalStyles/mediaqueries.scss';
1
+ import { device } from '../../../globalStyles/breakpoints'
2
+ import styled from 'styled-components'
3
3
 
4
- .key-facts-loading-content {
4
+ export const KeyFactsLoadingContentRatafiaStyled = styled.div`
5
5
  display: flex;
6
6
  flex-direction: column;
7
7
  align-items: flex-start;
8
8
  align-self: stretch;
9
-
10
9
  gap: 1rem;
11
10
 
12
- &__document-name {
11
+ .key-facts-loading-content__document-name {
13
12
  color: var(--neutral-neutral-2);
14
13
  font-size: 1rem;
15
- @include portrait-tablets {
14
+ @media ${device['portrait-tablets']} {
16
15
  font-size: 1.125rem;
17
16
  }
18
17
  }
19
18
 
20
- &__animation-wrapper {
19
+ .key-facts-loading-content__animation-wrapper {
21
20
  height: calc(0.54 * 100vh);
22
21
 
23
22
  align-self: stretch;
@@ -31,7 +30,7 @@
31
30
  border-bottom: 4px solid var(--neutral-neutral-6);
32
31
  background: var(--neutral-neutral-6);
33
32
 
34
- @include portrait-tablets {
33
+ @media ${device['portrait-tablets']} {
35
34
  height: 490px;
36
35
  }
37
36
 
@@ -105,7 +104,7 @@
105
104
  }
106
105
  }
107
106
 
108
- &__message {
107
+ .key-facts-loading-content__message {
109
108
  display: flex;
110
109
  justify-content: start;
111
110
  align-items: flex-start;
@@ -124,23 +123,23 @@
124
123
  color: var(--neutral-neutral-1);
125
124
  }
126
125
  }
127
- }
128
126
 
129
- @keyframes fadeInOut {
130
- 0%,
131
- 100% {
132
- opacity: 1;
133
- }
134
- 50% {
135
- opacity: 0.2;
127
+ @keyframes fadeInOut {
128
+ 0%,
129
+ 100% {
130
+ opacity: 1;
131
+ }
132
+ 50% {
133
+ opacity: 0.2;
134
+ }
136
135
  }
137
- }
138
136
 
139
- @keyframes appear {
140
- 0% {
141
- opacity: 0;
142
- }
143
- 100% {
144
- opacity: 1;
137
+ @keyframes appear {
138
+ 0% {
139
+ opacity: 0;
140
+ }
141
+ 100% {
142
+ opacity: 1;
143
+ }
145
144
  }
146
- }
145
+ `
@@ -1,7 +1,7 @@
1
1
  import React from 'react'
2
2
 
3
3
  import { type KeyFactsLoadingContentRatafiaProps } from './KeyFactsLoadingContentRatafiaProps.types'
4
- // import './KeyFactsLoadingContentRatafia.scss'
4
+ import { KeyFactsLoadingContentRatafiaStyled } from './KeyFactsLoadingContentRatafia.styled'
5
5
 
6
6
  export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRatafiaProps> = ({
7
7
  documentName,
@@ -9,7 +9,7 @@ export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRataf
9
9
  text
10
10
  }) => {
11
11
  return (
12
- <div className='key-facts-loading-content'>
12
+ <KeyFactsLoadingContentRatafiaStyled>
13
13
  <h2 className='sans-serif --bold-weight key-facts-loading-content__document-name'>{documentName}</h2>
14
14
  <div className='key-facts-loading-content__animation-wrapper'>
15
15
  <div className='key-facts-loading-content__animation-wrapper__animation animation-1'>
@@ -39,7 +39,7 @@ export const KeyFactsLoadingContentRatafia: React.FC<KeyFactsLoadingContentRataf
39
39
  <div className='key-facts-loading-content__message__icon'>{icon}</div>
40
40
  <span className='sans-serif --medium key-facts-loading-content__message__text'>{text}</span>
41
41
  </div>
42
- </div>
42
+ </KeyFactsLoadingContentRatafiaStyled>
43
43
  )
44
44
  }
45
45
 
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { KeyFactCardListRatafia } from '../../molecules';
3
+ import { KeyFactsResultContentRatafiaStyled } from './KeyFactsResultContentRatafia.styled';
3
4
  import { ReviewKeyFactsResultRatafia } from '../../atoms';
4
- // import './KeyFactsResultContentRatafia.scss'
5
5
  export const KeyFactsResultContentRatafia = ({ result, review }) => {
6
- return (_jsxs("div", { className: 'key-facts-result-content', children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-result-content__document-name', children: result?.documentName }), _jsxs("div", { className: 'key-facts-result-content__content', children: [result !== null && _jsx(KeyFactCardListRatafia, { keyFacts: result.keyFacts }), _jsx(ReviewKeyFactsResultRatafia, { ...review })] })] }));
6
+ return (_jsxs(KeyFactsResultContentRatafiaStyled, { children: [_jsx("h2", { className: 'sans-serif --bold-weight key-facts-result-content__document-name', children: result?.documentName }), _jsxs("div", { className: 'key-facts-result-content__content', children: [result !== null && _jsx(KeyFactCardListRatafia, { keyFacts: result.keyFacts }), _jsx(ReviewKeyFactsResultRatafia, { ...review })] })] }));
7
7
  };
8
8
  export default KeyFactsResultContentRatafia;
@@ -0,0 +1 @@
1
+ export declare const KeyFactsResultContentRatafiaStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;