From b0630ddc8261250c5edbf2907648695041649e98 Mon Sep 17 00:00:00 2001
From: ThibG <thib@sitedethib.com>
Date: Sun, 21 Jul 2019 00:53:28 +0200
Subject: Original upstream merge

---
 .../flavours/glitch/styles/containers.scss         |   4 +
 app/javascript/flavours/glitch/styles/index.scss   |   2 +-
 .../flavours/glitch/styles/statuses.scss           | 213 +++++++++++++++++++++
 .../flavours/glitch/styles/stream_entries.scss     | 213 ---------------------
 4 files changed, 218 insertions(+), 214 deletions(-)
 create mode 100644 app/javascript/flavours/glitch/styles/statuses.scss
 delete mode 100644 app/javascript/flavours/glitch/styles/stream_entries.scss

(limited to 'app/javascript/flavours')

diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss
index b0c187eab..a1e4f135c 100644
--- a/app/javascript/flavours/glitch/styles/containers.scss
+++ b/app/javascript/flavours/glitch/styles/containers.scss
@@ -146,6 +146,10 @@
     min-height: 100%;
   }
 
+  .flash-message {
+    margin-bottom: 10px;
+  }
+
   @media screen and (max-width: 738px) {
     grid-template-columns: minmax(0, 50%) minmax(0, 50%);
 
diff --git a/app/javascript/flavours/glitch/styles/index.scss b/app/javascript/flavours/glitch/styles/index.scss
index 3af10dfa1..05d6b20b1 100644
--- a/app/javascript/flavours/glitch/styles/index.scss
+++ b/app/javascript/flavours/glitch/styles/index.scss
@@ -14,7 +14,7 @@
 @import 'widgets';
 @import 'forms';
 @import 'accounts';
-@import 'stream_entries';
+@import 'statuses';
 @import 'components/index';
 @import 'polls';
 @import 'about';
diff --git a/app/javascript/flavours/glitch/styles/statuses.scss b/app/javascript/flavours/glitch/styles/statuses.scss
new file mode 100644
index 000000000..de9c2612c
--- /dev/null
+++ b/app/javascript/flavours/glitch/styles/statuses.scss
@@ -0,0 +1,213 @@
+.activity-stream {
+  box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
+  border-radius: 4px;
+  overflow: hidden;
+  margin-bottom: 10px;
+
+  @media screen and (max-width: $no-gap-breakpoint) {
+    margin-bottom: 0;
+    border-radius: 0;
+    box-shadow: none;
+  }
+
+  &--headless {
+    border-radius: 0;
+    margin: 0;
+    box-shadow: none;
+
+    .detailed-status,
+    .status {
+      border-radius: 0 !important;
+    }
+  }
+
+  div[data-component] {
+    width: 100%;
+  }
+
+  .entry {
+    background: $ui-base-color;
+
+    .detailed-status,
+    .status,
+    .load-more {
+      animation: none;
+    }
+
+    &:last-child {
+      .detailed-status,
+      .status,
+      .load-more {
+        border-bottom: 0;
+        border-radius: 0 0 4px 4px;
+      }
+    }
+
+    &:first-child {
+      .detailed-status,
+      .status,
+      .load-more {
+        border-radius: 4px 4px 0 0;
+      }
+
+      &:last-child {
+        .detailed-status,
+        .status,
+        .load-more {
+          border-radius: 4px;
+        }
+      }
+    }
+
+    @media screen and (max-width: 740px) {
+      .detailed-status,
+      .status,
+      .load-more {
+        border-radius: 0 !important;
+      }
+    }
+  }
+
+  &--highlighted .entry {
+    background: lighten($ui-base-color, 8%);
+  }
+}
+
+.button.logo-button {
+  flex: 0 auto;
+  font-size: 14px;
+  background: $ui-highlight-color;
+  color: $primary-text-color;
+  text-transform: none;
+  line-height: 36px;
+  height: auto;
+  padding: 3px 15px;
+  border: 0;
+
+  svg {
+    width: 20px;
+    height: auto;
+    vertical-align: middle;
+    margin-right: 5px;
+    fill: $primary-text-color;
+  }
+
+  &:active,
+  &:focus,
+  &:hover {
+    background: lighten($ui-highlight-color, 10%);
+  }
+
+  &:disabled,
+  &.disabled {
+    &:active,
+    &:focus,
+    &:hover {
+      background: $ui-primary-color;
+    }
+  }
+
+  &.button--destructive {
+    &:active,
+    &:focus,
+    &:hover {
+      background: $error-red;
+    }
+  }
+
+  @media screen and (max-width: $no-gap-breakpoint) {
+    svg {
+      display: none;
+    }
+  }
+}
+
+.embed,
+.public-layout {
+  .detailed-status {
+    padding: 15px;
+  }
+
+  .status {
+    padding: 15px 15px 15px (48px + 15px * 2);
+    min-height: 48px + 2px;
+
+    &__avatar {
+      left: 15px;
+      top: 17px;
+    }
+
+    &__content {
+      padding-top: 5px;
+    }
+
+    &__prepend {
+      padding: 8px 0;
+      padding-bottom: 2px;
+      margin: initial;
+      margin-left: 48px + 15px * 2;
+      padding-top: 15px;
+    }
+
+    &__prepend-icon-wrapper {
+      position: absolute;
+      margin: initial;
+      float: initial;
+      width: auto;
+      left: -32px;
+    }
+
+    .media-gallery,
+    &__action-bar,
+    .video-player {
+      margin-top: 10px;
+    }
+  }
+}
+
+// Styling from upstream's WebUI, as public pages use the same layout
+.embed,
+.public-layout {
+  .status {
+    .status__info {
+      font-size: 15px;
+      display: initial;
+    }
+
+    .status__relative-time {
+      color: $dark-text-color;
+      float: right;
+      font-size: 14px;
+      width: auto;
+      margin: initial;
+      padding: initial;
+    }
+
+    .status__info .status__display-name {
+      display: block;
+      max-width: 100%;
+      padding: 6px 0;
+      padding-right: 25px;
+      margin: initial;
+
+      .display-name strong {
+        display: inline;
+      }
+    }
+
+    .status__avatar {
+      height: 48px;
+      position: absolute;
+      width: 48px;
+      margin: initial;
+    }
+  }
+}
+
+.rtl {
+  .embed, .public-layout {
+    .status .status__relative-time {
+      float: left;
+    }
+  }
+}
diff --git a/app/javascript/flavours/glitch/styles/stream_entries.scss b/app/javascript/flavours/glitch/styles/stream_entries.scss
deleted file mode 100644
index de9c2612c..000000000
--- a/app/javascript/flavours/glitch/styles/stream_entries.scss
+++ /dev/null
@@ -1,213 +0,0 @@
-.activity-stream {
-  box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
-  border-radius: 4px;
-  overflow: hidden;
-  margin-bottom: 10px;
-
-  @media screen and (max-width: $no-gap-breakpoint) {
-    margin-bottom: 0;
-    border-radius: 0;
-    box-shadow: none;
-  }
-
-  &--headless {
-    border-radius: 0;
-    margin: 0;
-    box-shadow: none;
-
-    .detailed-status,
-    .status {
-      border-radius: 0 !important;
-    }
-  }
-
-  div[data-component] {
-    width: 100%;
-  }
-
-  .entry {
-    background: $ui-base-color;
-
-    .detailed-status,
-    .status,
-    .load-more {
-      animation: none;
-    }
-
-    &:last-child {
-      .detailed-status,
-      .status,
-      .load-more {
-        border-bottom: 0;
-        border-radius: 0 0 4px 4px;
-      }
-    }
-
-    &:first-child {
-      .detailed-status,
-      .status,
-      .load-more {
-        border-radius: 4px 4px 0 0;
-      }
-
-      &:last-child {
-        .detailed-status,
-        .status,
-        .load-more {
-          border-radius: 4px;
-        }
-      }
-    }
-
-    @media screen and (max-width: 740px) {
-      .detailed-status,
-      .status,
-      .load-more {
-        border-radius: 0 !important;
-      }
-    }
-  }
-
-  &--highlighted .entry {
-    background: lighten($ui-base-color, 8%);
-  }
-}
-
-.button.logo-button {
-  flex: 0 auto;
-  font-size: 14px;
-  background: $ui-highlight-color;
-  color: $primary-text-color;
-  text-transform: none;
-  line-height: 36px;
-  height: auto;
-  padding: 3px 15px;
-  border: 0;
-
-  svg {
-    width: 20px;
-    height: auto;
-    vertical-align: middle;
-    margin-right: 5px;
-    fill: $primary-text-color;
-  }
-
-  &:active,
-  &:focus,
-  &:hover {
-    background: lighten($ui-highlight-color, 10%);
-  }
-
-  &:disabled,
-  &.disabled {
-    &:active,
-    &:focus,
-    &:hover {
-      background: $ui-primary-color;
-    }
-  }
-
-  &.button--destructive {
-    &:active,
-    &:focus,
-    &:hover {
-      background: $error-red;
-    }
-  }
-
-  @media screen and (max-width: $no-gap-breakpoint) {
-    svg {
-      display: none;
-    }
-  }
-}
-
-.embed,
-.public-layout {
-  .detailed-status {
-    padding: 15px;
-  }
-
-  .status {
-    padding: 15px 15px 15px (48px + 15px * 2);
-    min-height: 48px + 2px;
-
-    &__avatar {
-      left: 15px;
-      top: 17px;
-    }
-
-    &__content {
-      padding-top: 5px;
-    }
-
-    &__prepend {
-      padding: 8px 0;
-      padding-bottom: 2px;
-      margin: initial;
-      margin-left: 48px + 15px * 2;
-      padding-top: 15px;
-    }
-
-    &__prepend-icon-wrapper {
-      position: absolute;
-      margin: initial;
-      float: initial;
-      width: auto;
-      left: -32px;
-    }
-
-    .media-gallery,
-    &__action-bar,
-    .video-player {
-      margin-top: 10px;
-    }
-  }
-}
-
-// Styling from upstream's WebUI, as public pages use the same layout
-.embed,
-.public-layout {
-  .status {
-    .status__info {
-      font-size: 15px;
-      display: initial;
-    }
-
-    .status__relative-time {
-      color: $dark-text-color;
-      float: right;
-      font-size: 14px;
-      width: auto;
-      margin: initial;
-      padding: initial;
-    }
-
-    .status__info .status__display-name {
-      display: block;
-      max-width: 100%;
-      padding: 6px 0;
-      padding-right: 25px;
-      margin: initial;
-
-      .display-name strong {
-        display: inline;
-      }
-    }
-
-    .status__avatar {
-      height: 48px;
-      position: absolute;
-      width: 48px;
-      margin: initial;
-    }
-  }
-}
-
-.rtl {
-  .embed, .public-layout {
-    .status .status__relative-time {
-      float: left;
-    }
-  }
-}
-- 
cgit