Submitted
Rayyan Nafees
@RayyanNafees
All solutions
Submitted
What are you most proud of, and what would you do differently next time?
I was proud of completing a frontend project at this speed
Next time while defining the themes I would probably love to first create crap HTML and then add colors & padding to each element respectively that would enhance my speed
What challenges did you encounter, and how did you overcome them?
I faced challenge while adding the local Inter font in the
assets/fonts
directory using the@font-face
CSS ruleCouldn't get that working myself
Overcame it by pasting the CSS from FontSource CDN
What specific areas of your project would you like help with?
I would appreciate if anyone could help me adding the
@font-face
in CSS for local fontsSubmitted
What are you most proud of, and what would you do differently next time?
In this project i was proud of using vanilla html and CSS (Since ti was too basic of a project) to complete it without the sue of any external libraries / frameworks
Also the fact that I instinctively first created a theme.css file with variables & default styles and then separated my main.css file for styling each element
The overall neatness of my CSS file by utilising CSS nesting was also something to be happy about in the end
What challenges did you encounter, and how did you overcome them?
I first encountered the challenge of guessing the aspect ratio of the image at the top... Used the new in-built Windows Screen Ruler inside Microsoft PowerToys app to get that
Then guessing the padding of each element, using a wild guess of
1rem
workedThen I encountered on how to add color to the list markers, thanks to css-tricks i was able to learn about the
li::marker
pseudo elementMy bad for not taking the mobile-first approach since the start, I then had to put my head around using media queries from MDN docs
What specific areas of your project would you like help with?
I'd like to have help in.. using CSS variables inside media queries, could't get that working
And also on what should be the right place to put the ending Credits text at the bottom most