UX: smoother timeline footer animation, padding fix (#12743)

app/assets/stylesheets/common/base/topic-post.scss

@@ -1103,7 +1103,7 @@ a.mention-group {
 }
 
 #topic-footer-buttons {
-  padding: 0.75em 0;
+  padding: 1.5em 0 0.75em 0;
 
   .topic-footer-main-buttons {
     display: flex;

app/assets/stylesheets/common/topic-timeline.scss

@@ -6,13 +6,15 @@
   box-sizing: border-box;
   z-index: z("timeline");
   -webkit-transform: translate3d(0, 0, 0);
-
+  transition: margin-bottom 0.25s ease-in;
   &.timeline-docked-bottom {
+    @media screen and (prefers-reduced-motion: no-preference) {
+      margin-bottom: -1.75em; // animate out footer button height
+    }
     .timeline-footer-controls {
       opacity: 0;
       pointer-events: none;
       cursor: default;
-      height: 0px;
     }
   }
 

app/assets/stylesheets/desktop/topic.scss

@@ -62,6 +62,9 @@
 .topic-timer-info {
   border-top: 1px solid var(--primary-low);
   padding: 10px 0;
+  &:empty {
+    padding: 0;
+  }
   max-width: 758px;
   .topic-timer-heading,
   .slow-mode-heading {