Ensure only content gets clipped

src/components/status/status.scss

@@ -42,6 +42,10 @@
     display: flex;
     padding: var(--status-margin, $status-margin);
 
+    .content {
+      overflow: hidden;
+    }
+
     > * {
       min-width: 0;
     }

src/components/status/status.vue

@@ -352,22 +352,25 @@
             </div>
           </div>
 
-          <StatusContent
+          <div class="content">
-            ref="content"
+            <StatusContent
-            :status="status"
+              ref="content"
-            :no-heading="noHeading"
+              class="status-content"
-            :highlight="highlight"
+              :status="status"
-            :focused="isFocused"
+              :no-heading="noHeading"
-            :controlled-showing-tall="controlledShowingTall"
+              :highlight="highlight"
-            :controlled-expanding-subject="controlledExpandingSubject"
+              :focused="isFocused"
-            :controlled-showing-long-subject="controlledShowingLongSubject"
+              :controlled-showing-tall="controlledShowingTall"
-            :controlled-toggle-showing-tall="controlledToggleShowingTall"
+              :controlled-expanding-subject="controlledExpandingSubject"
-            :controlled-toggle-expanding-subject="controlledToggleExpandingSubject"
+              :controlled-showing-long-subject="controlledShowingLongSubject"
-            :controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
+              :controlled-toggle-showing-tall="controlledToggleShowingTall"
-            @mediaplay="addMediaPlaying($event)"
+              :controlled-toggle-expanding-subject="controlledToggleExpandingSubject"
-            @mediapause="removeMediaPlaying($event)"
+              :controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
-            @parseReady="setHeadTailLinks"
+              @mediaplay="addMediaPlaying($event)"
-          />
+              @mediapause="removeMediaPlaying($event)"
+              @parseReady="setHeadTailLinks"
+            />
+          </div>
 
           <div
             v-if="inConversation && !isPreview && replies && replies.length"
@@ -534,6 +537,6 @@
   </div>
 </template>
 
-<script src="./status.js" ></script>
+<script src="./status.js"></script>
 
 <style src="./status.scss" lang="scss"></style>

src/components/status_content/status_content.vue

@@ -68,7 +68,6 @@
 .StatusContent {
   flex: 1;
   min-width: 0;
-  overflow: hidden;
 
   img, video {
     &.emoji {