me/glitchier-soc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Reintroduce glitch-soc avatar styling in public pages

Browse source
This commit is contained in:
Thibaut Girka 2018-07-31 23:34:52 +02:00
parent a3dd2deda3
commit 7ab46b73bd
3 changed files with 11 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/javascript/flavours/glitch/styles/about.scss
View file

@ -574,6 +574,7 @@ $small-breakpoint: 960px;
.avatar { .avatar {
width: 80px; width: 80px;
height: 80px; height: 80px;
@include avatar-size(80px);
margin: 0 auto; margin: 0 auto;
margin-bottom: 15px; margin-bottom: 15px;
@ -582,6 +583,7 @@ $small-breakpoint: 960px;
width: 80px; width: 80px;
height: 80px; height: 80px;
border-radius: 48px; border-radius: 48px;
@include avatar-radius();
} }
} }
@ -716,6 +718,7 @@ $small-breakpoint: 960px;
&__avatar { &__avatar {
width: 44px; width: 44px;
height: 44px; height: 44px;
@include avatar-size(48px);
background-size: 44px 44px; background-size: 44px 44px;
} }

2
app/javascript/flavours/glitch/styles/accounts.scss
View file

@ -59,6 +59,7 @@
flex: 0 0 auto; flex: 0 0 auto;
width: 48px; width: 48px;
height: 48px; height: 48px;
@include avatar-size(48px);
padding-top: 2px; padding-top: 2px;
img { img {
@ -67,6 +68,7 @@
display: block; display: block;
margin: 0; margin: 0;
border-radius: 4px; border-radius: 4px;
@include avatar-radius();
background: darken($ui-base-color, 8%); background: darken($ui-base-color, 8%);
} }
} }

6
app/javascript/flavours/glitch/styles/containers.scss
View file

@ -83,6 +83,7 @@
.avatar { .avatar {
width: 40px; width: 40px;
height: 40px; height: 40px;
@include avatar-size(40px);
margin-right: 8px; margin-right: 8px;
img { img {
@ -91,6 +92,7 @@
display: block; display: block;
margin: 0; margin: 0;
border-radius: 4px; border-radius: 4px;
@include avatar-radius();
} }
} }
@ -337,6 +339,7 @@
display: block; display: block;
width: 120px; width: 120px;
height: 120px; height: 120px;
@include avatar-size(120px);
padding-left: 20px - 4px; padding-left: 20px - 4px;
flex: 0 0 auto; flex: 0 0 auto;
@ -348,6 +351,7 @@
border-radius: 50%; border-radius: 50%;
border: 4px solid lighten($ui-base-color, 4%); border: 4px solid lighten($ui-base-color, 4%);
background: darken($ui-base-color, 8%); background: darken($ui-base-color, 8%);
@include avatar-radius();
} }
} }
@ -364,12 +368,14 @@
.avatar { .avatar {
width: 48px; width: 48px;
height: 48px; height: 48px;
@include avatar-size(48px);
padding: 7px 0; padding: 7px 0;
padding-left: 10px; padding-left: 10px;
img { img {
border: 0; border: 0;
border-radius: 4px; border-radius: 4px;
@include avatar-radius();
} }
@media screen and (max-width: 360px) { @media screen and (max-width: 360px) {