import React from 'react'
import PropTypes from 'prop-types';
import LayoutBack from '../components/templates/LayoutBack'
import { withStyles } from '@material-ui/core/styles'
import Head from 'next/head'
import _ from 'lodash'
import VideoVimeo from '../components/atoms/VideoVimeo'

const styles = theme => ({
  container: {
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'center',
    justifyContent: 'flex-start',
    padding: theme.spacing(3, 2),
    width: '100%',
  },
  vimeoVideo: {
    width: '100% !important',
  },
});

class Conseils extends React.Component {

  render() {
    const { classes } = this.props

    return (
      <LayoutBack text="Quelques conseils !">
        <Head>
          <title>Quelques conseils !</title>
          <meta name="description" content="Quelques conseils !" />
          <meta key="robots" name="robots" content="noindex, nofollow"></meta>
          
        </Head>
        <section className={classes.container}>
          <VideoVimeo videoId='356411947' autoplay='1' />
        </section>
      </LayoutBack>
    )

  }

}

Conseils.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(Conseils);