Fix #38 - Unread indicator when new content appears above the fold

1 files changed, 16 insertions, 0 deletions

diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss
index bc56891f3..4b6bfca48 100644
--- a/app/assets/stylesheets/components.scss
+++ b/app/assets/stylesheets/components.scss
@@ -1079,6 +1079,11 @@ button.active i.fa-retweet {
   background: lighten($color1, 4%);
   flex: 0 0 auto;
   cursor: pointer;
+
+  &.active {
+    color: $color4;
+    text-shadow: 0 0 10px rgba($color4, 0.4);
+  }
 }
 
 .search {
@@ -1201,3 +1206,14 @@ button.active i.fa-retweet {
     }
   }
 }
+
+.status-list__unread-indicator, .notifications__unread-indicator {
+  position: absolute;
+  top: 48px;
+  left: 0;
+  width: 100%;
+  pointer-events: none;
+  height: 30px;
+  z-index: 2;
+  background: linear-gradient(to bottom, rgba($color4, 0.3) 0%, rgba($color4, 0) 60%);
+}