From d61a6271c68ecca1745f2683d25ec58573dd2819 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Sun, 9 Jun 2019 12:07:23 +0200 Subject: Add DM conversations mode similar to upstream --- .../flavours/glitch/styles/components/accounts.scss | 12 ++++++++++++ app/javascript/flavours/glitch/styles/components/index.scss | 8 ++++++-- app/javascript/flavours/glitch/styles/components/status.scss | 9 +++++---- .../flavours/glitch/styles/mastodon-light/diff.scss | 5 +++-- 4 files changed, 26 insertions(+), 8 deletions(-) (limited to 'app/javascript/flavours/glitch/styles') diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss index c0340e3f8..d2233207d 100644 --- a/app/javascript/flavours/glitch/styles/components/accounts.scss +++ b/app/javascript/flavours/glitch/styles/components/accounts.scss @@ -46,6 +46,18 @@ vertical-align: middle; margin-right: 5px; } + + &-composite { + @include avatar-radius; + overflow: hidden; + + & div { + @include avatar-radius; + float: left; + position: relative; + box-sizing: border-box; + } + } } .account__avatar-overlay { diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 63211392e..9db64bbcb 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -287,8 +287,12 @@ text-overflow: ellipsis; white-space: nowrap; + a { + color: inherit; + text-decoration: inherit; + } + strong { - display: block; height: 18px; font-size: 16px; font-weight: 500; @@ -308,7 +312,7 @@ white-space: nowrap; } - &:hover { + > a:hover { strong { text-decoration: underline; } diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index 327694a7e..ee4440e89 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -209,7 +209,7 @@ outline: 0; background: lighten($ui-base-color, 4%); - .status.status-direct { + &.status.status-direct:not(.read) { background: lighten($ui-base-color, 12%); &.muted { @@ -249,8 +249,9 @@ margin-top: 8px; } - &.status-direct { + &.status-direct:not(.read) { background: lighten($ui-base-color, 8%); + border-bottom-color: lighten($ui-base-color, 12%); } &.light { @@ -333,7 +334,7 @@ &:focus > .status__content:after { background: linear-gradient(rgba(lighten($ui-base-color, 4%), 0), rgba(lighten($ui-base-color, 4%), 1)); } - &.status-direct> .status__content:after { + &.status-direct:not(.read)> .status__content:after { background: linear-gradient(rgba(lighten($ui-base-color, 8%), 0), rgba(lighten($ui-base-color, 8%), 1)); } @@ -599,7 +600,7 @@ } } -.status__display-name, +a.status__display-name, .reply-indicator__display-name, .detailed-status__display-name, .account__display-name { diff --git a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss index ce2a2eeb5..3e4a15c9f 100644 --- a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss +++ b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss @@ -27,15 +27,16 @@ } } -.status.status-direct { +.status.status-direct:not(.read) { background: darken($ui-base-color, 8%); + border-bottom-color: darken($ui-base-color, 12%); &.collapsed> .status__content:after { background: linear-gradient(rgba(darken($ui-base-color, 8%), 0), rgba(darken($ui-base-color, 8%), 1)); } } -.focusable:focus.status.status-direct { +.focusable:focus.status.status-direct:not(.read) { background: darken($ui-base-color, 4%); &.collapsed> .status__content:after { -- cgit