diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2019-08-06 17:57:52 +0200 |
---|---|---|
committer | ThibG <thib@sitedethib.com> | 2019-09-02 10:57:44 +0200 |
commit | 8b630f7e54231dd840a463d1d4c00f36fbc09bc4 (patch) | |
tree | 12910b4dad5edbd28f4bf5cafed4f28d9cf0449f /app/javascript/flavours/glitch/styles | |
parent | 3c70fb91463ead824b80e94489688e125544c412 (diff) |
[Glitch] Add trends UI with admin and user settings
Port 9072fe5ab6464cc9c7a871d388464c7afcf41cd0 to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
3 files changed, 51 insertions, 3 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 9f59c81ff..85df8932a 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -903,6 +903,38 @@ } } } + + &__trends { + flex: 0 1 auto; + opacity: 1; + animation: fade 150ms linear; + margin-top: 10px; + + @media screen and (max-height: 810px) { + .trends__item:nth-child(3) { + display: none; + } + } + + @media screen and (max-height: 720px) { + .trends__item:nth-child(2) { + display: none; + } + } + + @media screen and (max-height: 670px) { + display: none; + } + + .trends__item { + border-bottom: 0; + padding: 10px; + + &__current { + color: $darker-text-color; + } + } + } } .column-link__badge { diff --git a/app/javascript/flavours/glitch/styles/components/search.scss b/app/javascript/flavours/glitch/styles/components/search.scss index 0e518997d..f8fc15b12 100644 --- a/app/javascript/flavours/glitch/styles/components/search.scss +++ b/app/javascript/flavours/glitch/styles/components/search.scss @@ -147,7 +147,8 @@ font-size: 24px; line-height: 36px; font-weight: 500; - text-align: center; + text-align: right; + padding-right: 15px; color: $secondary-text-color; } @@ -155,7 +156,12 @@ flex: 0 0 auto; width: 50px; - path { + path:first-child { + fill: rgba($highlight-text-color, 0.25) !important; + fill-opacity: 1 !important; + } + + path:last-child { stroke: lighten($highlight-text-color, 6%) !important; } } diff --git a/app/javascript/flavours/glitch/styles/components/single_column.scss b/app/javascript/flavours/glitch/styles/components/single_column.scss index aeb0abb55..1d8055fe5 100644 --- a/app/javascript/flavours/glitch/styles/components/single_column.scss +++ b/app/javascript/flavours/glitch/styles/components/single_column.scss @@ -54,13 +54,24 @@ margin-bottom: 10px; height: calc(100% - 20px); overflow-y: auto; + display: flex; + flex-direction: column; + + & > a { + flex: 0 0 auto; + } hr { + flex: 0 0 auto; border: 0; background: transparent; border-top: 1px solid lighten($ui-base-color, 4%); margin: 10px 0; } + + .flex-spacer { + background: transparent; + } } @media screen and (min-width: 600px) { @@ -216,7 +227,6 @@ } .getting-started__wrapper, - .getting-started__trends, .search { margin-bottom: 10px; } |