48 lines
993 B
JavaScript
48 lines
993 B
JavaScript
const FrenchSolution = ({ width = 162, height = 120 }) => {
|
|
const containerStyle = {
|
|
width: width,
|
|
height: height,
|
|
backgroundColor: '#ffffff',
|
|
borderRadius: 8,
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
boxSizing: 'border-box',
|
|
fontFamily: 'DM Sans, sans-serif',
|
|
color: '#16274f',
|
|
};
|
|
|
|
const solutionsStyle = {
|
|
fontSize: '12px',
|
|
fontWeight: 700,
|
|
marginBottom: '4px',
|
|
};
|
|
|
|
const percentageStyle = {
|
|
fontSize: '40px',
|
|
fontWeight: 700,
|
|
lineHeight: '1.2',
|
|
margin: '0',
|
|
};
|
|
|
|
const frenchStyle = {
|
|
fontSize: '18px',
|
|
fontWeight: 700,
|
|
textTransform: 'uppercase',
|
|
lineHeight: '120%',
|
|
margin: '0',
|
|
};
|
|
|
|
return (
|
|
<div style={containerStyle}>
|
|
<div style={solutionsStyle}>Solutions</div>
|
|
<div style={percentageStyle}>100%</div>
|
|
<div style={frenchStyle}>française 🇫🇷</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default FrenchSolution;
|
|
|