Fix stories View/Replies overflow scroll

Co-authored-by: ayumi-signal <143036029+ayumi-signal@users.noreply.github.com>

stylesheets/components/StoryViewsNRepliesModal.scss

@@ -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 {

ts/components/StoryViewsNRepliesModal.tsx

@@ -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),
           })}
         >