diff --git a/src/components/App/SideBar/Creator/index.tsx b/src/components/App/SideBar/Creator/index.tsx index 5aa5a7876..d473344c0 100644 --- a/src/components/App/SideBar/Creator/index.tsx +++ b/src/components/App/SideBar/Creator/index.tsx @@ -1,4 +1,5 @@ import { useEffect, useMemo } from 'react' +import styled from 'styled-components' import { useGraphData } from '~/components/DataRetriever' import { Divider } from '~/components/common/Divider' import { Flex } from '~/components/common/Flex' @@ -9,6 +10,22 @@ import { ErrorSection } from './ErrorSection' import { Heading } from './Heading' import { Timestamp } from './Timestamp' +const Wrapper = styled(Flex)` + height: 70vh; + padding-bottom: 45px; + overflow: scroll; + + &::-webkit-scrollbar { + width: 1px; + height: 4px; + } + + &::-webkit-scrollbar-thumb { + width: 1px; + height: 4px; + } +` + export const Creator = () => { const data = useGraphData() const selectedNode = useSelectedNode() @@ -38,7 +55,7 @@ export const Creator = () => { {flagErrorIsOpen && } {!!selectedNodeTimestamps?.length && ( - <> + {selectedNodeTimestamps?.map((timestamp, index) => ( { - + )} ) diff --git a/src/components/App/SideBar/SidebarSubView/index.tsx b/src/components/App/SideBar/SidebarSubView/index.tsx index 1d1bc20e1..d92210cc5 100644 --- a/src/components/App/SideBar/SidebarSubView/index.tsx +++ b/src/components/App/SideBar/SidebarSubView/index.tsx @@ -52,6 +52,7 @@ const Wrapper = styled(Flex)(({ theme }) => ({ margin: '64px auto 20px 10px', borderRadius: '16px', zIndex: 29, + overflow: 'hidden', [theme.breakpoints.up('sm')]: { width: '390px', },