From 7ab46b73bd8f0c1435b2bb0fcd7d90d0f308874e Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 31 Jul 2018 23:34:52 +0200 Subject: [PATCH] Reintroduce glitch-soc avatar styling in public pages --- app/javascript/flavours/glitch/styles/about.scss | 3 +++ app/javascript/flavours/glitch/styles/accounts.scss | 2 ++ app/javascript/flavours/glitch/styles/containers.scss | 6 ++++++ 3 files changed, 11 insertions(+) diff --git a/app/javascript/flavours/glitch/styles/about.scss b/app/javascript/flavours/glitch/styles/about.scss index 42344d29a..74807bb65 100644 --- a/app/javascript/flavours/glitch/styles/about.scss +++ b/app/javascript/flavours/glitch/styles/about.scss @@ -574,6 +574,7 @@ $small-breakpoint: 960px; .avatar { width: 80px; height: 80px; + @include avatar-size(80px); margin: 0 auto; margin-bottom: 15px; @@ -582,6 +583,7 @@ $small-breakpoint: 960px; width: 80px; height: 80px; border-radius: 48px; + @include avatar-radius(); } } @@ -716,6 +718,7 @@ $small-breakpoint: 960px; &__avatar { width: 44px; height: 44px; + @include avatar-size(48px); background-size: 44px 44px; } diff --git a/app/javascript/flavours/glitch/styles/accounts.scss b/app/javascript/flavours/glitch/styles/accounts.scss index c27bc0df3..ac1989832 100644 --- a/app/javascript/flavours/glitch/styles/accounts.scss +++ b/app/javascript/flavours/glitch/styles/accounts.scss @@ -59,6 +59,7 @@ flex: 0 0 auto; width: 48px; height: 48px; + @include avatar-size(48px); padding-top: 2px; img { @@ -67,6 +68,7 @@ display: block; margin: 0; border-radius: 4px; + @include avatar-radius(); background: darken($ui-base-color, 8%); } } diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss index 7b339277f..01c8ebbaf 100644 --- a/app/javascript/flavours/glitch/styles/containers.scss +++ b/app/javascript/flavours/glitch/styles/containers.scss @@ -83,6 +83,7 @@ .avatar { width: 40px; height: 40px; + @include avatar-size(40px); margin-right: 8px; img { @@ -91,6 +92,7 @@ display: block; margin: 0; border-radius: 4px; + @include avatar-radius(); } } @@ -337,6 +339,7 @@ display: block; width: 120px; height: 120px; + @include avatar-size(120px); padding-left: 20px - 4px; flex: 0 0 auto; @@ -348,6 +351,7 @@ border-radius: 50%; border: 4px solid lighten($ui-base-color, 4%); background: darken($ui-base-color, 8%); + @include avatar-radius(); } } @@ -364,12 +368,14 @@ .avatar { width: 48px; height: 48px; + @include avatar-size(48px); padding: 7px 0; padding-left: 10px; img { border: 0; border-radius: 4px; + @include avatar-radius(); } @media screen and (max-width: 360px) {