Add github link in footer
parent
368ff0f676
commit
9b950365f4
|
@ -1,7 +1,6 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import { Message, PopoverWithTrigger } from '@/design-system'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { Link, StyledLink } from '@/design-system/typography/link'
|
||||
import { Li, Ul } from '@/design-system/typography/list'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
|
|
|
@ -3,12 +3,11 @@ import { useLocation } from 'react-router-dom'
|
|||
|
||||
import { SmallCard } from '@/design-system/card'
|
||||
import { Emoji } from '@/design-system/emoji'
|
||||
import { GithubIcon } from '@/design-system/icons'
|
||||
import { Grid } from '@/design-system/layout'
|
||||
import { H2 } from '@/design-system/typography/heading'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
|
||||
import { icons } from './ui/SocialIcon'
|
||||
|
||||
export default function MoreInfosOnUs() {
|
||||
const { pathname } = useLocation()
|
||||
const { absoluteSitePaths } = useSitePaths()
|
||||
|
@ -57,22 +56,7 @@ export default function MoreInfosOnUs() {
|
|||
)}
|
||||
<Grid item xs={12} sm={6} md={4} role="listitem">
|
||||
<SmallCard
|
||||
icon={
|
||||
<svg
|
||||
viewBox="15 15 34 34"
|
||||
style={{
|
||||
width: '3rem',
|
||||
height: '3rem',
|
||||
margin: 0,
|
||||
}}
|
||||
aria-hidden
|
||||
role="img"
|
||||
>
|
||||
<g>
|
||||
<path d={icons.github.icon} />
|
||||
</g>
|
||||
</svg>
|
||||
}
|
||||
icon={<GithubIcon style={{ width: '2rem', height: '2rem' }} />}
|
||||
href="https://github.com/betagouv/mon-entreprise"
|
||||
title={<h3>Le code source</h3>}
|
||||
>
|
||||
|
|
|
@ -11,6 +11,7 @@ import { Button } from '@/design-system/buttons'
|
|||
import { Emoji } from '@/design-system/emoji'
|
||||
import { FooterContainer } from '@/design-system/footer'
|
||||
import { FooterColumn } from '@/design-system/footer/column'
|
||||
import { GithubIcon } from '@/design-system/icons'
|
||||
import { Container, Grid } from '@/design-system/layout'
|
||||
import { Link } from '@/design-system/typography/link'
|
||||
import { Body } from '@/design-system/typography/paragraphs'
|
||||
|
@ -152,6 +153,25 @@ export default function Footer() {
|
|||
<InscriptionBetaTesteur /> <Emoji emoji="💌" />
|
||||
</StyledLi>
|
||||
)}
|
||||
<StyledLi>
|
||||
<Link
|
||||
href="https://github.com/betagouv/mon-entreprise"
|
||||
noUnderline
|
||||
>
|
||||
<Trans i18nKey="footer.github.text">
|
||||
Voir le code source sur Github
|
||||
</Trans>{' '}
|
||||
<GithubIcon
|
||||
style={{
|
||||
width: '18px',
|
||||
height: '18px',
|
||||
margin: '0 0.2rem',
|
||||
verticalAlign: 'middle',
|
||||
fill: '#e6edf3',
|
||||
}}
|
||||
/>
|
||||
</Link>
|
||||
</StyledLi>
|
||||
{altHref && (
|
||||
<StyledLi key={altLang}>
|
||||
<Grid container spacing={2} role="list">
|
||||
|
|
|
@ -1,52 +0,0 @@
|
|||
import styled from 'styled-components'
|
||||
|
||||
export const icons = {
|
||||
facebook: {
|
||||
icon: 'M34.1,47V33.3h4.6l0.7-5.3h-5.3v-3.4c0-1.5,0.4-2.6,2.6-2.6l2.8,0v-4.8c-0.5-0.1-2.2-0.2-4.1-0.2 c-4.1,0-6.9,2.5-6.9,7V28H24v5.3h4.6V47H34.1z',
|
||||
mask: 'M0,0v64h64V0H0z M39.6,22l-2.8,0c-2.2,0-2.6,1.1-2.6,2.6V28h5.3l-0.7,5.3h-4.6V47h-5.5V33.3H24V28h4.6V24 c0-4.6,2.8-7,6.9-7c2,0,3.6,0.1,4.1,0.2V22z',
|
||||
label: 'Facebook',
|
||||
},
|
||||
twitter: {
|
||||
icon: 'M48,22.1c-1.2,0.5-2.4,0.9-3.8,1c1.4-0.8,2.4-2.1,2.9-3.6c-1.3,0.8-2.7,1.3-4.2,1.6 C41.7,19.8,40,19,38.2,19c-3.6,0-6.6,2.9-6.6,6.6c0,0.5,0.1,1,0.2,1.5c-5.5-0.3-10.3-2.9-13.5-6.9c-0.6,1-0.9,2.1-0.9,3.3 c0,2.3,1.2,4.3,2.9,5.5c-1.1,0-2.1-0.3-3-0.8c0,0,0,0.1,0,0.1c0,3.2,2.3,5.8,5.3,6.4c-0.6,0.1-1.1,0.2-1.7,0.2c-0.4,0-0.8,0-1.2-0.1 c0.8,2.6,3.3,4.5,6.1,4.6c-2.2,1.8-5.1,2.8-8.2,2.8c-0.5,0-1.1,0-1.6-0.1c2.9,1.9,6.4,2.9,10.1,2.9c12.1,0,18.7-10,18.7-18.7 c0-0.3,0-0.6,0-0.8C46,24.5,47.1,23.4,48,22.1z',
|
||||
mask: 'M0,0v64h64V0H0z M44.7,25.5c0,0.3,0,0.6,0,0.8C44.7,35,38.1,45,26.1,45c-3.7,0-7.2-1.1-10.1-2.9 c0.5,0.1,1,0.1,1.6,0.1c3.1,0,5.9-1,8.2-2.8c-2.9-0.1-5.3-2-6.1-4.6c0.4,0.1,0.8,0.1,1.2,0.1c0.6,0,1.2-0.1,1.7-0.2 c-3-0.6-5.3-3.3-5.3-6.4c0,0,0-0.1,0-0.1c0.9,0.5,1.9,0.8,3,0.8c-1.8-1.2-2.9-3.2-2.9-5.5c0-1.2,0.3-2.3,0.9-3.3 c3.2,4,8.1,6.6,13.5,6.9c-0.1-0.5-0.2-1-0.2-1.5c0-3.6,2.9-6.6,6.6-6.6c1.9,0,3.6,0.8,4.8,2.1c1.5-0.3,2.9-0.8,4.2-1.6 c-0.5,1.5-1.5,2.8-2.9,3.6c1.3-0.2,2.6-0.5,3.8-1C47.1,23.4,46,24.5,44.7,25.5z',
|
||||
label: 'Twitter',
|
||||
},
|
||||
linkedin: {
|
||||
icon: 'M20.4,44h5.4V26.6h-5.4V44z M23.1,18c-1.7,0-3.1,1.4-3.1,3.1c0,1.7,1.4,3.1,3.1,3.1 c1.7,0,3.1-1.4,3.1-3.1C26.2,19.4,24.8,18,23.1,18z M39.5,26.2c-2.6,0-4.4,1.4-5.1,2.8h-0.1v-2.4h-5.2V44h5.4v-8.6 c0-2.3,0.4-4.5,3.2-4.5c2.8,0,2.8,2.6,2.8,4.6V44H46v-9.5C46,29.8,45,26.2,39.5,26.2z',
|
||||
mask: 'M0,0v64h64V0H0z M25.8,44h-5.4V26.6h5.4V44z M23.1,24.3c-1.7,0-3.1-1.4-3.1-3.1c0-1.7,1.4-3.1,3.1-3.1 c1.7,0,3.1,1.4,3.1,3.1C26.2,22.9,24.8,24.3,23.1,24.3z M46,44h-5.4v-8.4c0-2,0-4.6-2.8-4.6c-2.8,0-3.2,2.2-3.2,4.5V44h-5.4V26.6 h5.2V29h0.1c0.7-1.4,2.5-2.8,5.1-2.8c5.5,0,6.5,3.6,6.5,8.3V44z',
|
||||
label: 'LinkedIn',
|
||||
},
|
||||
github: {
|
||||
icon: 'M32,16c-8.8,0-16,7.2-16,16c0,7.1,4.6,13.1,10.9,15.2 c0.8,0.1,1.1-0.3,1.1-0.8c0-0.4,0-1.4,0-2.7c-4.5,1-5.4-2.1-5.4-2.1c-0.7-1.8-1.8-2.3-1.8-2.3c-1.5-1,0.1-1,0.1-1 c1.6,0.1,2.5,1.6,2.5,1.6c1.4,2.4,3.7,1.7,4.7,1.3c0.1-1,0.6-1.7,1-2.1c-3.6-0.4-7.3-1.8-7.3-7.9c0-1.7,0.6-3.2,1.6-4.3 c-0.2-0.4-0.7-2,0.2-4.2c0,0,1.3-0.4,4.4,1.6c1.3-0.4,2.6-0.5,4-0.5c1.4,0,2.7,0.2,4,0.5c3.1-2.1,4.4-1.6,4.4-1.6 c0.9,2.2,0.3,3.8,0.2,4.2c1,1.1,1.6,2.5,1.6,4.3c0,6.1-3.7,7.5-7.3,7.9c0.6,0.5,1.1,1.5,1.1,3c0,2.1,0,3.9,0,4.4 c0,0.4,0.3,0.9,1.1,0.8C43.4,45.1,48,39.1,48,32C48,23.2,40.8,16,32,16z',
|
||||
mask: 'M0,0v64h64V0H0z M37.1,47.2c-0.8,0.2-1.1-0.3-1.1-0.8c0-0.5,0-2.3,0-4.4c0-1.5-0.5-2.5-1.1-3 c3.6-0.4,7.3-1.7,7.3-7.9c0-1.7-0.6-3.2-1.6-4.3c0.2-0.4,0.7-2-0.2-4.2c0,0-1.3-0.4-4.4,1.6c-1.3-0.4-2.6-0.5-4-0.5 c-1.4,0-2.7,0.2-4,0.5c-3.1-2.1-4.4-1.6-4.4-1.6c-0.9,2.2-0.3,3.8-0.2,4.2c-1,1.1-1.6,2.5-1.6,4.3c0,6.1,3.7,7.5,7.3,7.9 c-0.5,0.4-0.9,1.1-1,2.1c-0.9,0.4-3.2,1.1-4.7-1.3c0,0-0.8-1.5-2.5-1.6c0,0-1.6,0-0.1,1c0,0,1,0.5,1.8,2.3c0,0,0.9,3.1,5.4,2.1 c0,1.3,0,2.3,0,2.7c0,0.4-0.3,0.9-1.1,0.8C20.6,45.1,16,39.1,16,32c0-8.8,7.2-16,16-16c8.8,0,16,7.2,16,16 C48,39.1,43.4,45.1,37.1,47.2z',
|
||||
label: 'GitHub',
|
||||
},
|
||||
email: {
|
||||
icon: 'M17,22v20h30V22H17z M41.1,25L32,32.1L22.9,25H41.1z M20,39V26.6l12,9.3l12-9.3V39H20z',
|
||||
mask: 'M41.1,25H22.9l9.1,7.1L41.1,25z M44,26.6l-12,9.3l-12-9.3V39h24V26.6z M0,0v64h64V0H0z M47,42H17V22h30V42z',
|
||||
label: 'e-mail',
|
||||
},
|
||||
}
|
||||
|
||||
const FilledG = styled.g`
|
||||
fill: ${({ theme }) => theme.colors.bases.primary[700]};
|
||||
`
|
||||
|
||||
export default function SocialIcon({ media }: { media: keyof typeof icons }) {
|
||||
return (
|
||||
<svg
|
||||
viewBox="0 0 64 64"
|
||||
style={{
|
||||
fill: 'transparent',
|
||||
height: '2.5rem',
|
||||
margin: '0.6rem',
|
||||
fillRule: 'evenodd',
|
||||
}}
|
||||
role="img"
|
||||
>
|
||||
<FilledG>
|
||||
<path d={icons[media].icon} />
|
||||
</FilledG>
|
||||
</svg>
|
||||
)
|
||||
}
|
|
@ -402,3 +402,21 @@ export const WarningIcon = (props: HTMLAttributes<SVGElement>) => (
|
|||
/>
|
||||
</svg>
|
||||
)
|
||||
|
||||
export const GithubIcon = (props: HTMLAttributes<SVGElement>) => (
|
||||
<svg
|
||||
{...props}
|
||||
width="18"
|
||||
height="18"
|
||||
viewBox="15 15 34 34"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
aria-hidden
|
||||
role="img"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M32,16c-8.8,0-16,7.2-16,16c0,7.1,4.6,13.1,10.9,15.2 c0.8,0.1,1.1-0.3,1.1-0.8c0-0.4,0-1.4,0-2.7c-4.5,1-5.4-2.1-5.4-2.1c-0.7-1.8-1.8-2.3-1.8-2.3c-1.5-1,0.1-1,0.1-1 c1.6,0.1,2.5,1.6,2.5,1.6c1.4,2.4,3.7,1.7,4.7,1.3c0.1-1,0.6-1.7,1-2.1c-3.6-0.4-7.3-1.8-7.3-7.9c0-1.7,0.6-3.2,1.6-4.3 c-0.2-0.4-0.7-2,0.2-4.2c0,0,1.3-0.4,4.4,1.6c1.3-0.4,2.6-0.5,4-0.5c1.4,0,2.7,0.2,4,0.5c3.1-2.1,4.4-1.6,4.4-1.6 c0.9,2.2,0.3,3.8,0.2,4.2c1,1.1,1.6,2.5,1.6,4.3c0,6.1-3.7,7.5-7.3,7.9c0.6,0.5,1.1,1.5,1.1,3c0,2.1,0,3.9,0,4.4 c0,0.4,0.3,0.9,1.1,0.8C43.4,45.1,48,39.1,48,32C48,23.2,40.8,16,32,16z"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import { Trans, useTranslation } from 'react-i18next'
|
||||
|
||||
import PageHeader from '@/components/PageHeader'
|
||||
import { icons } from '@/components/ui/SocialIcon'
|
||||
import { Card } from '@/design-system/card'
|
||||
import { Emoji } from '@/design-system/emoji'
|
||||
import { GithubIcon } from '@/design-system/icons'
|
||||
import { Grid } from '@/design-system/layout'
|
||||
import { Body, Intro } from '@/design-system/typography/paragraphs'
|
||||
import { useSitePaths } from '@/sitePaths'
|
||||
|
@ -146,20 +146,7 @@ export default function Options() {
|
|||
<Grid item xs={12} md={6} lg={4}>
|
||||
<Card
|
||||
icon={
|
||||
<svg
|
||||
viewBox="15 15 34 34"
|
||||
style={{
|
||||
width: '1rem',
|
||||
height: '1rem',
|
||||
margin: 0,
|
||||
}}
|
||||
aria-hidden
|
||||
role="img"
|
||||
>
|
||||
<g style={{ fill: '#030303' }}>
|
||||
<path d={icons.github.icon} />
|
||||
</g>
|
||||
</svg>
|
||||
<GithubIcon style={{ width: '1.25rem', height: '1.25rem' }} />
|
||||
}
|
||||
title={t(
|
||||
'pages.développeur.choice.github.title',
|
||||
|
|
Loading…
Reference in New Issue