diff --git a/src/components/ContentComponents/NegaWattModal/NegaWattModal.tsx b/src/components/ContentComponents/NegaWattModal/NegaWattModal.tsx index 2518587301c2f898be9e06b12a7d983c81a87a8a..4feb4141d00ec47e1a334546703db1e78b9edc59 100644 --- a/src/components/ContentComponents/NegaWattModal/NegaWattModal.tsx +++ b/src/components/ContentComponents/NegaWattModal/NegaWattModal.tsx @@ -21,18 +21,24 @@ const NegaWattModal: React.FC<NegaWattModalProps> = ({ {t('NEGAWATT.TITLE_NEGAWATT')} </div> <div className="em-content-box"> - <div className="em-title text-24-bold "> - Que sont les néga Watt heure ? - </div> - <div className="em-description text-16"> - {t('NEGAWATT.ANSWER.BASE')} - <br /> - <br /> - {t('NEGAWATT.ANSWER.STRONG')} - <br /> - {t('NEGAWATT.ANSWER.MEDIUM')} - <br /> - {t('NEGAWATT.ANSWER.WEAK')} + <div className="em-content-box-text"> + <div className="em-title text-19-bold "> + Que sont les néga Watt heure ? + </div> + <div className="em-description-2 text-16"> + {t('NEGAWATT.ANSWER.BASE')} + </div> + <div className="em-description-2 text-16"> + <div className="em-description-3"> + {t('NEGAWATT.ANSWER.STRONG')} + </div> + <div className="em-description-3"> + {t('NEGAWATT.ANSWER.MEDIUM')} + </div> + <div className="em-description-3"> + {t('NEGAWATT.ANSWER.WEAK')} + </div> + </div> </div> </div> </Modal> diff --git a/src/styles/base/_typography.scss b/src/styles/base/_typography.scss index f07f4bda52237789f9778ca85ec1d0de30b71f31..a65a2f753f28ddfdf0a9bbead7f459c8999c5dfc 100644 --- a/src/styles/base/_typography.scss +++ b/src/styles/base/_typography.scss @@ -107,6 +107,13 @@ p { font-size: 1.125rem; line-height: 120%; } +.text-19-bold { + font-family: $text-font; + font-style: normal; + font-weight: bold; + font-size: 1.188rem; + line-height: 120%; +} .text-20-bold { font-family: $text-font; font-style: normal; diff --git a/src/styles/components/_ecogesture.scss b/src/styles/components/_ecogesture.scss index 097270835eb06ad3ec37548ccdbe8daa7affe49e..3d1ca1f2674825ab90f7d294e046942ff639d1a7 100644 --- a/src/styles/components/_ecogesture.scss +++ b/src/styles/components/_ecogesture.scss @@ -164,5 +164,11 @@ .em-description { padding-bottom: 2.5rem; } + .em-description-2 { + padding-top: 2rem; + } + .em-description-3 { + padding-bottom: 0.5rem; + } } }