Fix shrinked horizontal separator (#9192)

Related issue:
https://discord.com/channels/1130383047699738754/1317185369577492532/1317185369577492532.

TL;DR: When used in a flex container, the separators gets hidden when
the container becomes scrollable. We must ensure they can't shrink.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Baptiste Devessier
2024-12-30 18:03:21 +01:00
committed by GitHub
parent e153168edb
commit e1c99beaa4
4 changed files with 14 additions and 13 deletions

View File

@ -10,6 +10,7 @@ type HorizontalSeparatorProps = {
const StyledSeparator = styled.div<HorizontalSeparatorProps>`
background-color: ${({ theme, color }) => color ?? theme.border.color.medium};
height: ${({ visible }) => (visible ? '1px' : 0)};
flex-shrink: 0;
margin-bottom: ${({ theme, noMargin }) => (noMargin ? 0 : theme.spacing(3))};
margin-top: ${({ theme, noMargin }) => (noMargin ? 0 : theme.spacing(3))};
width: 100%;