3 files changed, 100 insertions, 2 deletions

diff --git a/webapp/sass/responsive/_desktop.scss b/webapp/sass/responsive/_desktop.scss
index ccd6f0226..3b36fb75f 100644
--- a/webapp/sass/responsive/_desktop.scss
+++ b/webapp/sass/responsive/_desktop.scss
@@ -17,6 +17,14 @@
 }
 
 @media screen and (max-width: 1440px) {
+    .inner-wrap {
+        &.move--left {
+            .help__format-text {
+                display: none;
+            }
+        }
+    }
+
     .date-separator,
     .new-separator {
         &.hovered--comment {
@@ -40,6 +48,11 @@
         }
     }
 
+    .backstage-content {
+        margin: 46px 46px 46px 150px;
+    }
+
+
     .inner-wrap {
         &.move--left {
             .file-overlay {
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 0e1a471cf..38476485d 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -1,6 +1,16 @@
 @charset 'UTF-8';
 
 @media screen and (max-width: 768px) {
+    .backstage-filters {
+        display: block;
+
+        .backstage-filter__search {
+            border-bottom: 1px solid $light-gray;
+            margin: 10px 0;
+            width: 100%;
+        }
+    }
+
     .signup-team__container {
         font-size: 1em;
     }
@@ -675,9 +685,9 @@
     }
 
     .sidebar--right {
-        width: 100%;
-        right: 0;
         @include translate3d(100%, 0, 0);
+        right: 0;
+        width: 100%;
         z-index: 5;
 
         &.move--left {
@@ -786,6 +796,40 @@
 }
 
 @media screen and (max-width: 640px) {
+    .modal {
+        .about-modal {
+            .about-modal__content {
+                display: block;
+            }
+
+            .about-modal__hash {
+                p {
+                    word-break: break-all;
+
+                    &:first-child {
+                        float: none;
+                    }
+                }
+            }
+
+            .about-modal__logo {
+                float: none;
+                padding: 0;
+                text-align: center;
+                width: 100%;
+
+                svg {
+                    height: 100px;
+                    width: 100px;
+                }
+            }
+
+            .about-modal__logo + div {
+                padding: 2em 0 0;
+            }
+        }
+    }
+
     .access-history__table {
         > div {
             display: block;
@@ -819,6 +863,30 @@
 }
 
 @media screen and (max-width: 480px) {
+    .backstage-header {
+        h1 {
+            float: none;
+            margin-bottom: 15px;
+        }
+
+        .add-integrations-link {
+            float: none;
+        }
+    }
+
+    .add-integration {
+        width: 100%;
+    }
+
+    .backstage-list__item {
+        display: block;
+
+        .actions {
+            margin-top: 10px;
+            padding: 0;
+        }
+    }
+
     .modal {
         .settings-modal {
             .settings-table {
diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss
index 0a725a558..db2a8d7b9 100644
--- a/webapp/sass/responsive/_tablet.scss
+++ b/webapp/sass/responsive/_tablet.scss
@@ -15,6 +15,23 @@
         }
     }
 
+    .backstage-content {
+        margin: 30px;
+        max-width: 100%;
+        padding: 0;
+    }
+
+    .backstage-sidebar {
+        height: auto;
+        padding: 30px 15px 0;
+        position: relative;
+        width: 100%;
+    }
+
+    .help__format-text {
+        display: none;
+    }
+
     .inner-wrap {
         &.move--left {
             margin-right: 0;