Fix stories View/Replies overflow scroll

This commit is contained in:
ayumi-signal 2024-02-27 09:42:37 -08:00 committed by GitHub
parent f04e0b6122
commit 9858a1dc1b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 16 additions and 10 deletions

View file

@ -5,24 +5,17 @@
min-width: 320px;
min-height: min(400px, 80vh);
max-height: 80vh;
overflow: hidden;
&--group {
display: flex;
flex-direction: column;
flex: 1;
.StoryViewsNRepliesModal__replies {
flex: 1;
overflow: auto;
}
}
&__body {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden; // override modal's overflow: auto
}
&__body_inner {
@ -31,12 +24,19 @@
flex: 1;
}
&__content {
&:not(:has(.Tabs)) {
padding-block-start: 16px;
}
padding-block-end: 16px;
padding-inline: 16px;
}
&__replies {
flex: 1;
margin-block: 0;
margin-inline: -16px;
max-height: 75vh;
overflow-y: overlay;
&--none {
align-items: center;
@ -255,9 +255,13 @@
}
.Tabs.StoryViewsNRepliesModal__tabs {
position: sticky;
top: 0;
z-index: $z-index-base;
padding-block: 16px;
background: $color-gray-80;
border-bottom: none;
justify-content: center;
margin-bottom: 16px;
}
.Tabs__tab.StoryViewsNRepliesModal__tabs__tab {

View file

@ -435,11 +435,13 @@ export function StoryViewsNRepliesModal({
i18n={i18n}
moduleClassName="StoryViewsNRepliesModal"
onClose={onClose}
padded={false}
useFocusTrap={Boolean(composerElement)}
theme={Theme.Dark}
>
<div
className={classNames({
StoryViewsNRepliesModal__content: true,
'StoryViewsNRepliesModal--group': Boolean(group),
})}
>