diff --git a/src/assets/icons/ico/question-mark.svg b/src/assets/icons/ico/question-mark.svg
deleted file mode 100644
index f703ce3c3a0ba16c2d0bce26c4c98c89971549c4..0000000000000000000000000000000000000000
--- a/src/assets/icons/ico/question-mark.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M16.5299 15.2345C16.7609 15.0245 17.0129 14.8285 17.2859 14.6465C17.5589 14.4645 17.8529 14.3035 18.1679 14.1635C18.4899 14.0235 18.8364 13.915 19.2074 13.838C19.5854 13.754 19.9914 13.712 20.4254 13.712C21.0064 13.712 21.5384 13.796 22.0214 13.964C22.5114 14.125 22.9314 14.3595 23.2814 14.6675C23.6384 14.9685 23.9149 15.336 24.1109 15.77C24.3069 16.197 24.4049 16.6765 24.4049 17.2085C24.4049 17.7405 24.3279 18.2025 24.1739 18.5945C24.0199 18.9795 23.8239 19.3155 23.5859 19.6025C23.3479 19.8895 23.0889 20.1415 22.8089 20.3585C22.5289 20.5685 22.2629 20.768 22.0109 20.957C21.7659 21.139 21.5524 21.3245 21.3704 21.5135C21.1954 21.6955 21.0904 21.8985 21.0554 22.1225L20.8349 23.6975H19.3019L19.1444 21.965C19.1094 21.636 19.1619 21.3525 19.3019 21.1145C19.4419 20.8765 19.6274 20.6525 19.8584 20.4425C20.0964 20.2325 20.3554 20.033 20.6354 19.844C20.9224 19.648 21.1884 19.431 21.4334 19.193C21.6784 18.955 21.8849 18.689 22.0529 18.395C22.2209 18.101 22.3049 17.7475 22.3049 17.3345C22.3049 17.0615 22.2524 16.8165 22.1474 16.5995C22.0424 16.3755 21.8954 16.1865 21.7064 16.0325C21.5174 15.8785 21.2969 15.7595 21.0449 15.6755C20.7929 15.5915 20.5199 15.5495 20.2259 15.5495C19.8129 15.5495 19.4629 15.5985 19.1759 15.6965C18.8889 15.7945 18.6439 15.903 18.4409 16.022C18.2379 16.134 18.0699 16.239 17.9369 16.337C17.8039 16.428 17.6919 16.4735 17.6009 16.4735C17.3839 16.4735 17.2229 16.379 17.1179 16.19L16.5299 15.2345ZM18.5459 27.698C18.5459 27.495 18.5809 27.306 18.6509 27.131C18.7279 26.949 18.8294 26.7915 18.9554 26.6585C19.0884 26.5255 19.2424 26.4205 19.4174 26.3435C19.5994 26.2665 19.7919 26.228 19.9949 26.228C20.1979 26.228 20.3869 26.2665 20.5619 26.3435C20.7439 26.4205 20.9014 26.5255 21.0344 26.6585C21.1674 26.7915 21.2724 26.949 21.3494 27.131C21.4264 27.306 21.4649 27.495 21.4649 27.698C21.4649 27.908 21.4264 28.1005 21.3494 28.2755C21.2724 28.4505 21.1674 28.6045 21.0344 28.7375C20.9014 28.8705 20.7439 28.972 20.5619 29.042C20.3869 29.119 20.1979 29.1575 19.9949 29.1575C19.7919 29.1575 19.5994 29.119 19.4174 29.042C19.2424 28.972 19.0884 28.8705 18.9554 28.7375C18.8294 28.6045 18.7279 28.4505 18.6509 28.2755C18.5809 28.1005 18.5459 27.908 18.5459 27.698Z" fill="white"/>
-<circle cx="20.5" cy="20.5" r="18" stroke="white"/>
-</svg>
diff --git a/src/components/FAQ/FAQLink.tsx b/src/components/FAQ/FAQLink.tsx
index 39dbdbdfed93739582710d09cab505c7a170dc8d..dbb62aa0a7a07b4ae24ca0b991d97dd9ba26e47e 100644
--- a/src/components/FAQ/FAQLink.tsx
+++ b/src/components/FAQ/FAQLink.tsx
@@ -4,7 +4,7 @@ import Link from '@material-ui/core/Link'
import { Link as RouterLink } from 'react-router-dom'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import QuestionMarkIcon from 'assets/icons/ico/question-mark.svg'
+import QuestionMarkIcon from 'assets/icons/ico/questionMark.svg'
import { useClient } from 'cozy-client'
import { UsageEventType } from 'enum/usageEvent.enum'
import UsageEventService from 'services/usageEvent.service'
diff --git a/src/components/FAQ/faqLink.scss b/src/components/FAQ/faqLink.scss
index 4dcfaf6adc757ab2650259706caca0be1971e25a..270865127a3360756bb611b54b36a37e220c3fd0 100644
--- a/src/components/FAQ/faqLink.scss
+++ b/src/components/FAQ/faqLink.scss
@@ -8,8 +8,8 @@
align-items: center;
justify-content: center;
padding: 0 1.5rem;
+ margin-top: 2rem;
.faq-content {
- margin-bottom: -1rem;
width: 45.75rem;
a {
color: $white;
@@ -19,8 +19,7 @@
width: 100%;
}
.faq-header {
- margin-top: 1.5rem;
- margin-bottom: 1.25rem;
+ margin-bottom: 1rem;
color: $grey-bright;
}
}
diff --git a/src/components/LegalNotice/legalNoticeLink.scss b/src/components/LegalNotice/legalNoticeLink.scss
index 21067f1035d1ed0140d7af4c033553c179127b45..c6eb9a42feb3c3b3f235ebbbc247001e65395bf0 100644
--- a/src/components/LegalNotice/legalNoticeLink.scss
+++ b/src/components/LegalNotice/legalNoticeLink.scss
@@ -8,11 +8,11 @@
align-items: center;
justify-content: center;
color: $white;
- padding: 1rem 1.5rem 0;
+ padding: 0 1.5rem;
margin-top: 2rem;
.legal-notice-header {
- margin-bottom: 1.25rem;
color: $grey-bright;
+ margin-bottom: 1rem;
}
.legal-notice-content {
max-width: 45.75rem;
diff --git a/src/components/Options/HelpLink.scss b/src/components/Options/HelpLink.scss
index 7046efa09ce216c0661785197782cec52cdf6ea4..9494f5d35ed23f1e58391233d104520c0398f710 100644
--- a/src/components/Options/HelpLink.scss
+++ b/src/components/Options/HelpLink.scss
@@ -7,8 +7,8 @@
align-items: center;
justify-content: center;
padding: 0 1.5rem;
+ margin-top: 1rem;
.help-content {
- margin-bottom: -1rem;
width: 45.75rem;
a {
color: $white;
@@ -18,9 +18,8 @@
width: 100%;
}
.help-header {
- margin-top: 1.5rem;
- margin-bottom: 1.25rem;
color: $grey-bright;
+ margin-bottom: 1rem;
}
}
}
@@ -41,6 +40,7 @@
flex-direction: row;
.help-card-content-icon {
margin: 0.5rem 0;
+ min-width: 42px;
}
.help-card-content-title {
margin: 0 1rem;
diff --git a/src/components/Options/HelpLink.tsx b/src/components/Options/HelpLink.tsx
index 495bea2f8af87ee3fc63b73b312427403673d465..f0f9d36c3ab9437d32dc502e90af6e87701d2dde 100644
--- a/src/components/Options/HelpLink.tsx
+++ b/src/components/Options/HelpLink.tsx
@@ -3,7 +3,7 @@ import './HelpLink.scss'
import Link from '@material-ui/core/Link'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
-import QuestionMarkIcon from 'assets/icons/ico/question-mark.svg'
+import QuestionMarkIcon from 'assets/icons/ico/questionMark.svg'
const HelpLink: React.FC = () => {
const { t } = useI18n()
diff --git a/src/components/Options/OptionsView.tsx b/src/components/Options/OptionsView.tsx
index a8e7ea2486a7bfd401247703c0a73e75700265a9..b180f4d13709dca030e303cc135206228c6e1f63 100644
--- a/src/components/Options/OptionsView.tsx
+++ b/src/components/Options/OptionsView.tsx
@@ -1,17 +1,17 @@
-import React, { useState } from 'react'
+import logos from 'assets/png/logos.png'
+import Content from 'components/Content/Content'
+import FAQLink from 'components/FAQ/FAQLink'
+import GCULink from 'components/GCU/GCULink'
import CozyBar from 'components/Header/CozyBar'
import Header from 'components/Header/Header'
-import Content from 'components/Content/Content'
+import LegalNoticeLink from 'components/LegalNotice/LegalNoticeLink'
import ExportOptions from 'components/Options/exportOptions'
import ReportOptions from 'components/Options/ReportOptions'
-import HelpLink from './HelpLink'
-import LegalNoticeLink from 'components/LegalNotice/LegalNoticeLink'
-import GCULink from 'components/GCU/GCULink'
import Version from 'components/Version/Version'
-import ProfileTypeOptions from './ProfileTypeOptions'
-
-import logos from 'assets/png/logos.png'
+import React, { useState } from 'react'
+import HelpLink from './HelpLink'
import { MatomoOptOut } from './MatomoOptOut'
+import ProfileTypeOptions from './ProfileTypeOptions'
const OptionsView: React.FC = () => {
const [headerHeight, setHeaderHeight] = useState<number>(0)
@@ -29,6 +29,7 @@ const OptionsView: React.FC = () => {
<ProfileTypeOptions />
<ExportOptions />
<ReportOptions />
+ <FAQLink />
<HelpLink />
<LegalNoticeLink />
<GCULink />
diff --git a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
index 1fcb358c2fd2fdfedf95ab7a6e2f06504c83460f..91ffa63224604baf3907a4db1eab2aecc99e189b 100644
--- a/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
+++ b/src/components/Options/__snapshots__/OptionsView.spec.tsx.snap
@@ -15,6 +15,7 @@ exports[`OptionsView component should be rendered correctly 1`] = `
<ProfileTypeOptions />
<ExportOptions />
<ReportOptions />
+ <FAQLink />
<HelpLink />
<LegalNoticeLink />
<GCULink />
diff --git a/src/components/Options/exportOptions.scss b/src/components/Options/exportOptions.scss
index f5b3e357e5435447b11631c819194e7d8e4ca96b..8493d2aae5396b76710bc5509848b1abbe039c7a 100644
--- a/src/components/Options/exportOptions.scss
+++ b/src/components/Options/exportOptions.scss
@@ -9,7 +9,8 @@ div.expansion-panel-root.Mui-expanded:last-child {
flex-direction: column;
align-items: center;
justify-content: center;
- padding: 0.5rem 1.5rem 0;
+ margin-top: 0.5rem;
+ padding: 0 1.5rem;
}
.export-option-content {
width: 45.75rem;
@@ -62,6 +63,6 @@ div.expansion-panel-root.Mui-expanded:last-child {
}
}
div.expansion-panel-summary {
- padding: 0 1.2rem;
+ padding: 0 0.938rem;
}
}
diff --git a/src/components/Options/profileTypeOptions.scss b/src/components/Options/profileTypeOptions.scss
index 819bdedbceba809b0215f4fb418dc1065935b208..2f3308aceca0e092961983682ce54512d245780b 100644
--- a/src/components/Options/profileTypeOptions.scss
+++ b/src/components/Options/profileTypeOptions.scss
@@ -2,7 +2,7 @@
@import 'src/styles/base/breakpoint';
.profile-type-root {
- margin-top: 2rem;
+ margin-top: 1.5rem;
padding: 0 1.5rem;
.profile-type-content {
margin: 0 auto;
@@ -14,6 +14,10 @@
height: 40px;
margin: 0;
}
+ .btn-secondary-negative {
+ border-color: $grey-bright;
+ height: 40px;
+ }
}
.value {
color: $white;
@@ -31,8 +35,7 @@
}
.head {
color: $grey-bright;
- margin-top: 1rem;
- margin-bottom: 1.25rem;
+ margin-bottom: 1rem;
}
.label {
color: $soft-grey;
@@ -75,7 +78,7 @@
}
}
div.expansion-panel-summary {
- padding: 0 1.2rem;
+ padding: 0 0.938rem;
}
.MuiCardContent-root {
padding: 0 1rem !important;
diff --git a/src/components/Options/reportOptions.scss b/src/components/Options/reportOptions.scss
index 78adb64fcd291ff3b933c70c44b4fe6c1cada7c7..b5ca2f087c7c3a71f41695aab6fd749acf9bfc38 100644
--- a/src/components/Options/reportOptions.scss
+++ b/src/components/Options/reportOptions.scss
@@ -6,7 +6,7 @@
align-items: center;
justify-content: center;
padding: 0 1.5rem;
- margin: 1rem 0;
+ margin-top: 2rem;
.report-option-content {
width: 45.75rem;
@media #{$large-phone} {
@@ -14,8 +14,8 @@
}
}
.head {
- margin: 1rem 0;
color: $grey-bright;
+ margin-bottom: 1rem;
}
.switch-container-bilan {
display: flex;
diff --git a/src/locales/fr.json b/src/locales/fr.json
index 5a9bf8c94ae86a08ac08ade542a365cd296b30c2..66c17cee0371c55215c42aa3fc56db53d8358900 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -419,7 +419,7 @@
"doing1_done": "Aucune astuce n’est indiquée comme déjà appliquée actuellement.",
"doing2": "Vous pouvez consulter toutes les astuces et ajouter celles que vous mettez déjà en pratique dans cette section.",
"doing2_done": "Vous pouvez consulter toutes les astuces et ajouter celles que vous mettez déjà en pratique dans cette section.",
- "btn1": "Voir tous les astuces",
+ "btn1": "Voir toutes les astuces",
"btn2": "Sélectionner"
},
"initModal": {
@@ -535,7 +535,7 @@
"button_ok": "Fermer la sélection"
},
"selectionModal": {
- "title": "Des astuces correspondantes à votre profil ont été trouvées\u00a0!",
+ "title": "Des astuces correspondant à votre profil ont été trouvées\u00a0!",
"text": "À vous de choisir celles que vous souhaitez mettre en objectif et celles que vous faites déjà.",
"button_close": "C'est parti !"
}
diff --git a/src/styles/components/_card.scss b/src/styles/components/_card.scss
index 76039f6ff8a063b297a93b7005a1af1f6bdcb503..5f37c3c5dc07455a2eae4387f044200bf829819d 100644
--- a/src/styles/components/_card.scss
+++ b/src/styles/components/_card.scss
@@ -5,7 +5,7 @@
box-sizing: border-box;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);
border-radius: 4px;
- margin-top: 1.5rem;
+ margin-top: 1rem;
padding: 16px;
&:hover {
background: $grey-linear-gradient-background-hover;