geo2france / g2f-dashboard

React components lib for building dashboards
1 stars 0 forks source link

mapLegend #60

Closed jbdesbas closed 2 weeks ago

jbdesbas commented 1 month ago

Ecrire un composant pour faire une légende de carte. Exemple :

const MapLegend:React.FC = () => {
    const legendItems = [
        { color: colors.classique, label: 'Tarification classique' },
        { color: colors.incitative, label: 'Tarification incitative' }
    ];
    return (
        <div style={{ 
                backgroundColor: 'rgba(256,256,256,0.8)',
                padding: '10px',
                borderRadius: '4px',
                border:'1px solid grey', 
                margin:8
            }}>
            {legendItems.map((item, index) => (
                <div key={index} style={{ display: 'flex', alignItems: 'center', marginBottom: '4px' }}>
                    <div style={{
                        width: '16px',
                        height: '16px',
                        backgroundColor: item.color,
                        borderRadius: '2px',
                        marginRight: '8px'
                    }}></div>
                    <span>{item.label}</span>
                </div>
            ))}
        </div>
    )
}