Use full height and width of viewport on iOS

- render appbar background color on ios status bar
- handle "home indicator" safe area inset
This commit is contained in:
schroda
2024-12-15 22:37:11 +01:00
parent ffe824e603
commit d844ad3f5d
10 changed files with 39 additions and 20 deletions

View File

@@ -7,14 +7,9 @@
*/
import Box, { BoxProps } from '@mui/material/Box';
import { useNavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
export const TabsWrapper = ({ children, ...props }: BoxProps) => {
const { appBarHeight } = useNavBarContext();
return (
<Box {...props} sx={{ ...props.sx, position: 'relative', height: `calc(100% - ${appBarHeight}px)` }}>
{children}
</Box>
);
};
export const TabsWrapper = ({ children, ...props }: BoxProps) => (
<Box {...props} sx={{ ...props.sx, position: 'relative', height: `100%` }}>
{children}
</Box>
);

View File

@@ -22,7 +22,7 @@ export const StyledGroupedVirtuoso = ({
{...props}
style={{
...style,
height: `calc(100vh - ${heightToSubtract}px - ${appBarHeight}px - ${bottomBarHeight}px)`,
height: `calc(100vh - ${heightToSubtract}px - ${appBarHeight}px - ${bottomBarHeight}px - ${!bottomBarHeight ? 'env(safe-area-inset-bottom)' : '0px'})`,
}}
/>
);