From e8f91a0a4c78f02689ba87d941657eff2b8a9ea3 Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Fri, 16 Jun 2023 12:21:04 -0400
Subject: [PATCH]  UX: remove short topic timeline transition  (#22161)

---
 .../stylesheets/common/topic-timeline.scss     | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/common/topic-timeline.scss b/app/assets/stylesheets/common/topic-timeline.scss
index 075468f6883..2d796d0a5ef 100644
--- a/app/assets/stylesheets/common/topic-timeline.scss
+++ b/app/assets/stylesheets/common/topic-timeline.scss
@@ -5,13 +5,8 @@
 .timeline-container {
   box-sizing: border-box;
   z-index: z("timeline");
-  transform: translateZ(0);
 
   &.timeline-docked-bottom {
-    margin-bottom: -4em;
-    @media screen and (prefers-reduced-motion: no-preference) {
-      transition: margin-bottom 0.5s ease-in;
-    }
     .timeline-footer-controls {
       opacity: 0;
       pointer-events: none;
@@ -184,6 +179,7 @@
   .topic-timeline {
     transition: opacity 0.2s ease-in;
     touch-action: none;
+    min-width: 6em;
 
     .timeline-controls {
       margin-bottom: 1em;
@@ -195,17 +191,17 @@
     }
 
     .timeline-footer-controls {
-      margin-top: 1.5em;
+      // this is absolutely positioned to avoid
+      // adding extra height below short topics
+      // above the topic-footer-controls
+      position: absolute;
+      margin-top: 1em;
       @media (prefers-reduced-motion: no-preference) {
         transition: opacity 0.2s ease-in;
       }
       display: flex;
+      gap: 0.5em;
       flex-wrap: wrap;
-      max-width: 9em;
-
-      .reply-to-post {
-        margin-right: 0.5em;
-      }
 
       button:last-child {
         margin-right: 0;