This was my first time playing around with grids in tailwind and I wasn't very familiar with them in general. I'm really glad I finally dove in and played with them when I created this component.
Nice work on the project! The modularity of the code, especially with the separate card component, is a great touch. I see you used TypeScript and Tailwind CSS, which is impressive – though I’m not super familiar with them, I can tell they add a lot of structure.
Some small details weren’t fully followed, but it’s clear you know how to implement changes. By the way, I noticed there are documents from other projects in the repo.
The code is clean and modular, especially with CustomCard, which keeps things reusable. Just a few typos to fix. Looks like NativeBaseProvider is handling the styling and theme, but I’m not too familiar with it yet.
Responsive layouts.
What challenges did you encounter, and how did you overcome them?Creating different layouts for mobiles and desktop. At first I had problems with positionig different divs. But after learning responsive layouts: display: flex etc. I overcame this problem.
Hey,
Thanks for introducing me to the <picture> element! I didn’t know about it, and it’s a great way to handle responsive images.
The rest of the code looks solid! Just a heads up about the nested CSS—if it's not SCSS, it won’t work in regular CSS. You might want to either remove the nesting or set up Sass.
Everything else is great though, nice job! 👍
Good clarity! Well done!
Managed to finish the project in less time than usual.
What challenges did you encounter, and how did you overcome them?I couldn't find a way to make the pointer cursor black.
What specific areas of your project would you like help with?I read about how to make the pointer cursor black and found out that there's no way to change the color of the cursor through CSS directly. Instead, I would need to get an URL to a black pointer cursor and then implement it on the CSS. I couldn't find a website to do this though, so any recommendations would be great.
To customize your cursor, you need to get an image. You can find cursor images on various websites like Flaticon, The Noun Project, and many others. Numerous websites reference these sources.
Ex: cursor: url('./images/custom-cursor.png'), auto;
I updated my name, avatar and date according to my informations. It was a great project to start.
Using relative units like 'em', 'rem', or '%' instead of 'px' is a great way to make your project more responsive. These units adjust based on the user's settings and screen size, ensuring your design scales appropriately across devices. Keep up the good work! 👌👌
I need to learn more about FIGMA.
What challenges did you encounter, and how did you overcome them?How to find my way around FIGMA file given.
What specific areas of your project would you like help with?I am okay for now.
Focus on using HTML5 semantic tags like <main> to properly structure your page content. This enhances the readability and accessibility of your HTML.
For responsiveness, use relative units (em, %) in your CSS instead of fixed units (px). This ensures that your website adjusts well to different screen sizes and devices, providing a better user experience.
Implementing these practices will make your code more semantically meaningful and responsive, improving both usability and accessibility of your website.
