✨ Nouveaux logos

site/dev-server.js

@@ -19,7 +19,7 @@ app.get('/', function (req, res) {
 	res.send(`<ul style="font-size: 200%;"><li><a href="/mon-entreprise">mon-entreprise [fr]</a></li>
 	<li><a href="/infrance">mycompanyinfrance [en]</a></li>
 	<li><a href="/mon-entreprise/dev/integration-test">intégration du simulateur sur site tiers [iframe fr]</a></li>
-	<li><a href="/publicodes">publicodes</a></li></ul>`)
+	</ul>`)
 })
 
 app.use(

site/source/components/layout/Header.tsx

@@ -2,7 +2,8 @@ import SearchButton from 'Components/SearchButton'
 import { SitePathsContext } from 'Components/utils/SitePathsContext'
 import { Container } from 'DesignSystem/layout'
 import { Link } from 'DesignSystem/typography/link'
-import logoSvg from 'Images/logo.svg'
+import logoSvgFR from 'Images/logo-monentreprise.svg'
+import logoSvgEN from 'Images/logo-mycompany.svg'
 import { useContext } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
@@ -12,13 +13,17 @@ export default function Header() {
 	const sitePaths = useContext(SitePathsContext)
 	const {
 		i18n: { language },
-		t,
 	} = useTranslation()
 	return (
 		<Container>
 			<StyledHeader>
 				<Link to={sitePaths.index}>
-					<img alt="Service mon-entreprise urssaf" src={logoSvg} />
+					{/* Figma source: https://www.figma.com/file/YJUpRNO12lcPUDsEYEXzT9/logo-monentreprisee-urssaf-edition */}
+					{language === 'fr' ? (
+						<Logo alt="Logo Mon-entreprise, site Urssaf" src={logoSvgFR} />
+					) : (
+						<Logo alt="Logo Mycompanyinfrance by Urssaf" src={logoSvgEN} />
+					)}
 				</Link>
 
 				<div
@@ -41,10 +46,16 @@ const StyledHeader = styled.div`
 	gap: ${({ theme }) => theme.spacings.xs};
 	a {
 		height: 100%;
-	}
-	img {
-		height: 100%;
-		padding: 0;
+		display: flex;
+		align-items: center;
 	}
 	margin: ${({ theme }) => theme.spacings.sm} 0;
 `
+
+const Logo = styled.img`
+	height: 70%;
+
+	@media (min-width: ${({ theme }) => theme.breakpointsWidth.sm}) {
+		height: 80%;
+	}
+`