All solutions

What are you most proud of, and what would you do differently next time?

the cards.

less procrastination

What challenges did you encounter, and how did you overcome them?

getting the cards in the right place: I searched on youtube for videos about positioning and got really lucky, because kevin powell had a video about responsive positioning using this project.

preventing the form from submitting before checking if the correct info has been added: search google and found out about event.preventDefault()

What specific areas of your project would you like help with?

what font size and img size should I use for widths less than 375px? Because I ended up running out of space for them so the edges end up touching. I tried padding, but it did not work the way I wanted

What are you most proud of, and what would you do differently next time?

nothing

improve readability of html and css

What challenges did you encounter, and how did you overcome them?

the red dot: i made the width for text 99%

What specific areas of your project would you like help with?

how do i fix the red dot as it compresses on smaller screens when text is long

how can I improve the layout so that I can fit all three components of the card in the same way as the designs. Because although I had the same container width, I couldn't fit everything for the longer texts

What are you most proud of, and what would you do differently next time?

nothing

What challenges did you encounter, and how did you overcome them?

dark overlay for sidebar: google and found a solution

What specific areas of your project would you like help with?

for the html layout how would you set it up compared to how i set it up using semantic html

What are you most proud of, and what would you do differently next time?

nothing

plan my logic more before writing

What challenges did you encounter, and how did you overcome them?

calculating age: google, found and copy pasted the logic I needed

What specific areas of your project would you like help with?

nothing that I can think of

What are you most proud of, and what would you do differently next time?

nothing

What challenges did you encounter, and how did you overcome them?

changing the color of the placeholder: google

getting the email: google

mobile layout: played around until it worked

What specific areas of your project would you like help with?

how would I prevent empty space when dealing with flex on mobile layout.

What are you most proud of, and what would you do differently next time?

nothing really

What challenges did you encounter, and how did you overcome them?

none that i could think off

What specific areas of your project would you like help with?

is there a better way for me to have done the semantic html

is it responsive enough for mobile, if not what changes can i make

What are you most proud of, and what would you do differently next time?

learned about custom properties and utility classes try to do it faster

What challenges did you encounter, and how did you overcome them?

the entire challenge was the challenging part for me because I took away the responsiveness when I tried to style both divs really badly, so I started from scratch twice because it was easier for me instead of trying to fix it.

I also watched one of kevin powels' frontend mentor series and learned to use custom properties and make utility classes.

What specific areas of your project would you like help with?

for the html, if I were to write semantic html would I need a header for this or would i be fine with just a main?

is my css easy to read when it comes to naming custom properties and classes? If not is there a better way to name them?

For the mobile design should I limit the width of the summary div to stop the table rows and button from stretching? if so how would I do it?

What are you most proud of, and what would you do differently next time?

managing to complete without javascript figure out why the font and padding could not work together

What challenges did you encounter, and how did you overcome them?

getting the button to work: googling and changing checkbox appearance to none. making the answer appear: using the right selector background image: changing the position of both divs. and playing around with the top

What specific areas of your project would you like help with?

I want to know if there is a better way to do the semantic html for the unordered list making the padding and font change work because I dont know why the last 2 get pushed to the right.

What are you most proud of, and what would you do differently next time?

nothing

What challenges did you encounter, and how did you overcome them?

nothing since it was similar to the qr code

What specific areas of your project would you like help with?

making it more responsive so that it shrinks when going below 400px

What are you most proud of, and what would you do differently next time?

finished faster than the qr code

What challenges did you encounter, and how did you overcome them?

getting the layout right. playing with dev tools and google

What specific areas of your project would you like help with?

I was unable to make the card smaller than 400 without cropping occurring. I want to know how i can improve the size so that it fits less than 400 as well

What are you most proud of, and what would you do differently next time?

I completed it. try to finish faster

What challenges did you encounter, and how did you overcome them?

making the image look the same size as figma. making the text look as close as possible to the design. playing around with dev tools

What specific areas of your project would you like help with?

transforming text to look exactly like the design