@andrijaivkovicSubmitted about 1 year ago
Hey everyone! This is my first Guru difficulty challenge that I've completed and I'm really proud of myself for completing it. Any and all feedback is appreciated!
Safni Nazar
@shafni50All comments
- @sandip-sadhukhanSubmitted about 1 year ago
Hi everyone!
I build this project to learn about redux tookit library and I succeed.
This is mobile friendly website build using NextJS, Chakra UI, TypeScript, Redux Tookit.
I learn so much with this project.
- @DeyanTopalovSubmitted over 1 year ago
----- Feedback Welcome -----
Specific Question to the Community:
Hi guys,
In the Hover section of my code, I have commented out the CSS nesting part, as it was behaving weirdly in Safari (the cards were growing on Hover, but not returning to the original size afterwords). I am using the latest Safari version and based on the info checked - it is supposed to support the CSS nesting. Any ideas of what & why went wrong?
Built with:
- Semantic HTML
- CSS3 Accessibility in mind
- Mobile first approach
- BEM naming
- CSS Reset and custom variables used
- CSS Pseudo elements for styling
Most Wanted 📜
Any feedback to help me improve my solution or optimize the code!
@shafni50Posted about 1 year agodid you use the css nesting? Nesting in css is old. If you want to use nesting the better go to Saas. even i tried nesting using vanilla css in my some projects but it completely breaks for responsiveness
But there is no any issue in your project. Great work! super responsive!!
1 - @MaciekLichonSubmitted over 1 year ago
React, TypeScript
- @ucolinmeeSubmitted over 1 year ago
Although I have been learning HTML and CSS for a while, I felt most of my coding experience was through tutorials. I wanted to escape tutorial hell, so this is one of the first times that I have built a project from scratch. I chose a simple challenge first so as to not get demoralized and over-confident, but I still ran into some challenges that I had to google search while building this. More specifically:
- How do you center an image in a div (I found myself calculating the values manually for the padding-top so the spacing looks even all around the 4 edges of the image, so maybe there is an easier way to resolve this)
- How do I check what fonts/colour codes are used in the final solution preview? I ended up using colour hunt to get the rough colour but I am slightly colour deficient LOL
Overall, good challenge and I am excited to try more challenges in the future and escape tutorial hell!!!
@shafni50Posted over 1 year agocenter a image in a div :
justify-content : center; align-items: center;
0
