astra/ntfy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix action bar

Browse source
This commit is contained in:
Philipp Heckel 2022-02-26 14:22:21 -05:00
parent ee743a7b01
commit d705d3c3b1
3 changed files with 30 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

23
web/src/components/ActionBar.js
View file

@ -12,7 +12,11 @@ const ActionBar = (props) => {
? props.selectedSubscription.shortUrl()
: "ntfy";
return (
<AppBar position="fixed" sx={{ width: { sm: `calc(100% - ${Navigation.width}px)` }, ml: { sm: `${Navigation.width}px` } }}>
<AppBar position="fixed" sx={{
width: '100%',
zIndex: { sm: 2000 }, // > Navigation
ml: { sm: `${Navigation.width}px` }
}}>
<Toolbar sx={{pr: '24px'}}>
<IconButton
color="inherit"
@ -22,7 +26,9 @@ const ActionBar = (props) => {
>
<MenuIcon />
</IconButton>
<Typography variant="h6" noWrap component="div" sx={{ flexGrow: 1 }}>{title}</Typography>
<Typography variant="h6" noWrap component="div" sx={{ flexGrow: 1 }}>
{title}
</Typography>
{props.selectedSubscription !== null && <IconSubscribeSettings
subscription={props.selectedSubscription}
users={props.users}
@ -34,4 +40,17 @@ const ActionBar = (props) => {
);
};
/*
To add a top left corner logo box:
<Typography variant="h5" noWrap component="div" sx={{
display: { xs: 'none', sm: 'block' },
width: { sm: `${Navigation.width}px` }
}}>
ntfy
</Typography>
To make the size of the top bar dynamic based on the drawer:
width: { sm: `calc(100% - ${Navigation.width}px)` }
*/
export default ActionBar;