adjust NavBar positioning for improved layout and responsiveness

src/service/AlertsProvider.jsx

@@ -43,11 +43,12 @@ export const AlertsProvider = ({ children }) => {
       {visibleAlert && (
         <Box
           sx={{
+            pt: `calc( env(safe-area-inset-top, 0px))`,
             position: 'fixed',
             top: 0,
             left: 0,
             width: '100%',
-            zIndex: 2000,
+            zIndex: 10000,
             overflow: 'hidden',
           }}
         >

src/views/ChoreEdit/TimerSplitButton.jsx

@@ -4,7 +4,6 @@ import {
   Info,
   Pause,
   PlayArrow,
-  RestartAlt,
 } from '@mui/icons-material'
 import { Box, ButtonGroup, IconButton, Menu, MenuItem } from '@mui/joy'
 import { useEffect, useRef, useState } from 'react'
@@ -146,10 +145,10 @@ const TimerSplitButton = ({
           <Info sx={{ mr: 1 }} />
           Timer Details
         </MenuItem>
-        <MenuItem onClick={handleResetTimer}>
+        {/* <MenuItem onClick={handleResetTimer}>
           <RestartAlt sx={{ mr: 1 }} />
           Restart timer
-        </MenuItem>
+        </MenuItem> */}
         <MenuItem onClick={handleClearAllTime} color='danger'>
           <DeleteSweep sx={{ mr: 1 }} />
           Clear & Reset

src/views/components/NavBar.jsx

@@ -159,7 +159,7 @@ const NavBar = () => {
         sx={{
           '& .MuiDrawer-content': {
             position: 'fixed',
-            top: 'calc(env(safe-area-inset-top, 0px) + 35px)',
+            top: 'calc(env(safe-area-inset-top, 0px) + 45px)',
             left: 0,
             height:
               'calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))',
@@ -224,7 +224,7 @@ const NavBar = () => {
                 p: 1,
                 color: 'text.tertiary',
                 textAlign: 'center',
-                bottom: 0,
+                mb: 'calc(env(safe-area-inset-bottom, 0px) + 45px)',
                 // mb: -2,
               }}
             >