Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Corrige le déploiement #3191

Merged
merged 2 commits into from
Oct 29, 2024
Merged

Corrige le déploiement #3191

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1132e35
chore: corrige les tests e2e de preview pour correspondre à ceux de prod
liliced Oct 29, 2024
87c9d5a
a11y: rend la page budget accessible
liliced Oct 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/workflows/deploy.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -243,7 +243,7 @@ jobs:
matrix:
site: ['fr', 'en']
browser: [chrome] # Firefox is very slow…
viewport: [default]
viewport: [default, small]
container: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]
include:
- site: fr
Expand Down
82 changes: 42 additions & 40 deletions site/source/pages/budget/ResourcesAllocation.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import { sumAll } from 'effect/Number'
import { formatValue } from 'publicodes'
import { styled } from 'styled-components'

import { Body } from '@/design-system/typography/paragraphs'

const quarters = [
{ label: 'T1', 'aria-label': 'Trimestre 1' },
{ label: 'T2', 'aria-label': 'Trimestre 2' },
Expand Down Expand Up @@ -43,18 +45,14 @@ export default function ResourcesAllocation({ selectedYear, budget }: Props) {
}, {}) as Record<Quarter, Record<Total, number>>

return (
<div
style={{
overflowX: 'auto',
}}
>
<StyledTable role="table">
<StyledTable as="div" tabIndex={0}>
<table role="table">
<caption className="sr-only">
{`Tableau affichant le bugdet de l'année ${selectedYear} par poste de dépenses. La première colonne affiche l'année en cours (${selectedYear}) sur la première ligne puis les postes de dépenses et pour finir le total HT et total TTC. Les autres colonnes affichent les dépenses pour chaque trimestre. La dernière colonne affiche les totaux pour chaque poste de dépenses ainsi que les totaux HT et TTC agrégés.`}
</caption>
<thead>
<tr>
<th>{selectedYear}</th>
<th scope="col">{selectedYear}</th>
{quarters.map((quarter) => (
<th
scope="col"
Expand Down Expand Up @@ -129,45 +127,49 @@ export default function ResourcesAllocation({ selectedYear, budget }: Props) {
</tr>
))}
</tfoot>
</StyledTable>
</div>
</table>
</StyledTable>
)
}

const StyledTable = styled.table`
text-align: left;
width: 100%;
td,
th {
padding: 6px;
font-family: ${({ theme }) => theme.fonts.main};
}
const StyledTable = styled(Body)`
overflow: auto;

td:not(:first-child),
th:not(:first-child) {
width: 100px;
text-align: right;
}
table {
text-align: left;
width: 100%;
td,
th {
padding: 6px;
font-family: ${({ theme }) => theme.fonts.main};
}

tbody tr:nth-child(odd),
tfoot tr:nth-child(odd) {
background: ${({ theme }) =>
theme.darkMode
? theme.colors.extended.dark[700]
: theme.colors.bases.primary[100]};
color: inherit;
}
td:not(:first-child),
th:not(:first-child) {
width: 100px;
text-align: right;
}

thead,
tfoot {
font-weight: bold;
}
tbody tr:nth-child(odd),
tfoot tr:nth-child(odd) {
background: ${({ theme }) =>
theme.darkMode
? theme.colors.extended.dark[700]
: theme.colors.bases.primary[100]};
color: inherit;
}

tfoot tr:last-child {
color: ${({ theme }) =>
theme.darkMode
? theme.colors.bases.primary[300]
: theme.colors.bases.primary[700]};
background-color: inherit;
thead,
tfoot {
font-weight: bold;
}

tfoot tr:last-child {
color: ${({ theme }) =>
theme.darkMode
? theme.colors.bases.primary[300]
: theme.colors.bases.primary[700]};
background-color: inherit;
}
}
`
Loading