vylion/littlelink
vylion/littlelink
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added radius crop on avatar image

Browse source 
Default is 50% for a true circle.
This commit is contained in:
John Fox 2022-06-03 16:21:52 -04:00
parent 596b41ed77
commit 2262eb47e3
2 changed files with 14 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
css/skeleton-auto.css
View file

@ -194,3 +194,16 @@ hr {
border-width: 0; border-width: 0;
border-top: 1px solid #e1e1e1; border-top: 1px solid #e1e1e1;
} }
/* Radius values:
10%-40%: Squircles
50% (default): True circle
*/
.avatar {
width: 128px;
height: 128px;
object-fit: cover;
background-position: center;
border-radius: 50%;
}

2
index.html
View file

@ -66,7 +66,7 @@
--> -->
<!-- Your Image Here --> <!-- Your Image Here -->
<img src="images/avatar.png" srcset="images/avatar@2x.png 2x" alt="Falc0n2k's avatar"> <img src="images/avatar.png" class="avatar" srcset="images/avatar@2x.png 2x" alt="Falc0n2k's avatar">
<!-- Title --> <!-- Title -->
<h1>Falc0n2k</h1> <h1>Falc0n2k</h1>