[Glitch] Fix column header scrolling with the page

Port 706a48ee1f to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
2019-08-01 12:26:58 +02:00
parent 3edb816eb0
commit fdadd520b1
8 changed files with 45 additions and 15 deletions
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -52,6 +52,26 @@
  }
 }

+.tabs-bar__wrapper {
+  background: darken($ui-base-color, 8%);
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  padding-top: 0;
+
+  @media screen and (min-width: $no-gap-breakpoint) {
+    padding-top: 10px;
+  }
+
+  .tabs-bar {
+    margin-bottom: 0;
+
+    @media screen and (min-width: $no-gap-breakpoint) {
+      margin-bottom: 10px;
+    }
+  }
+}
+
 .react-swipeable-view-container {
  &,
  .columns-area,