Fix glitch-soc's thread line styling (mastodon#2214)

Thread lines were misaligned in glitch-soc because we have less padding and larger avatar sizes.
ClearlyClaire · May 8, 2023 · f89f3a8 · f89f3a8
1 parent 61f3e0e
commit f89f3a8
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -1047,12 +1047,12 @@ a.status-card.compact:hover {
   }
 
   &__line {
-    height: 16px - 4px;
+    height: 10px - 4px;
     border-inline-start: 2px solid lighten($ui-base-color, 8%);
     width: 0;
     position: absolute;
     top: 0;
-    inset-inline-start: 16px + ((46px - 2px) * 0.5);
+    inset-inline-start: 14px + ((48px - 2px) * 0.5);
 
     &--full {
       top: 0;
@@ -1062,17 +1062,17 @@ a.status-card.compact:hover {
         content: '';
         display: block;
         position: absolute;
-        top: 16px - 4px;
-        height: 46px + 4px + 4px;
+        top: 10px - 4px;
+        height: 48px + 4px + 4px;
         width: 2px;
         background: $ui-base-color;
         inset-inline-start: -2px;
       }
     }
 
     &--first {
-      top: 16px + 46px + 4px;
-      height: calc(100% - (16px + 46px + 4px));
+      top: 10px + 48px + 4px;
+      height: calc(100% - (10px + 48px + 4px));
 
       &::before {
         display: none;