fix: show scrollbar in navigation menu

This commit is contained in:
thecodrr
2022-02-09 08:00:39 +05:00
parent b58f1e7cd4
commit afa260b50c

View File

@@ -27,6 +27,7 @@ import { useStore as useAppStore } from "../../stores/app-store";
import { useStore as useUserStore } from "../../stores/user-store"; import { useStore as useUserStore } from "../../stores/user-store";
import { useStore as useThemeStore } from "../../stores/theme-store"; import { useStore as useThemeStore } from "../../stores/theme-store";
import useLocation from "../../hooks/use-location"; import useLocation from "../../hooks/use-location";
import { FlexScrollContainer } from "../scroll-container";
function shouldSelectNavItem(route, pin) { function shouldSelectNavItem(route, pin) {
if (pin.type === "notebook") { if (pin.type === "notebook") {
@@ -126,15 +127,8 @@ function NavigationMenu(props) {
bg={"bgSecondary"} bg={"bgSecondary"}
px={0} px={0}
> >
<Flex <FlexScrollContainer>
flexDirection="column" <Flex flexDirection="column">
sx={{
overflow: "scroll",
scrollbarWidth: "none",
"::-webkit-scrollbar": { width: 0, height: 0 },
msOverflowStyle: "none",
}}
>
{routes.map((item) => ( {routes.map((item) => (
<NavigationItem <NavigationItem
key={item.path} key={item.path}
@@ -177,7 +171,13 @@ function NavigationMenu(props) {
}} }}
/> />
))} ))}
<Box width="85%" height="0.8px" bg="border" alignSelf="center" my={1} /> <Box
width="85%"
height="0.8px"
bg="border"
alignSelf="center"
my={1}
/>
{pins.map((pin) => ( {pins.map((pin) => (
<NavigationItem <NavigationItem
key={pin.id} key={pin.id}
@@ -216,6 +216,7 @@ function NavigationMenu(props) {
/> />
))} ))}
</Flex> </Flex>
</FlexScrollContainer>
<Flex flexDirection="column"> <Flex flexDirection="column">
{theme === "light" ? ( {theme === "light" ? (
<NavigationItem <NavigationItem