Only stick beatmap discussion timestamp on the discussion page

ppy · Jun 30, 2023 · 488c436 · 488c436
1 parent 671ce46
commit 488c436
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/resources/css/bem/beatmap-discussion-timestamp.less b/resources/css/bem/beatmap-discussion-timestamp.less
@@ -11,14 +11,15 @@
 
   // avatar + paddings + margins
   height: (@beatmap-discussion--avatar-size + 20px + 10px);
-
   align-items: center;
-
   display: flex;
-  position: sticky;
-  // 36px is page-extra-tabs height on desktop.
-  // This doesn't work when the new discussion box is visible.
-  top: calc(var(--navbar-height) + 36px);
+
+  &--sticky {
+    position: sticky;
+    // 36px is page-extra-tabs height on desktop.
+    // This doesn't work when the new discussion box is visible.
+    top: calc(var(--navbar-height) + 36px);
+  }
 
   &__icons {
     display: flex;

diff --git a/resources/js/beatmap-discussions/discussion.tsx b/resources/js/beatmap-discussions/discussion.tsx
@@ -290,7 +290,7 @@ export class Discussion extends React.Component<Props> {
 
   private renderTimestamp() {
     return (
-      <div className='beatmap-discussion-timestamp'>
+      <div className={classWithModifiers('beatmap-discussion-timestamp', { sticky: this.props.isTimelineVisible })}>
         {this.props.discussion.timestamp != null && this.props.isTimelineVisible && <div className="beatmap-discussion-timestamp__point" />}
         <div className="beatmap-discussion-timestamp__icons-container">
           <div className="beatmap-discussion-timestamp__icons">