betagouv
/
mon-entreprise
mirror of https://github.com/betagouv/mon-entreprise
1
0
Fork 0
Code Releases Activity

💄 Update colors of footers 

Co-authored-by: Félix Legrelle <legrelle.f@gmail.com>
pull/2360/head
Lucas Stoebner 2022-10-26 11:29:20 +02:00 committed by Johan Girod
parent 0544f7c923
commit e72ea4a19c
4 changed files with 51 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
site/source/components/layout/Footer/Footer.tsx
View File

@ -53,7 +53,11 @@ export default function Footer() {
/>
<footer>
<Container
backgroundColor={(theme) => theme.colors.bases.tertiary[100]}
backgroundColor={(theme) =>
theme.darkMode
? theme.colors.extended.dark[600]
: theme.colors.bases.tertiary[100]
}
>
{showFeedback && <PageFeedback />}
{language === 'en' && (

62
site/source/design-system/card/Card.tsx
View File

@ -50,33 +50,31 @@ export function Card({
delete buttonOrLinkProps.title
return (
<ThemeProvider theme={(theme) => ({ ...theme, darkMode: false })}>
<CardContainer $compact={compact} {...buttonOrLinkProps} tabIndex={0}>
{icon && <IconContainer>{icon}</IconContainer>}
{title &&
(compact ? (
<CompactStyledHeader {...titleProps} />
) : (
<StyledHeader {...titleProps} />
))}
<div
css={`
flex: 1;
text-align: center;
width: 100%;
`}
>
<Body as={bodyAs}>{children}</Body>
</div>
{ctaLabel && (
// The button is not selectable with keyboard navigation because the whole card already is
<CardButton tabIndex={-1} $size="XS" $light $color="primary" as="div">
{ctaLabel}
{linkProps.external && <NewWindowLinkIcon />}
</CardButton>
)}
</CardContainer>
</ThemeProvider>
<CardContainer $compact={compact} {...buttonOrLinkProps} tabIndex={0}>
{icon && <IconContainer>{icon}</IconContainer>}
{title &&
(compact ? (
<CompactStyledHeader {...titleProps} />
) : (
<StyledHeader {...titleProps} />
))}
<div
css={`
flex: 1;
text-align: center;
width: 100%;
`}
>
<Body as={bodyAs}>{children}</Body>
</div>
{ctaLabel && (
// The button is not selectable with keyboard navigation because the whole card already is
<CardButton tabIndex={-1} $size="XS" $light $color="primary" as="div">
{ctaLabel}
{linkProps.external && <NewWindowLinkIcon />}
</CardButton>
)}
</CardContainer>
)
}
@ -128,12 +126,18 @@ export const CardContainer = styled.div<{ $compact?: boolean }>`
cursor: pointer;
flex-direction: column;
align-items: center;
background-color: ${({ theme }) => theme.colors.extended.grey[100]};
background-color: ${({ theme }) =>
theme.darkMode
? theme.colors.extended.dark[600]
: theme.colors.extended.grey[100]};
border-radius: ${({ theme }) => theme.box.borderRadius};
box-shadow: ${({ theme }) => theme.elevations[2]};
&:hover {
box-shadow: ${({ theme }) => theme.elevations[3]};
background-color: ${({ theme }) => theme.colors.bases.primary[100]};
background-color: ${({ theme }) =>
theme.darkMode
? theme.colors.extended.dark[500]
: theme.colors.bases.primary[100]};
}
&:focus,
&:focus-visible {

9
site/source/pages/Landing/Landing.tsx
View File

@ -101,7 +101,14 @@ export default function Landing() {
</Grid>
<Spacing xl />
</Container>
<Container backgroundColor={(theme) => theme.colors.bases.primary[100]}>
<Container
backgroundColor={(theme) =>
theme.darkMode
? theme.colors.extended.dark[700]
: theme.colors.bases.primary[100]
}
>
{' '}
<Spacing lg />
<Grid
container

6
site/source/pages/gerer/declaration-revenu-independants/cotisations.tsx
View File

@ -144,7 +144,11 @@ export default function Cotisations() {
</Container>
<Container
backgroundColor={(theme) => theme.colors.bases.tertiary[100]}
backgroundColor={(theme) =>
theme.darkMode
? theme.colors.extended.dark[600]
: theme.colors.bases.tertiary[100]
}
>
<PageFeedback customMessage="Qu'avez-vous pensé de cet assistant ?" />
</Container>