react_ui: AppBarとナビがスクロールされてしまうのを修正

Changes

2 changed files (+19/-9)

• packages/react_ui/src/pages/:workspace/Layout.stories.tsx
  • @@ -65,3 +65,15 @@ </>
    ), }, }; + + export const LongContents: Story = { + args: { + children: ( + <ul> + {Array.from({ length: 100 }, (_, i) => ( + <li key={i}>Foo</li> + ))} + </ul> + ), + }, + };
• packages/react_ui/src/pages/:workspace/Layout.tsx
  • @@ -69,7 +69,6 @@ inset="0"
    height="100%" columns={{ initial: "1", md: "minmax(15rem, max-content) minmax(0, 1fr)" }} rows="max-content minmax(0, 1fr)" - gapY="2" > <Box className={css.appbar} display={{ initial: "none", md: "block" }} /> <Flex className={css.appbar} p="2" align="center" gapX="3">
  • @@ -137,14 +136,13 @@ <CopyrightNotice.FirstParty />
    </Text> </Flex> </Flex> - <Container - size={{ initial: "2", lg: "3" }} - p="2" - gridRowStart="2" - gridColumnStart={{ initial: "1", md: "2" }} - > - {children} - </Container> + <Box asChild gridRowStart="2" gridColumnStart={{ initial: "1", md: "2" }}> + <ScrollArea size="2"> + <Container size={{ initial: "2", lg: "3" }} p="2" pb="6"> + {children} + </Container> + </ScrollArea> + </Box> </Grid> ); };