diff --git a/site/source/components/Notifications.tsx b/site/source/components/Notifications.tsx
index 838a231fa..06ac9c02e 100644
--- a/site/source/components/Notifications.tsx
+++ b/site/source/components/Notifications.tsx
@@ -8,6 +8,7 @@ import { hideNotification } from '@/actions/actions'
import { useEngine, useInversionFail } from '@/components/utils/EngineContext'
import { Message } from '@/design-system'
import { CloseButton } from '@/design-system/buttons'
+import { Body } from '@/design-system/typography/paragraphs'
import { RootState } from '@/reducers/rootReducer'
import RuleLink from './RuleLink'
@@ -77,14 +78,17 @@ export default function Notifications() {
key={dottedName}
>
{résumé ?? description ?? ''}{' '}
- {résumé && (
-
- En savoir plus
-
- )}
+
+ {résumé && (
+
+ En savoir plus
+
+ )}
+
dispatch(hideNotification(dottedName))}
+ color={sévérité === 'avertissement' ? 'tertiary' : 'primary'}
/>
))}
diff --git a/site/source/components/PageData.tsx b/site/source/components/PageData.tsx
index 26506ab2c..5a0aff9f6 100644
--- a/site/source/components/PageData.tsx
+++ b/site/source/components/PageData.tsx
@@ -7,6 +7,7 @@ import { useIsEmbedded } from '@/components/utils/useIsEmbedded'
import useSearchParamsSimulationSharing from '@/components/utils/useSearchParamsSimulationSharing'
import useSimulationConfig from '@/components/utils/useSimulationConfig'
import { Chip } from '@/design-system'
+import { Emoji } from '@/design-system/emoji'
import { Spacing } from '@/design-system/layout'
import { H1 } from '@/design-system/typography/heading'
import { Intro } from '@/design-system/typography/paragraphs'
@@ -85,12 +86,12 @@ export default function PageData(props: PageDataProps) {
{title}
{year && (
-
+ }>
{year}
)}
{beta && (
-
+ }>
Version bêta
)}
diff --git a/site/source/components/layout/NewsBanner.tsx b/site/source/components/layout/NewsBanner.tsx
index eaca3f6c3..1a2dcc8d1 100644
--- a/site/source/components/layout/NewsBanner.tsx
+++ b/site/source/components/layout/NewsBanner.tsx
@@ -5,6 +5,7 @@ import { Message } from '@/design-system'
import { CloseButton } from '@/design-system/buttons'
import { Emoji } from '@/design-system/emoji'
import { Link } from '@/design-system/typography/link'
+import { Body } from '@/design-system/typography/paragraphs'
import { useFetchData } from '@/hooks/useFetchData'
import { useSitePaths } from '@/sitePaths'
@@ -51,26 +52,41 @@ function NewsBanner({ lastRelease }: { lastRelease: LastRelease }) {
}
return (
- }>
- Découvrez les nouveautés
- {determinant(lastRelease.name)}
-
+ }
+ mini
+ border={false}
>
- {lastRelease.name.toLowerCase()}
-
- {
- setShowBanner(false)
- setItem(localStorageKey, lastRelease.name)
- }}
- aria-label={t('Fermer')}
- />
-
+
+ Découvrez les nouveautés {determinant(lastRelease.name)}
+
+ {lastRelease.name.toLowerCase()}
+
+ {
+ setShowBanner(false)
+ setItem(localStorageKey, lastRelease.name)
+ }}
+ aria-label={t('Fermer')}
+ />
+
+
+
)
}
diff --git a/site/source/design-system/chip/index.tsx b/site/source/design-system/chip/index.tsx
index 8a11f243c..d175a87d0 100644
--- a/site/source/design-system/chip/index.tsx
+++ b/site/source/design-system/chip/index.tsx
@@ -1,4 +1,5 @@
import React from 'react'
+import { useTranslation } from 'react-i18next'
import styled, { ThemeProvider, css } from 'styled-components'
import { Palette, SmallPalette } from '@/types/styled'
@@ -21,6 +22,8 @@ export function Chip({
children,
className,
}: ChipProps) {
+ const { t } = useTranslation()
+
return (
({ ...theme, darkMode: false })}>
@@ -29,11 +32,11 @@ export function Chip({
{typeof icon !== 'boolean' ? (
icon
) : type === 'success' ? (
-
+
) : type === 'error' ? (
-
+
) : type === 'info' ? (
-
+
) : (
<>
)}
diff --git a/site/source/design-system/message/index.tsx b/site/source/design-system/message/index.tsx
index 8c724d3f0..1fbb635c5 100644
--- a/site/source/design-system/message/index.tsx
+++ b/site/source/design-system/message/index.tsx
@@ -1,4 +1,5 @@
import React from 'react'
+import { useTranslation } from 'react-i18next'
import styled, { DefaultTheme, ThemeProvider, css } from 'styled-components'
import { Palette, SmallPalette } from '@/types/styled'
@@ -29,7 +30,12 @@ export function Message({
className,
role = undefined,
}: MessageProps) {
- if (typeof children !== 'object') {
+ const { t } = useTranslation()
+ if (
+ Array.isArray(children) &&
+ children.length === 1 &&
+ typeof children[0] === 'string'
+ ) {
children = {children}
}
@@ -48,11 +54,11 @@ export function Message({
{typeof icon !== 'boolean' ? (
icon
) : type === 'success' ? (
-
+
) : type === 'error' ? (
-
+
) : type === 'info' ? (
-
+
) : (
)}
diff --git a/site/source/design-system/typography/heading.tsx b/site/source/design-system/typography/heading.tsx
index deba023e7..986d9bf2e 100644
--- a/site/source/design-system/typography/heading.tsx
+++ b/site/source/design-system/typography/heading.tsx
@@ -8,6 +8,7 @@ const baseHeading = css`
theme.darkMode
? theme.colors.extended.grey[100]
: theme.colors.bases.primary[700]};
+ background-color: inherit;
`
export const HeadingUnderline = css`
diff --git a/site/source/pages/Simulateurs/Home.tsx b/site/source/pages/Simulateurs/Home.tsx
index 5472536c0..7c7f53046 100644
--- a/site/source/pages/Simulateurs/Home.tsx
+++ b/site/source/pages/Simulateurs/Home.tsx
@@ -242,7 +242,7 @@ export function SimulateurCard({
{shortName} {tooltip && {tooltip}}
{beta && (
-
+ }>
Bêta
)}
@@ -258,7 +258,7 @@ export function SimulateurCard({
<>
{shortName}
{beta && (
-
+ }>
Bêta
)}
diff --git a/site/source/pages/Simulateurs/Salarié.tsx b/site/source/pages/Simulateurs/Salarié.tsx
index 4cfab2a1b..1582f642f 100644
--- a/site/source/pages/Simulateurs/Salarié.tsx
+++ b/site/source/pages/Simulateurs/Salarié.tsx
@@ -160,7 +160,8 @@ function AidesGlimpse() {
displayedUnit="€"
unit={targetUnit}
/>{' '}
- d'aides
+ d'aides{' '}
+
diff --git a/site/source/pages/Simulateurs/metadata.tsx b/site/source/pages/Simulateurs/metadata.tsx
index 237ebd120..b1b0fb828 100644
--- a/site/source/pages/Simulateurs/metadata.tsx
+++ b/site/source/pages/Simulateurs/metadata.tsx
@@ -5,6 +5,7 @@ import styled, { css } from 'styled-components'
import { PlaceDesEntreprisesButton } from '@/components/PlaceDesEntreprises'
import RuleLink from '@/components/RuleLink'
+import { Message } from '@/design-system'
import { Emoji } from '@/design-system/emoji'
import { Strong } from '@/design-system/typography'
import { H2 } from '@/design-system/typography/heading'
@@ -226,12 +227,17 @@ function getSimulatorsData({ t, sitePaths, language }: SimulatorsDataParams) {
pour l'option micro-fiscal).