feat: améliore design cartes et légende comparaison versions
This commit is contained in:
@@ -72,15 +72,25 @@ export default function VersionComparison({versionData, versionCompare}) {
|
||||
|
||||
return (
|
||||
<Box sx={{padding: 3}}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid xs={6}>
|
||||
<Paper sx={{padding: 1, backgroundColor: '#E8F5E9'}}>
|
||||
<Box sx={{color: '#388E3C', fontWeight: 'bold'}}>
|
||||
<Grid container spacing={2} sx={{width: '100%'}}>
|
||||
<Grid xs={6} sx={{width: '100%'}}>
|
||||
<Paper sx={{
|
||||
padding: 2,
|
||||
backgroundColor: '#E8F5E9',
|
||||
width: '100%',
|
||||
minHeight: '200px'
|
||||
}}
|
||||
>
|
||||
<Box sx={{
|
||||
color: '#2E7D32',
|
||||
fontWeight: 'bold'
|
||||
}}
|
||||
>
|
||||
<MarkdownRenderer
|
||||
content={main.contenu}
|
||||
color='#388E3C'
|
||||
color='#2E7D32'
|
||||
fallbackComponent={({children, ...props}) => (
|
||||
<Typography variant='body1' sx={{color: '#388E3C', fontWeight: 'bold'}} {...props}>
|
||||
<Typography variant='body1' sx={{color: '#2E7D32', fontWeight: 'bold'}} {...props}>
|
||||
{children}
|
||||
</Typography>
|
||||
)}
|
||||
@@ -88,9 +98,19 @@ export default function VersionComparison({versionData, versionCompare}) {
|
||||
</Box>
|
||||
</Paper>
|
||||
</Grid>
|
||||
<Grid xs={6}>
|
||||
<Paper sx={{padding: 1, backgroundColor: outdated ? '#F9E8E8' : '#E3F2FD'}}>
|
||||
<Box sx={{color: outdated ? '#D32F2F' : '#1976D2', fontWeight: 'bold'}}>
|
||||
<Grid xs={6} sx={{width: '100%'}}>
|
||||
<Paper sx={{
|
||||
padding: 2,
|
||||
backgroundColor: outdated ? '#F9E8E8' : '#E3F2FD',
|
||||
width: '100%',
|
||||
minHeight: '200px'
|
||||
}}
|
||||
>
|
||||
<Box sx={{
|
||||
color: outdated ? '#D32F2F' : '#1976D2',
|
||||
fontWeight: 'bold'
|
||||
}}
|
||||
>
|
||||
<MarkdownRenderer
|
||||
content={current.contenu}
|
||||
color={outdated ? '#D32F2F' : '#1976D2'}
|
||||
@@ -149,22 +169,22 @@ export default function VersionComparison({versionData, versionCompare}) {
|
||||
>
|
||||
LÉGENDE
|
||||
</Typography>
|
||||
<Grid container textAlign='center' spacing={2}>
|
||||
<Grid size={{xs: 12, sm: 4}}>
|
||||
<Grid container textAlign='center' spacing={1}>
|
||||
<Grid size={{xs: 6, sm: 6}}>
|
||||
<Typography
|
||||
variant='body2'
|
||||
sx={{
|
||||
backgroundColor: '#E8F5E9',
|
||||
padding: 1,
|
||||
borderRadius: 1,
|
||||
color: '#388E3C',
|
||||
color: '#2E7D32',
|
||||
fontWeight: 'bold'
|
||||
}}
|
||||
>
|
||||
En ligne
|
||||
Version de référence
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid size={{xs: 12, sm: 4}}>
|
||||
<Grid size={{xs: 6, sm: 6}}>
|
||||
<Typography
|
||||
variant='body2'
|
||||
sx={{
|
||||
|
||||
Reference in New Issue
Block a user