Ahmed• 80
@Ahmed-l2
Posted
The design looks great, and the inclusion of camera holes is a subtle yet creative touch.
2
Design comparison
Solution retrospective
What are you most proud of, and what would you do differently next time?
Made with:
- HTML 🦴
- SCSS 🖌️
- JS 🤖
- mobile-first approach 📲📲
- autoprefixer for browser compatibility 🧭
- minified files for better performance 🚀
Community feedback
Hi @kodan96, Fantastic work on this challenge. It is amazing to see how you incorporate various elements in the notch.
I ran your site on Safari and I noticed a white rectangle around your phone. It is because of using outline: 2px solid #fff. Unfortunately, in Safari the outline appears to be a rectangle. Instead of outline you can use box-shadow: 0px 0px 0px 2px #fff;
Since you are using different values for box-shadow, you can combine more than 1 box-shadow values in 1 property like this:
box-shadow: 0px 0px 0px 2px #fff, 5px 5px 15px rgba(0,0,0,.3);
Let me know if this works
0
wizdom• 190
@wisdomcool11
Posted
Wow ! This amazing I let me go try it out
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord