more fixes

2 files changed, 20 insertions, 11 deletions

diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 8797211e..46088cf9 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -58,7 +58,7 @@ $status-margin: 0.75em;
     margin-bottom: $status-margin;
   }
 
-  .user-name {
+  .status-username {
     white-space: nowrap;
     font-size: 14px;
     overflow: hidden;
@@ -143,10 +143,13 @@ $status-margin: 0.75em;
     }
   }
 
-  .reply-to-popover {
+  & .reply-to-popover,
+  & .reply-to-no-popover {
     min-width: 0;
     margin-right: 0.4em;
+  }
 
+  .reply-to-popover {
     &:hover {
       border-bottom: 1px solid var(--faint);
     }
@@ -273,7 +276,7 @@ $status-margin: 0.75em;
     display: flex;
     flex-wrap: nowrap;
 
-    & .user-name,
+    & .status-username,
     & .mute-thread,
     & .mute-words {
       word-wrap: normal;
@@ -281,16 +284,17 @@ $status-margin: 0.75em;
       white-space: nowrap;
     }
 
-    & .user-name,
+    & .status-username,
     & .mute-words {
       text-overflow: ellipsis;
       overflow: hidden;
     }
 
-    .user-name {
+    .status-username {
       font-weight: normal;
       flex: 0 1 auto;
       margin-right: 0.2em;
+      font-size: smaller;
     }
 
     .mute-thread {
@@ -313,6 +317,11 @@ $status-margin: 0.75em;
     }
   }
 
+  .reply-form {
+    padding-top: 0;
+    padding-bottom: 0;
+  }
+
   .reply-body {
     flex: 1;
   }
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 2b18b2f6..8df82edc 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -17,7 +17,7 @@
     </div>
     <template v-if="muted && !isPreview">
       <div class="status-csontainer muted">
-        <small class="user-name">
+        <small class="status-username">
           <i
             v-if="muted && retweet"
             class="button-icon icon-retweet"
@@ -73,7 +73,7 @@
         />
         <div class="right-side faint">
           <span
-            class="user-name repeater-name"
+            class="status-username repeater-name"
             :title="retweeter"
           >
             <router-link
@@ -131,13 +131,13 @@
               <div class="heading-left">
                 <h4
                   v-if="status.user.name_html"
-                  class="user-name"
+                  class="status-username"
                   :title="status.user.name"
                   v-html="status.user.name_html"
                 />
                 <h4
                   v-else
-                  class="user-name"
+                  class="status-username"
                   :title="status.user.name"
                 >
                   {{ status.user.name }}
@@ -229,7 +229,7 @@
                 </StatusPopover>
                 <span
                   v-else
-                  class="reply-to"
+                  class="reply-to-no-popover"
                 >
                   <span class="reply-to-text">{{ $t('status.reply_to') }}</span>
                 </span>
@@ -357,7 +357,7 @@
       </div>
       <div
         v-if="replying"
-        class="status-container"
+        class="status-container reply-form"
       >
         <PostStatusForm
           class="reply-body"