diff --git a/app/javascript/flavours/glitch/styles/accounts.scss b/app/javascript/flavours/glitch/styles/accounts.scss index efff59ff6..133250822 100644 --- a/app/javascript/flavours/glitch/styles/accounts.scss +++ b/app/javascript/flavours/glitch/styles/accounts.scss @@ -443,6 +443,20 @@ overflow: hidden; text-overflow: ellipsis; height: 5.5em; + position: relative; + + &::after { + display: block; + content: ""; + width: 100%; + height: 100px; + position: absolute; + bottom: 0; + background: linear-gradient(to bottom, rgba($simple-background-color, 0.01) 0%, rgba($simple-background-color, 1) 100%); + left: 0; + border-radius: 0 0 4px 4px; + pointer-events: none; + } } } } diff --git a/app/javascript/flavours/glitch/styles/modal.scss b/app/javascript/flavours/glitch/styles/modal.scss index ceb79bbb9..10de454c6 100644 --- a/app/javascript/flavours/glitch/styles/modal.scss +++ b/app/javascript/flavours/glitch/styles/modal.scss @@ -18,3 +18,9 @@ background: url('~images/elephant_ui_plane.svg') no-repeat left bottom / contain; } } + +@media screen and (max-width: 600px) { + .account-header { + margin-top: 0; + } +} diff --git a/app/javascript/flavours/glitch/styles/stream_entries.scss b/app/javascript/flavours/glitch/styles/stream_entries.scss index 40963ae84..ec7f60014 100644 --- a/app/javascript/flavours/glitch/styles/stream_entries.scss +++ b/app/javascript/flavours/glitch/styles/stream_entries.scss @@ -312,53 +312,53 @@ .embed { .activity-stream { box-shadow: none; + } +} - .entry { - - .detailed-status.light { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - align-items: flex-start; +.entry { - .detailed-status__display-name { - flex: 1; - margin: 0 5px 15px 0; - } + .detailed-status.light { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + align-items: flex-start; - .button.button-secondary.logo-button { - flex: 0 auto; - font-size: 14px; + .detailed-status__display-name { + flex: 1; + margin: 0 5px 15px 0; + } - svg { - width: 20px; - height: auto; - vertical-align: middle; - margin-right: 5px; + .button.button-secondary.logo-button { + flex: 0 auto; + font-size: 14px; - path:first-child { - fill: $ui-primary-color; - } + svg { + width: 20px; + height: auto; + vertical-align: middle; + margin-right: 5px; - path:last-child { - fill: $simple-background-color; - } - } + path:first-child { + fill: $ui-primary-color; + } - &:active, - &:focus, - &:hover { - svg path:first-child { - fill: lighten($ui-primary-color, 4%); - } - } + path:last-child { + fill: $simple-background-color; } + } - .status__content, - .detailed-status__meta { - flex: 100%; + &:active, + &:focus, + &:hover { + svg path:first-child { + fill: lighten($ui-primary-color, 4%); } } } + + .status__content, + .detailed-status__meta { + flex: 100%; + } } }