Fixed scrollbars on replies modal

This commit is contained in:
Alvaro 2022-11-11 10:17:30 -07:00 committed by GitHub
parent 5100d17ed2
commit 79757f22aa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,6 +1,10 @@
// Copyright 2022 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
$tabs-height: 28px;
$tabs-margin-bottom: 16px;
$footer-height: 36px;
.StoryViewsNRepliesModal {
min-width: 320px;
overflow: hidden;
@ -8,7 +12,25 @@
&--group {
display: flex;
flex-direction: column;
min-height: 400px;
flex: 1;
// explicit height prevents height:auto
// while allowing flex to actually size it
height: 0;
.StoryViewsNRepliesModal__replies {
// at least 400px tall
// but if screen is small, allow it to shrink further
// 75% - (header + header bottom margin + footer)
min-height: min(
calc(75vh - ($tabs-height + $tabs-margin-bottom + $footer-height)),
400px
);
}
}
&__body {
display: flex;
flex-direction: column;
}
&__replies {
@ -229,7 +251,7 @@
.Tabs.StoryViewsNRepliesModal__tabs {
border-bottom: none;
justify-content: center;
margin-bottom: 16px;
margin-bottom: $tabs-margin-bottom;
}
.Tabs__tab.StoryViewsNRepliesModal__tabs__tab {