aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorDesmond Kyeremeh <elDekyfin@gmail.com>2021-07-20 21:54:15 +0000
committerDesmond Kyeremeh <elDekyfin@gmail.com>2021-07-20 21:54:15 +0000
commitcc293e067842f9d88b56f143d5921790c91c4e37 (patch)
tree470f394f527f3fd233852f14244725aa8ddb4423
parent9dcecc62460c27b037fe7e56416afe6172404ef0 (diff)
downloadtrackermap-web-cc293e067842f9d88b56f143d5921790c91c4e37.tar.gz
trackermap-web-cc293e067842f9d88b56f143d5921790c91c4e37.tar.bz2
trackermap-web-cc293e067842f9d88b56f143d5921790c91c4e37.zip
callapse sidebar on tablets
-rw-r--r--modern/src/MainPage.js13
1 files changed, 9 insertions, 4 deletions
diff --git a/modern/src/MainPage.js b/modern/src/MainPage.js
index a53cec1a..6f6b05c0 100644
--- a/modern/src/MainPage.js
+++ b/modern/src/MainPage.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
import { useHistory } from 'react-router-dom';
import {
makeStyles, Paper, Toolbar, TextField, IconButton, Button,
@@ -87,16 +87,21 @@ const MainPage = () => {
const history = useHistory();
const theme = useTheme();
- const [deviceName, setDeviceName] = useState('');
- const [collapsed, setCollapsed] = useState(false);
-
const isTablet = useMediaQuery(theme.breakpoints.down('md'));
const isPhone = useMediaQuery(theme.breakpoints.down('xs'));
+ const [deviceName, setDeviceName] = useState('');
+ const [collapsed, setCollapsed] = useState(false);
+
const handleClose = () => {
setCollapsed(!collapsed);
};
+ // Collapse sidebar for tablets and phones
+ useEffect(() => {
+ setCollapsed(isTablet);
+ }, [isTablet]);
+
return (
<div className={classes.root}>
<Map>