@barka-dev
Submitted
@innitman
@barka-dev
Submitted
Fantastic! This was a real inspiration for me, such as the ::after for the little diamond part. Your code is also so concise and clear :)
What are you most proud of, and what would you do differently next time?
completing the circles with the verticle line in the design was a good task!
What challenges did you encounter, and how did you overcome them?
no massive challenges, but the vertical line wasnt as easy as i thought it would be!
What specific areas of your project would you like help with?
im not a huge fan of the responsiveness of the hero section on the large screen size, any suggestions welcome.
nice - though I think something's not quite loading right on the live link at https://frontend-mentour-challenges.vercel.app/html-css/meet-landing-page/?
@imandreans
Submitted
What are you most proud of, and what would you do differently next time?
Im proud that I finally know how to set the grid layout.
What challenges did you encounter, and how did you overcome them?
Sometimes the section is out from the grid. So, I need to set the width of container using rem unit. Also, It is hard to be precise on the section's padding and size.
What specific areas of your project would you like help with?
More on how to set the size correctly
Very nice solution! I think your section is fitting nicely in the grid
@ei-abdullah
Submitted
What are you most proud of, and what would you do differently next time?
I'm most proud that I have created a nice-looking responsive design using flex-box.
What challenges did you encounter, and how did you overcome them?
I faced challenges related to team-builder and karma card, so I've bundled those two cards into a div that would adapt to the design.
Nice solution!
I wonder if grid-template-areas might be an alternative way to do this and only need one grid, rather than nested grids/flex boxes? You could have all .cardSection as a grid, and the grid-template-areas might relate to each of the cards, with the "cross" design for desktop and the stacked design for mobile?
Marked as helpful
@WorkWithRahulMishra
Submitted
Nice solution!
I wonder if for <p> PERFUME</p> there's any merit in leaving the HTML as the original 'Perfume' and use text-transform: uppercase instead?
@Nematov0047
Submitted
What are you most proud of, and what would you do differently next time?
I first created a structure of colors, font sizes.
What challenges did you encounter, and how did you overcome them?
first I created table using table tag, but then realized it would be easire if I used div tag and flexbox
Very nice :) I wonder if playing with
li::marker { font-size: "some smaller value"; }
might help get the bullet points closer to the design?
@MachoCamacho1
Submitted
What are you most proud of, and what would you do differently next time?
I managed to add a different font color when it comes to anchors. I had never done it before and it was a good challenge.
What challenges did you encounter, and how did you overcome them?
Changing the font text on anchor elements while hovering. A bit of research managed to help me out.
Nice solution!
@KamronbekBotirjonov
Submitted
Very nice design :)
I wonder if object-fit:cover might be an idea for the coding img? The coding img in the mobile design example is cropped to fit whilst preserving the aspect ratio (e.g. the left and right parts of the image in the desktop version aren't present in the mobile version)
@barka-dev
Submitted
Looks good to me :) Seems to work on a range of sizes.