1
0
Fork 0
mirror of https://github.com/betagouv/mon-entreprise synced 2025-02-09 05:15:02 +00:00
mon-entreprise/source/entry-colour-chooser.js
Johan Girod bc305907b1 👏 Ajoute une nouvelle vue simplifié de la répartition des
cotisations par branche

- La traduction est gérée
- Uniformise la gestion des boutons (1/2)
2018-06-15 17:25:35 +02:00

53 lines
1.4 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import 'core-js/fn/promise'
import { rulesFr } from 'Engine/rules'
import React from 'react'
import { SliderPicker } from 'react-color'
import { render } from 'react-dom'
import { connect, Provider } from 'react-redux'
import { createStore } from 'redux'
import { changeThemeColour } from './actions'
import Layout from './containers/Layout'
import reducers from './reducers/reducers'
let tracker = {
push: () => {},
connectToHistory: history => history
}
let store = createStore(reducers(rulesFr))
@connect(
state => ({ couleur: state.themeColours.colour }),
dispatch => ({
changeColour: colour => dispatch(changeThemeColour(colour))
})
)
class MyComponent extends React.Component {
changeColour = ({ hex }) => this.props.changeColour(hex)
render() {
return (
<div>
<p className="indication">
Visualisez sur cette page lapparence du module pour différentes
couleurs principales.
</p>
<SliderPicker
color={this.props.couleur}
onChangeComplete={this.changeColour}
/>
<p className="indication">
La couleur sélectionnée, à déclarer comme attribut
&quot;data-couleur&quot; du script sur votre page est :{' '}
<b>{this.props.couleur}</b>
</p>
<Layout tracker={tracker} />
</div>
)
}
}
render(
<Provider store={store}>
<MyComponent />
</Provider>,
document.querySelector('#coulorChooser')
)