1 files changed, 71 insertions, 0 deletions
diff --git a/app/javascript/styles/containers.scss b/app/javascript/styles/containers.scss
new file mode 100644
index 000000000..6f339f998
--- /dev/null
+++ b/app/javascript/styles/containers.scss
@@ -0,0 +1,71 @@
+.container {
+  width: 700px;
+  margin: 0 auto;
+  margin-top: 40px;
+
+  @media screen and (max-width: 700px) {
+    width: 100%;
+    margin: 0;
+  }
+}
+
+.mastodon-column-container {
+  display: flex;
+  height: 100%;
+  width: 100%;
+
+  // 707568 - height 100% doesn't work on child of a flex item - chromium - Monorail
+  // https://bugs.chromium.org/p/chromium/issues/detail?id=707568
+  flex: 1 1 auto;
+}
+
+.logo-container {
+  max-width: 400px;
+  margin: 100px auto;
+  margin-bottom: 0;
+  cursor: default;
+
+  @media screen and (max-width: 360px) {
+    margin: 30px auto;
+  }
+
+  h1 {
+    display: block;
+    text-align: center;
+    color: $color5;
+    font-size: 48px;
+    font-weight: 500;
+
+    img {
+      display: block;
+      margin: 20px auto;
+      width: 180px;
+      height: 180px;
+    }
+
+    a {
+      color: inherit;
+      text-decoration: none;
+      outline: 0;
+
+      img {
+        opacity: 0.8;
+        transition: opacity 0.8s ease;
+      }
+
+      &:hover {
+        img {
+          opacity: 1;
+          transition-duration: 0.2s;
+        }
+      }
+    }
+
+    small {
+      display: block;
+      font-size: 12px;
+      font-weight: 400;
+      font-family: 'Roboto Mono', monospace;
+    }
+  }
+}