aboutsummaryrefslogtreecommitdiff
path: root/modern/src
diff options
context:
space:
mode:
authorDesmond Kyeremeh <elDekyfin@gmail.com>2021-07-02 15:15:59 +0000
committerDesmond Kyeremeh <elDekyfin@gmail.com>2021-07-02 15:15:59 +0000
commit7704d0f907c1567888a7d908a4641edfec0e68f4 (patch)
treeb761e45a48a6200d07d87a7fe48907110a8e15ea /modern/src
parentca6f62e322ece99cb944ad341ebc4de9aa82c82d (diff)
downloadetbsa-traccar-web-7704d0f907c1567888a7d908a4641edfec0e68f4.tar.gz
etbsa-traccar-web-7704d0f907c1567888a7d908a4641edfec0e68f4.tar.bz2
etbsa-traccar-web-7704d0f907c1567888a7d908a4641edfec0e68f4.zip
Updated geofencespage
Diffstat (limited to 'modern/src')
-rw-r--r--modern/src/GeofencesPage.js40
1 files changed, 29 insertions, 11 deletions
diff --git a/modern/src/GeofencesPage.js b/modern/src/GeofencesPage.js
index 389ac99..c66637d 100644
--- a/modern/src/GeofencesPage.js
+++ b/modern/src/GeofencesPage.js
@@ -2,17 +2,20 @@ import React from 'react';
import { isWidthUp, makeStyles, withWidth } from '@material-ui/core';
import Drawer from '@material-ui/core/Drawer';
import ContainerDimensions from 'react-container-dimensions';
-import MainToolbar from './MainToolbar';
import Map from './map/Map';
import CurrentLocationMap from './map/CurrentLocationMap';
import GeofenceEditMap from './map/GeofenceEditMap';
import GeofencesList from './GeofencesList';
+import ArrowBackIcon from '@material-ui/icons/ArrowBack';
+
+import t from './common/localization';
+
const useStyles = makeStyles(theme => ({
root: {
height: '100%',
display: 'flex',
- flexDirection: 'column',
+ flexDirection: 'column'
},
content: {
flexGrow: 1,
@@ -20,21 +23,27 @@ const useStyles = makeStyles(theme => ({
display: 'flex',
flexDirection: 'row',
[theme.breakpoints.down('xs')]: {
- flexDirection: 'column-reverse',
+ flexDirection: 'column-reverse'
}
},
drawerPaper: {
position: 'relative',
[theme.breakpoints.up('sm')]: {
- width: 350,
+ width: 350
},
[theme.breakpoints.down('xs')]: {
- height: 250,
+ height: 250
}
},
- mapContainer: {
- flexGrow: 1,
+ drawerHeader: {
+ ...theme.mixins.toolbar,
+ display: 'flex',
+ alignItems: 'center',
+ padding: theme.spacing(0, 1)
},
+ mapContainer: {
+ flexGrow: 1
+ }
}));
const GeofencesPage = ({ width }) => {
@@ -42,12 +51,21 @@ const GeofencesPage = ({ width }) => {
return (
<div className={classes.root}>
- <MainToolbar />
<div className={classes.content}>
<Drawer
anchor={isWidthUp('sm', width) ? 'left' : 'bottom'}
- variant='permanent'
- classes={{ paper: classes.drawerPaper }}>
+ variant="permanent"
+ classes={{ paper: classes.drawerPaper }}
+ >
+ <div className={classes.drawerHeader}>
+ <IconButton component="a" href="/">
+ <ArrowBackIcon />
+ </IconButton>
+ <Typography variant="h6" color="inherit" noWrap>
+ {t('sharedGeofences')}
+ </Typography>
+ </div>
+ <Divider />
<GeofencesList />
</Drawer>
<div className={classes.mapContainer}>
@@ -61,6 +79,6 @@ const GeofencesPage = ({ width }) => {
</div>
</div>
);
-}
+};
export default withWidth()(GeofencesPage);