Skip to content
OverviewSolutions
19
Comments
14

why-not-phoenix

@why-not-phoenix300 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

View more solutions

Latest comments

  • why-not-phoenix•300
    @why-not-phoenix

    Love your solution and all the extra features you added blew my mind Well done!

  • P
    Bruna Gonçalves•270
    @brunagoncalves
    What are you most proud of, and what would you do differently next time?

    Having completed the challenge is a great victory.

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

    I still have some difficulties with HTML and JavaScript semantics. So to focus more in correct structuring and javascript, I chose to use TailwindCSS.

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

    Any feedback that is constructive is welcome.

    Newsletter sign-up form with success message solution

    2
    why-not-phoenix•300
    @why-not-phoenix

    Hi Bruna. I really like your solution. It looks pixel perfect. How did you do that? Did you use the figma? I notice a key difference was that your picture was on the left side while the Design's picture is on the right. You can easily solve this with :

    .section-newsletter {
      display: flex;
      flex-direction: row-reverse;
}

    Also use a :hover on the btn to change the cursor to pointer and to change the color of the buttons when hovered on. There are different things that could've been done differently but I am really impressed with how you handled the challenge generally. Here's a link to my solution if you're interested: https://www.frontendmentor.io/solutions/mobile-first-responsive-newsletter-signup-page-REmgL-P-mw

    It's not great but its something.

    I also wanted to ask if there's a special app you used for your screenshot. Looks nice

    Marked as helpful
  • P
    roswell•520
    @welpmoz
    What are you most proud of, and what would you do differently next time?

    I feel confident making responsive layouts using CSS grid and media queries.

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

    Trying to modified the initial structure that I made is painful for me! I faced this hard coding and investing much effort adding additional CSS.

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

    I need someone who help me with the transition from the success page to the form page.

    Interactive Newsletter SignUp Responsive Page with Vanilla JS and CSS

    #accessibility#pure-css#web-components#animation
    1
    why-not-phoenix•300
    @why-not-phoenix

    Your solutions looks really good. I checked the preview site and I was surprised by how well you did. Well done!!!

  • P
    nikolasladic•120
    @nikolasladic
    What are you most proud of, and what would you do differently next time?

    Next time I will plan my HTML structure differently, as it is the foundation of making your like easier later on. JavaScript is my pain point but I think I've handled it well for first challange

    Article preview componenet

    1
    why-not-phoenix•300
    @why-not-phoenix

    Hi Great Job. Everything looks fine but the hover active states. Clicking on the icon on desktop gives a weird pop up you should look at. I know it's quite challenging getting the popovers to work. You could check out different resources like stackoverflow. Or you could make the click active state work for both small and large screens

  • klnrox001•40
    @klnrox001
    What are you most proud of, and what would you do differently next time?

    I tried my best to recreate the design and using the basic knowledge I have of coding and CSS. I am a total beginner, so it took a while, but I hope I can get better at it with more practice.

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

    I learned more about utilizing 'flexbox' when trying to recreate the QR component design. I struggled to get the 'paragraph' font to a suitable size within the container. I found that with percentage, I could get to the closest 'font-size' as seen in the design. What really helped me was using Live Server. I would use Inspect and change things on there and once I was happy with what I saw, I added the changes to my code.

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

    I think my code may be lengthy in CSS, so any feedback on what to do differently I would greatly appreciate.

    QR code component solution

    2
    why-not-phoenix•300
    @why-not-phoenix

    Nah, looks good. Maybe reduce your font-sizes especially for your h1

  • why-not-phoenix•300
    @why-not-phoenix

    HI, great job with the design. Your background quote image seems to be rounded and when I clicked on the preview site on my pc it doesn't display correctly. Maybe that's just for me. Also on Mobile display, kira comes first which isn't right. Personal I made 2 divs, one with the first 4 cards and the last with kira. That way I was able to make a grid with both divs. FOr better understanding checkout my solution:

    https://www.frontendmentor.io/solutions/mobile-first-testimonials-grid-section-with-flexbox-8-UsZahda1

View more comments