Moving the Account icon in a drawer

This commit is contained in:
Eric van der Vlist 2023-03-10 20:01:40 +01:00
parent 4ff760a0ff
commit 3aa96c7afc
5 changed files with 48 additions and 7 deletions

View File

@ -9,6 +9,10 @@ import {
DialogActions,
IconButton,
InputLabel,
ListItem,
ListItemButton,
ListItemIcon,
ListItemText,
NativeSelect,
TextField,
} from '@suid/material';
@ -123,11 +127,15 @@ const Account: Component<{}> = (props) => {
return (
<>
<div class={style.control}>
<IconButton onClick={handleClickOpen}>
<ListItem>
<ListItemButton onClick={handleClickOpen}>
<ListItemIcon>
<PersonIcon />
</IconButton>
</div>
</ListItemIcon>
<ListItemText>Account</ListItemText>
</ListItemButton>
</ListItem>
<Dialog
open={open()}
title={t('account')}

View File

@ -52,6 +52,7 @@ import Invitation, {
} from '../invitation';
import { returnOrUpdate } from 'ol/extent';
import Updater from '../updater';
import SystemDrawer from '../system-drawer';
const [getState, setState] = createSignal({
lon: 0,
@ -326,7 +327,7 @@ const Map: Component = () => {
<GpxImport />
<MapTileProvider />
<GpxDialog />
<Account />
<SystemDrawer />
<AllGpxes map={getMap} />
<Infos />
</div>

View File

@ -0,0 +1,31 @@
import { Component, createSignal } from 'solid-js';
import SettingsIcon from '@suid/icons-material/Settings';
import style from './SystemDrawer.module.css';
import { Drawer, IconButton, List, ListItem } from '@suid/material';
import Account from '../account';
interface Props {}
const SystemDrawer: Component<Props> = (props) => {
const [open, setOpen] = createSignal(false);
return (
<>
<div class={style.control}>
<IconButton onClick={() => setOpen(true)}>
<SettingsIcon />
</IconButton>
<Drawer open={open()} onClose={() => setOpen(false)} anchor='right'>
<List>
<ListItem>
<Account />
</ListItem>
</List>
</Drawer>
</div>
</>
);
};
export default SystemDrawer;

View File

@ -0,0 +1 @@
export { default } from './SystemDrawer';