1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-01 13:47:27 +02:00

make section titles sticky

This commit is contained in:
Thomas Heartman 2025-05-28 08:56:54 +02:00
parent 3ab0358f57
commit 698e6781f1

View File

@ -95,12 +95,26 @@ const StyledSection = styled('section')(({ theme }) => ({
gap: theme.spacing(2),
}));
const SectionTitleRow = styled('div')(({ theme }) => ({
position: 'sticky',
top: 0,
zIndex: theme.zIndex.sticky,
padding: theme.spacing(2, 0),
background: theme.palette.background.application,
transition: 'padding 0.3s ease',
display: 'flex',
alignItems: 'space-between',
flexFlow: 'row wrap',
}));
const Section: FC<PropsWithChildren<{ title: string }>> = ({
title,
children,
}) => (
<StyledSection>
<h2>{title}</h2>
<SectionTitleRow>
<h2>{title}</h2>
</SectionTitleRow>
{children}
</StyledSection>
);