Skip to content
OverviewSolutions
10
Comments
5
Yoga
@yogskr

All comments

  • Yoga•240
    @yogskrPosted 9 months ago

    Heyo Joe, this is a cool landing page. Great job with the design!

    I will only comment one thing about the font style though. It'd be great if you match the font size, the font's element length, and font alignment with the design.

    Happy coding for other projects!

    Marked as helpful
    1
  • Yoga•240
    @yogskrPosted 9 months ago

    Hey Joe...let me give you feedback here.

    Your landing page looks great. It's also great that you already implement the mobile-first design workflow.

    Generally, my feedback is to re-touch some elements to match the design.

    Also, I will only point out several things:

    1. It would be great if you implement cursor: pointer to the Try It Free button to make it look like an actual button. You can also use selector:hover and apply some effects when you hover it.
    2. Consider giving some gap or margin to these containers: Grow Together, Flowing Conversations, and Your Users.
    3. The CTA section should be bigger, I guess, according to the design.
    4. The social buttons should be a bit to the top too.

    Overall, your design looks great and as always, your code is easy to read. Keep this up, man!

    Marked as helpful
    1
  • Yoga•240
    @yogskrPosted 11 months ago

    Hi, Aigooooo! Great job for completing the project.

    That said, you could improve your code on several aspects:

    1. I recommend using semantic HTML structure. For example, instead of using <div class="container">, you could use <main class="container">.
    2. Still regarding semantic HTML, I would use <h1> instead of <h2> for the Improve your front-end skills by building projects text.
    3. I recommend changing the image src with the provided image in /images/image-qr-code.png rather than using <img src="https://raw.githubusercontent.com/Aigooooo/frontend-mentor-io-qr-code/master/images/image-qr-code.png" alt="image-qr-code" />.

    I hope the feedback can help you improve the code for this project. Keep it up and have a great one!

    Marked as helpful
    1
  • Yoga•240
    @yogskrPosted 11 months ago

    Hi, great job you have there to complete the challenge!

    I have several suggestions for you:

    1. It'd be great to add a functionality to the Dismiss message on the success message modal.
    2. I recommend wrapping the text Join 60,000+ product managers receiving monthly updates on: with <p> tag.
    3. Adding alt text to the images will help improve the accessibility.

    I hope my suggestions help you in some way. Let's continue our journey!

    Marked as helpful
    0
  • Yoga•240
    @yogskrPosted 11 months ago

    Hey, the design looks great!

    As for your question, I used position: relative and set the top to specific px. Therefore, the container stays where it is as we apply the 'accordion' functionality.

    Marked as helpful
    1