diff options
Diffstat (limited to 'web/source/css')
| -rw-r--r-- | web/source/css/profile.css | 29 |
1 files changed, 24 insertions, 5 deletions
diff --git a/web/source/css/profile.css b/web/source/css/profile.css index a966d768a..3f7f43d0d 100644 --- a/web/source/css/profile.css +++ b/web/source/css/profile.css @@ -82,18 +82,37 @@ margin-top: calc(-1 * $overlap); gap: 0 1rem; - .avatar { + .avatar-image-wrapper { grid-area: avatar; - height: $avatar-size; - width: $avatar-size; + border: 0.2rem solid $avatar-border; border-radius: $br; - overflow: hidden; /* prevents image extending beyond rounded borders */ + + /* + Wrapper always same + size + proportions no + matter image inside. + */ + height: $avatar-size; + width: $avatar-size; - img { + .avatar { + /* + Fit 100% of the wrapper. + */ height: 100%; width: 100%; + + /* + Normalize non-square images. + */ object-fit: cover; + + /* + Prevent image extending + beyond rounded borders. + */ + border-radius: $br-inner; } } |