Merge branch 'glitch'

3 files changed, 45 insertions, 3 deletions

diff --git a/app/javascript/flavours/glitch/styles/components/columns.scss b/app/javascript/flavours/glitch/styles/components/columns.scss
index c61cd038f..86c77f980 100644
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -503,3 +503,27 @@
     margin-left: 5px;
   }
 }
+
+.floating-action-button {
+  position: fixed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 3.9375rem;
+  height: 3.9375rem;
+  bottom: 1.3125rem;
+  right: 1.3125rem;
+  background: darken($ui-highlight-color, 3%);
+  color: $white;
+  border-radius: 50%;
+  font-size: 21px;
+  line-height: 21px;
+  text-decoration: none;
+  box-shadow: 2px 3px 9px rgba($base-shadow-color, 0.4);
+
+  &:hover,
+  &:focus,
+  &:active {
+    background: lighten($ui-highlight-color, 7%);
+  }
+}
diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss
index 0432b233a..6a9af4490 100644
--- a/app/javascript/flavours/glitch/styles/components/drawer.scss
+++ b/app/javascript/flavours/glitch/styles/components/drawer.scss
@@ -5,7 +5,6 @@
   padding: 10px 5px;
   width: 300px;
   flex: none;
-  contain: strict;
 
   &:first-child {
     padding-left: 10px;
@@ -49,7 +48,6 @@
     background: lighten($ui-base-color, 13%);
     overflow-x: hidden;
     overflow-y: auto;
-    contain: strict;
 
     & > .mastodon {
       flex: 1;
@@ -253,7 +251,6 @@
   background: $ui-base-color;
   overflow-x: hidden;
   overflow-y: auto;
-  contain: strict;
 
   & > header {
     border-bottom: 1px solid darken($ui-base-color, 4%);
diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss
index b5d79f4d7..17901f233 100644
--- a/app/javascript/flavours/glitch/styles/containers.scss
+++ b/app/javascript/flavours/glitch/styles/containers.scss
@@ -347,6 +347,23 @@
     margin-bottom: 10px;
     box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
 
+    &.inactive {
+      opacity: 0.5;
+
+      .public-account-header__image,
+      .avatar {
+        filter: grayscale(100%);
+      }
+
+      .logo-button {
+        background-color: $secondary-text-color;
+
+        svg path:last-child {
+          fill: $secondary-text-color;
+        }
+      }
+    }
+
     &__image {
       border-radius: 4px 4px 0 0;
       overflow: hidden;
@@ -588,6 +605,10 @@
               border-bottom: 4px solid $highlight-text-color;
               opacity: 1;
             }
+
+            &.inactive::after {
+              border-bottom-color: $secondary-text-color;
+            }
           }
 
           &:hover {