Commit e96dfcb7 authored by Florent Chehab's avatar Florent Chehab
Browse files

Tweaks on resize

parent ae20d1f4
...@@ -43,6 +43,18 @@ class UniversityTemplate extends React.Component { ...@@ -43,6 +43,18 @@ class UniversityTemplate extends React.Component {
value: 0, value: 0,
}; };
handlerResize() {
this.forceUpdate();
}
componentDidMount() {
window.addEventListener("resize", this.handlerResize.bind(this));
}
componentWillUnmount() {
window.addEventListener("resize", this.handlerResize.bind(this));
}
handleChange = (event, value) => { handleChange = (event, value) => {
this.setState({ value }); this.setState({ value });
}; };
...@@ -50,23 +62,28 @@ class UniversityTemplate extends React.Component { ...@@ -50,23 +62,28 @@ class UniversityTemplate extends React.Component {
render() { render() {
const { classes } = this.props; const { classes } = this.props;
const { value } = this.state; const { value } = this.state;
const w = window,
d = document,
documentElement = d.documentElement,
body = d.getElementsByTagName('body')[0],
width = w.innerWidth || documentElement.clientWidth || body.clientWidth,
height = w.innerHeight || documentElement.clientHeight || body.clientHeight;
return ( return (
<div> <div>
<div> <div>
<CoverGallery></CoverGallery> <CoverGallery></CoverGallery>
</div> </div>
<div className={classes.root}> <div className={classes.root}>
<AppBar position="sticky" color="default"> <AppBar position="sticky" color="default">
<Tabs <Tabs
value={value} value={value}
onChange={this.handleChange} onChange={this.handleChange}
scrollable scrollable={width < 1000 ? true : false}
centered={width >= 1000 ? true : false}
scrollButtons="on" scrollButtons="on"
indicatorColor="primary" indicatorColor="primary"
textColor="primary" textColor="primary"
centered
> >
<Tab label="Généralités" icon={<PhoneIcon />} /> <Tab label="Généralités" icon={<PhoneIcon />} />
<Tab label="Précédents départs" icon={<HelpIcon />} /> <Tab label="Précédents départs" icon={<HelpIcon />} />
...@@ -75,7 +92,7 @@ class UniversityTemplate extends React.Component { ...@@ -75,7 +92,7 @@ class UniversityTemplate extends React.Component {
<Tab label="Autres" icon={<ShoppingBasket />} /> <Tab label="Autres" icon={<ShoppingBasket />} />
</Tabs> </Tabs>
</AppBar> </AppBar>
{value === 0 && <TabContainer>Item One <Lorem count={10}/></TabContainer>} {value === 0 && <TabContainer>Item One <Lorem count={10} /></TabContainer>}
{value === 1 && <TabContainer>Item Two</TabContainer>} {value === 1 && <TabContainer>Item Two</TabContainer>}
{value === 2 && <TabContainer>Item Three</TabContainer>} {value === 2 && <TabContainer>Item Three</TabContainer>}
{value === 3 && <TabContainer>Item Four</TabContainer>} {value === 3 && <TabContainer>Item Four</TabContainer>}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment