about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/styles
diff options
context:
space:
mode:
authorThibaut Girka <thib@sitedethib.com>2019-01-19 18:55:27 +0100
committerThibaut Girka <thib@sitedethib.com>2019-01-20 11:38:09 +0100
commit3e8b6239751673a0672b1a51c6c7f0a7d5e1eab8 (patch)
treec0f01a1bdda22016f659d17eefe90609afc8aab1 /app/javascript/flavours/glitch/styles
parent5e0cf92fd145b27053389e5ffcce48da77439713 (diff)
[Glitch] Redesign public hashtag page to use a masonry layout
Port bc642ac24b49c14dca382e7aabbc16130293d2f4 to glitch flavour
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
-rw-r--r--app/javascript/flavours/glitch/styles/widgets.scss27
1 files changed, 27 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/styles/widgets.scss b/app/javascript/flavours/glitch/styles/widgets.scss
index 87e633c70..cabef807e 100644
--- a/app/javascript/flavours/glitch/styles/widgets.scss
+++ b/app/javascript/flavours/glitch/styles/widgets.scss
@@ -425,3 +425,30 @@
     border-radius: 0;
   }
 }
+
+$maximum-width: 1235px;
+$fluid-breakpoint: $maximum-width + 20px;
+
+.statuses-grid {
+  min-height: 600px;
+
+  &__item {
+    width: (960px - 20px) / 3;
+
+    @media screen and (max-width: $fluid-breakpoint) {
+      width: (940px - 20px) / 3;
+    }
+
+    @media screen and (max-width: $no-gap-breakpoint) {
+      width: 100vw;
+    }
+  }
+
+  .detailed-status {
+    border-radius: 4px;
+
+    @media screen and (max-width: $no-gap-breakpoint) {
+      border-bottom: 1px solid lighten($ui-base-color, 12%);
+    }
+  }
+}