From 90b13ffd009a431dbe98c37bc92ee59a6f0535f2 Mon Sep 17 00:00:00 2001 From: ThibG Date: Sat, 25 Jan 2020 19:40:36 +0100 Subject: Fix “new items glow” being displayed above settings and announcements (#12958) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/javascript/styles/mastodon/components.scss | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) (limited to 'app/javascript/styles') diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 6946971cd..7edd0ba14 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -3224,13 +3224,16 @@ a.status-card.compact:hover { .column-header__wrapper { position: relative; flex: 0 0 auto; + z-index: 1; &.active { + box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3); + &::before { display: block; content: ""; position: absolute; - top: 35px; + bottom: -13px; left: 0; right: 0; margin: 0 auto; @@ -3241,6 +3244,11 @@ a.status-card.compact:hover { background: radial-gradient(ellipse, rgba($ui-highlight-color, 0.23) 0%, rgba($ui-highlight-color, 0) 60%); } } + + .announcements { + z-index: 1; + position: relative; + } } .column-header { @@ -3273,8 +3281,6 @@ a.status-card.compact:hover { } &.active { - box-shadow: 0 1px 0 rgba($highlight-text-color, 0.3); - .column-header__icon { color: $highlight-text-color; text-shadow: 0 0 10px rgba($highlight-text-color, 0.4); @@ -3330,6 +3336,8 @@ a.status-card.compact:hover { color: $darker-text-color; transition: max-height 150ms ease-in-out, opacity 300ms linear; opacity: 1; + z-index: 1; + position: relative; &.collapsed { max-height: 0; -- cgit