2017-05-21 10:02:51 +02:00
|
|
|
import React, { Component } from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import './breakpoints.css';
|
2017-04-28 15:47:14 +10:00
|
|
|
|
|
|
|
class Breakpoint extends Component {
|
2017-05-21 10:02:51 +02:00
|
|
|
render() {
|
|
|
|
const { mobile, children } = this.props;
|
2017-04-28 15:47:14 +10:00
|
|
|
|
|
|
|
if (mobile) {
|
|
|
|
return (
|
|
|
|
<div className="breakpoint-min-width-700">
|
|
|
|
{children}
|
|
|
|
</div>
|
2017-05-21 10:02:51 +02:00
|
|
|
);
|
2017-04-28 15:47:14 +10:00
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="breakpoint-max-width-700">
|
|
|
|
{children}
|
|
|
|
</div>
|
2017-05-21 10:02:51 +02:00
|
|
|
);
|
2017-04-28 15:47:14 +10:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
Breakpoint.propTypes = {
|
2017-05-01 19:08:11 +10:00
|
|
|
children: PropTypes.array,
|
|
|
|
mobile: PropTypes.bool,
|
2017-05-21 10:02:51 +02:00
|
|
|
};
|
2017-04-28 15:47:14 +10:00
|
|
|
|
2017-05-21 10:02:51 +02:00
|
|
|
export default Breakpoint;
|