@MiltonChung
Posted
Hi Keven! First of all, nice use of semantic HTML and meaningful class names! Your card looks pretty nice but one thing that could be improved on is the spacing and the font sizes of your profile stats. I used justify-content: space-evenly; in the stats container so that each stat is evenly spaced in that space, but you can play around with different properties. For your mobile media query, there's really not much for that besides anything less than around 400px, but for your case, your background circles are what's making the website a little funky. I suggest you to put the background images in your body css like this:
body {
...
background-color: $dark-cyan;
background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
background-repeat: no-repeat, no-repeat;
background-position: right 50vw bottom 50vh, left 50vw top 50vh;
overflow: hidden;
}
so that it doesn't stretch out your website! You can always check out what I did in my profile
happy coding!
