All solutions

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

The implementation of the solution with a mixture of Grid for macro layout and flexbox for micro layout

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

Implementing the banner layout was a bit of a hack at first but I figured Grid layout gives me the flexibility I was looking for.

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

none

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

Implementing the tablet view even though it was not part of the given design.

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

not too familiar with the use of grid compared to flexbox

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

nothing

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

I like implementing the grid in the tablet view to follow the design layout.

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

The grid items' alignment was somehow strange as it is opposite to the alignment implementation in Flexbox.

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

nope

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

I am quite excited that I can produce the design relying only on the design picture without any Figma file. I am close as possible to the intended design with few off measurements due to approximation.

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

I was a bit thrown off by the list-type alignment but I was able to use before pseudo selector to handle that. I am learnt a new thing about using custom list-style

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

none

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

I love the idea that i could use the design image instead of the figma file to approximate the dimensions of the elements

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

Basically, the inavailablity of the figma file poses a constraints but importing the design images to figma and use the various tools on figma to approximate the measurments

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

none

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

I love that I could use semantic HTML tags and, most importantly, the inclusion of accessibility attributes.

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

I did not encounter any challenge on this project as I made use of old project template for quick project setup.

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

none

Not really my finest output! I kind of hacked my way through the CSS. I guess not too bad for a first trial.

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

This one of my old projects

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

nothing

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

none

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

It was a bit of a straightforward solution. However, I chose to use SASS for the project inside of vanilla CSS

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

In terms of challenges, I feel the BEM naming convention can be a thrown off sometime as you struggle to properly identify block from elements. However, but visually representing the UI with boxes, it become mentally clear the best way forward.

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

None.

This is a remake of the earlier submission in a bid to correct some of the errors I made initially by trying to make the page looks as close as possible to the design.

it is quite interesting to see how much improvement you can get with respect to responsive design using relative measurement.