44 lines
1.1 KiB
JavaScript
44 lines
1.1 KiB
JavaScript
import React, { Component } from 'react'
|
|
import { Trans, translate } from 'react-i18next'
|
|
import './Explanation.css'
|
|
import { connect } from 'react-redux'
|
|
import { scroller, Element } from 'react-scroll'
|
|
import { path } from 'ramda'
|
|
import withColours from './withColours'
|
|
|
|
@translate()
|
|
@withColours
|
|
@connect(state => ({
|
|
analysis: state.analysis
|
|
}))
|
|
export default class GoToExplanation extends Component {
|
|
handleScrollToResults = () => {
|
|
scroller.scrollTo('resultsScrollElement', {
|
|
smooth: true,
|
|
duration: 200,
|
|
delay: 0
|
|
})
|
|
}
|
|
render() {
|
|
let targetRules = path(['analysis', 'targets'], this.props)
|
|
if (!targetRules) return null
|
|
|
|
return (
|
|
<Element name="resultsScrollElement" id="resultsScrollElement">
|
|
<h3
|
|
className="scrollIndication down"
|
|
style={{
|
|
color: this.props.colours.textColourOnWhite
|
|
}}>
|
|
<button
|
|
className="unstyledButton"
|
|
onClick={this.handleScrollToResults}>
|
|
<i className="fa fa-long-arrow-down" aria-hidden="true" />
|
|
<Trans i18nKey="details">Comprendre mes résultats</Trans>
|
|
</button>
|
|
</h3>
|
|
</Element>
|
|
)
|
|
}
|
|
}
|