Jdaans
@JdaansAll comments
- P@jull20P@Jdaans
this looks really good! I do not understand how you wrote your JS but it works obviously! nice job
- @JbugglinWhat are you most proud of, and what would you do differently next time?
I honestly forgot that I had even started this challenge, I finished it pretty quickly, so I'm kind of anxious to see how far off it was in comparison to the prompt.
What specific areas of your project would you like help with?I'm trying to figure out better breakpoints for the media queries and not having to repeat styling tags.
P@JdaansYou should only have to write the styles once unless you're wanting to change a background color or something on a different screen size, media queries should just be changing the layout on different screen sizes, for this type of project atleast
- P@jull20P@Jdaans
looks really good!
- @rctrollexWhat are you most proud of, and what would you do differently next time?
I am most proud of the way I am thinking UI, in terms of divs and small components, It helps me to create responsive and good looking designs.
I want to try to tackle background images, image positioning and sizing because I had problems from that area, when I was doing this project.
What challenges did you encounter, and how did you overcome them?I encountered a challenge of placing the images to be same as in the design files, it was difficult to handle image positioning, sizing and to avoid overflowing of the images.
I didn't overcame them completely but with the help of AI and the use of Tailwind CSS docs, the design looked better.
What specific areas of your project would you like help with?The positioning of the 2 images, the background picture and the mobile phones pictures.
P@JdaansThis is really nice!
- @Gummi-DWhat are you most proud of, and what would you do differently next time?
Centering on page could be solved a lot prettier
P@JdaansOn your body you need to use display: flex; Then justify-content and align-items both set to center, good job though!
Marked as helpful - @EllamonacilloP@Jdaans
this looks awesome, your code is super clean, looks way better then my attempt lol I cant add anything to this, for your css is that tailwind ?
- @nihalgit45What are you most proud of, and what would you do differently next time?
I'm most proud of how I took a basic recipe page and turned it into a more interactive and visually appealing website by adding gradients, transitions, a navigation bar, and a responsive layout. I also implemented a recipe download/print button and added a gallery carousel which really enhanced the user experience.
If I were to do this project again, I would try using a frontend framework like React or a CSS framework like Tailwind to speed up development and add more reusable components. I’d also like to improve accessibility and explore deploying with a custom domain.
What challenges did you encounter, and how did you overcome them?One of the main challenges was creating an attractive and fully responsive layout using only HTML and CSS. I had to experiment with different layout techniques like Flexbox and media queries to ensure the website looked good on both desktop and mobile screens.
Another challenge was styling elements like buttons, borders, gradients, and transitions to make the site visually appealing without any JavaScript. I overcame this by using CSS animations, hover effects, and transitions to add interactivity and visual flow to the page.
This project helped me improve my CSS design skills and understand how to achieve dynamic effects using only core web technologies.
What specific areas of your project would you like help with?I would appreciate feedback on the following:
Visual Design & Layout: Are there any improvements I can make to the spacing, color palette, or overall layout to make the website look more modern and clean?
Responsiveness: The site uses Flexbox and media queries. I’d love suggestions on how to better optimize it for different screen sizes or edge cases.
Accessibility: I want to ensure the page is accessible. Are there any semantic HTML improvements or accessibility best practices I might have missed?
Performance: Since I’m only using HTML and CSS, are there any tips to make the page load faster or reduce CSS bloat?
P@JdaansI like the way you made it your own it looks really nice, the image is a little to big but the idea is awesome
- @domdem-devP@Jdaans
it looks good! one thing that is off is the newsletter is not centered on the screen, if you put display: flex; justify-content: center; align-items: center; on the body it should put it in the middle, good job though
- P@GeraASMWhat specific areas of your project would you like help with?
I'd some help about the width and height in the project because i've no gotten exactitud like the design
P@JdaansLooks pretty good, almost exactly spot on! nice job
- @almeida883P@Jdaans
it looks like your fonts are different from the original and everything is a little bit smaller, but the accuracy on the layout is really good, nice job!
- P@totiborWhat are you most proud of, and what would you do differently next time?
The responsive part of the grid was accaptable at first try. Styling of the cards a bit messy, needs to have a better approach next time.
What challenges did you encounter, and how did you overcome them?In case of this design all of the cards has major and minor design charactarectis which made it hard to create a simple, unified styling. I think this design is a good case for Tailwind and utility classes in general. Needs to dive deeper in the future to see its benefits.
P@JdaansAll I can really see that is off is the placement of the main container but it's barely off, and your box shadows aren't as visible, I have nothing to add to fix it though it looks really good, awesome job!
- P@joaofsdsP@Jdaans
it all looks good! only problems I see are that you didn't center anything on the screen and it looks like the calculator card is overlapping with the back ground
you could have wrapped the top section with the h1 and p in a header tag so you can center all of that together, i'm not experienced enough to recommend a best way to fix all of it but it looks like it's just in the way you wrote your html, good job though! looks good
- @yrjebP@Jdaans
this looks really good, it's all responsive and working well the only things I see that are off is the fonts but that could of been by choice, the shadow on the button was also a nice touch. There really isn't anything I can add to improve this, good job!
- @DRTX2P@Jdaans
the only issue I notice is that you missed the h1 and the font style for you header elements isn't correct, but other then that it looks awesome! it turned out better then mine did lol nice job
- @AfeliciosilvaP@Jdaans
it looks good! the image is a little smaller then it's supposed to be but that's an easy fix, I believe just adjusting the height and width should fix that, good job!
- @smuhanerdP@Jdaans
It looks really good! the only issues I notice is that it's sitting slightly higher then the design and your shadow looks a little bigger then it's supposed to be, but you did an awesome job on it!
- @xxjiadexxWhat are you most proud of, and what would you do differently next time?
Perhaps can wrap them together in a single div
What challenges did you encounter, and how did you overcome them?still not unsure about flexbox
What specific areas of your project would you like help with?More on flexbox tutorial
P@Jdaanshow did you get everything inside of the white area? is it just all wrapped in one div
- @Ibarra25What are you most proud of, and what would you do differently next time?
Estoy orgulloso del esfuerzo que hice para realizar este proyecto y lo que haria diferente es utilizar mas herramientas para agilizar el tiempo
What challenges did you encounter, and how did you overcome them?Algunas partes del proyecto no las recordaba muy bien y las supere con herramientas de IA
P@JdaansI can see some stuff that needs to be fixed, but I myself am not sure where to start with making the changes, good job though keep at it!