Add a background to the collapse button when active to make collapsed…

… more visible when scrolling (glitch-soc#23)
Teqed · Jan 4, 2023 · 6dfacc6 · 6dfacc6
1 parent 087dada
commit 6dfacc6
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -332,6 +332,10 @@
   &.status-direct {
     background: lighten($ui-base-color, 8%);
     border-bottom-color: lighten($ui-base-color, 12%);
+
+    .status__collapse-button.active {
+      background-image: linear-gradient(rgba(lighten($ui-base-color, 16%), 255) 0 0);
+    }
   }
 
   &.light {
@@ -492,6 +496,10 @@
     padding-right: 2px;
   }
 
+  .status__collapse-button.active {
+    background-image: linear-gradient(rgba(lighten($ui-base-color, 8%), 255) 0 0);
+  }
+
   .status__collapse-button.active > .fa-angle-double-up {
     transform: rotate(-180deg);
   }