Reintroduce glitch-soc avatar styling in public pages
This commit is contained in:
parent
a3dd2deda3
commit
7ab46b73bd
3 changed files with 11 additions and 0 deletions
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -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) {
|
||||||
|
|
Loading…
Reference in a new issue