Merge commit '15fd712464' into kb_migration

app/javascript/styles/mastodon/components.scss

@@ -1162,11 +1162,12 @@ body > [data-popper-placement] {
     .status__content,
     .status__action-bar,
     .media-gallery,
-    .video,
-    .audio,
+    .video-player,
+    .audio-player,
     .attachment-list,
-    .preview-card {
-      margin-left: 46px + 10px;
+    .picture-in-picture-placeholder,
+    .status-card {
+      margin-inline-start: 46px + 10px;
       width: calc(100% - (46px + 10px));
     }
   }
@@ -2450,10 +2451,9 @@ $ui-header-height: 55px;
   height: $ui-header-height;
   position: sticky;
   top: 0;
-  z-index: 2;
+  z-index: 3;
   justify-content: space-between;
   align-items: center;
-  overflow: hidden;
 
   &__logo {
     display: inline-flex;
@@ -2463,6 +2463,20 @@ $ui-header-height: 55px;
       height: $ui-header-height - 30px;
       width: auto;
     }
+
+    .logo--wordmark {
+      display: none;
+    }
+
+    @media screen and (min-width: 320px) {
+      .logo--wordmark {
+        display: block;
+      }
+
+      .logo--icon {
+        display: none;
+      }
+    }
   }
 
   &__links {
@@ -5209,7 +5223,7 @@ a.status-card.compact:hover {
     background: $ui-base-color;
     border-radius: 0 0 4px 4px;
     box-shadow: 4px 4px 6px rgba($base-shadow-color, 0.4);
-    z-index: 2;
+    z-index: 99;
     font-size: 13px;
     padding: 15px 5px;
 
@@ -6588,7 +6602,7 @@ a.status-card.compact:hover {
   background: darken($ui-base-color, 8%);
   border-radius: 4px;
   padding-bottom: 44px;
-  direction: ltr;
+  width: 100%;
 
   &.editable {
     border-radius: 0;
@@ -6655,7 +6669,6 @@ a.status-card.compact:hover {
   max-width: 100%;
   border-radius: 4px;
   box-sizing: border-box;
-  direction: ltr;
   color: $white;
 
   &.editable {
@@ -6699,6 +6712,7 @@ a.status-card.compact:hover {
 
   &__controls {
     position: absolute;
+    direction: ltr;
     z-index: 2;
     bottom: 0;
     inset-inline-start: 0;