Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2026-09-03 12:41:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: app is scrollable due to showing banner at top

Browse Source
This commit is contained in:
thecodrr
2020-11-22 16:00:11 +05:00
parent 13b10311f4
commit e1ec99a542
1 changed files with 42 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
apps/web/src/app.js
View File

@@ -101,53 +101,51 @@ function App() {
return (
<ThemeProvider>
<Flex flexDirection="column" height="100%">
{isMobile && (
<Flex
alignItems="center"
justifyContent="center"
bg="primary"
width="100%"
py={1}
<Flex id="app" bg="background" height="100%">
<NavigationMenu
toggleNavigationContainer={(state) => setShow(state || !show)}
/>
<Flex variant="rowFill">
<Animated.Flex
variant="columnFill"
initial={{ width: "30%", opacity: 1, x: 0 }}
animate={{
width: show ? "30%" : "0%",
x: show ? 0 : "-30%",
opacity: show ? 1 : 0,
zIndex: show ? 0 : -1,
}}
transition={{ duration: 0.3, ease: "easeOut" }}
sx={{
borderRight: "1px solid",
borderColor: "border",
}}
>
<Text color="static" textAlign="center" fontSize="title">
Use our <a href="https://notesnook.com/mobile">mobile app</a> for
a better experience.
</Text>
{isMobile && (
<Flex
alignItems="center"
justifyContent="center"
bg="primary"
width="100%"
py={1}
>
<Text color="static" textAlign="center" fontSize="title">
Use our <a href="https://notesnook.com/mobile">mobile app</a>{" "}
for a better experience.
</Text>
</Flex>
)}
{routeResult}
</Animated.Flex>
<Flex
width={[show ? 0 : "100%", show ? 0 : "100%", "100%"]}
flexDirection="column"
>
<Editor />
</Flex>
)}
<Flex flex="1" id="app" bg="background">
<NavigationMenu
toggleNavigationContainer={(state) => setShow(state || !show)}
/>
<Flex variant="rowFill">
<Animated.Flex
variant="columnFill"
initial={{ width: "30%", opacity: 1, x: 0 }}
animate={{
width: show ? "30%" : "0%",
x: show ? 0 : "-30%",
opacity: show ? 1 : 0,
zIndex: show ? 0 : -1,
}}
transition={{ duration: 0.3, ease: "easeOut" }}
sx={{
borderRight: "1px solid",
borderColor: "border",
}}
>
{routeResult}
</Animated.Flex>
<Flex
width={[show ? 0 : "100%", show ? 0 : "100%", "100%"]}
flexDirection="column"
>
<Editor />
</Flex>
</Flex>
<Box id="dialogContainer" />
<GlobalMenuWrapper />
</Flex>
<Box id="dialogContainer" />
<GlobalMenuWrapper />
</Flex>
</ThemeProvider>
);