From 18519ebadcc8447ae31f4c6bccaaa1c77dcf5bb4 Mon Sep 17 00:00:00 2001
From: Anton Tananaev <anton@traccar.org>
Date: Sun, 22 May 2022 09:59:57 -0700
Subject: Clean up main page

---
 modern/src/main/MainPage.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

(limited to 'modern/src/main')

diff --git a/modern/src/main/MainPage.js b/modern/src/main/MainPage.js
index c6a0909b..61c10d81 100644
--- a/modern/src/main/MainPage.js
+++ b/modern/src/main/MainPage.js
@@ -121,8 +121,8 @@ const MainPage = () => {
   const t = useTranslation();
 
   const deviceReadonly = useDeviceReadonly();
-  const isTablet = useMediaQuery(theme.breakpoints.down('sm'));
-  const isPhone = useMediaQuery(theme.breakpoints.down('xs'));
+  const desktop = useMediaQuery(theme.breakpoints.up('md'));
+  const phone = useMediaQuery(theme.breakpoints.down('xs'));
 
   const [mapLiveRoutes] = usePersistedState('mapLiveRoutes', false);
 
@@ -135,7 +135,7 @@ const MainPage = () => {
     setCollapsed(!collapsed);
   };
 
-  useEffect(() => setCollapsed(isTablet), [isTablet]);
+  useEffect(() => setCollapsed(!desktop), [desktop]);
 
   return (
     <div className={classes.root}>
@@ -149,10 +149,10 @@ const MainPage = () => {
         <PoiMap />
       </Map>
       <MapCurrentLocation />
-      {!isTablet && <MapPadding left={parseInt(theme.dimensions.drawerWidthDesktop, 10)} />}
+      {desktop && <MapPadding left={parseInt(theme.dimensions.drawerWidthDesktop, 10)} />}
       <Button
         variant="contained"
-        color={isPhone ? 'secondary' : 'primary'}
+        color={phone ? 'secondary' : 'primary'}
         classes={{ containedPrimary: classes.sidebarToggleBg }}
         className={classes.sidebarToggle}
         onClick={handleClose}
@@ -164,7 +164,7 @@ const MainPage = () => {
       <Paper square elevation={3} className={`${classes.sidebar} ${collapsed && classes.sidebarCollapsed}`}>
         <Paper square elevation={3}>
           <Toolbar className={classes.toolbar} disableGutters>
-            {isTablet && (
+            {!desktop && (
               <IconButton onClick={handleClose}>
                 <ArrowBackIcon />
               </IconButton>
@@ -181,7 +181,7 @@ const MainPage = () => {
             <IconButton onClick={() => history.push('/settings/device')} disabled={deviceReadonly}>
               <AddIcon />
             </IconButton>
-            {!isTablet && (
+            {desktop && (
               <IconButton onClick={handleClose}>
                 <CloseIcon />
               </IconButton>
@@ -192,7 +192,7 @@ const MainPage = () => {
           <DevicesList filter={searchKeyword} />
         </div>
       </Paper>
-      {!isPhone && !isTablet && (
+      {desktop && (
         <div className={classes.bottomMenu}>
           <BottomMenu />
         </div>
-- 
cgit v1.2.3