Skip to content
OverviewSolutions
19
Comments
23

Achi Gyuse Achi

@AchigyusNigeria490 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

  • Achi Gyuse Achi•490
    @Achigyus

    Hey mate.

    Great work on the site, it looks really great. I just have one little tip

    You should set a max-width on the header, main, and footer tags along with a margin of 0 auto to center everything.

    Marked as helpful
  • Achi Gyuse Achi•490
    @Achigyus

    Hey Simon.

    Thanks for your feedback on my solution. I thought to return the favor by helping you review your solution.

    Here are some tips to improve the design.

    1. You need to properly center the contact card, this can be achieved by using flexbox or grid

    2. You need to set pointer styles on interactive elements such as the inputs, buttons, etc. You can set it using cursor: pointer

    3. It would also be a good idea to add some padding to the inputs and textarea to make it look better.

    These are some of the things I noticed. Thanks

    Marked as helpful
  • SmartAce•430
    @Smart-Ace-Designs
    What are you most proud of, and what would you do differently next time?

    I used Astro Actions for form validation. I had already used this for another FEM challenge, but it was nice to refresh my skills on this.

    I try to only use AI to "assist me" when I have questions and not completely write the code for me.

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

    Following proper accessibility solutions. Not difficult...just something to make sure it is not overlooked. I used AI to help with aria properties when I was not sure what to include.

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

    Nothing at this time.

    Contact Form built with Astro, Astro Actions, and Tailwind CSS

    1
    Achi Gyuse Achi•490
    @Achigyus

    Hey Smart Ace

    Great work on the design.

    I just noticed a few things.

    • It would be good to set an event listener on the inputs so that when the user fills out the fields he/she missed out, the error messages are cleared

    • There are also some inconsistencies in your use of cursor: pointer. Some elements are not completely wrapped

    • Your error message for email validation reads A valid email address name is required, I think it would be better to use A valid email address is required.

    All in all, a great solution

    Marked as helpful
  • Achi Gyuse Achi•490
    @Achigyus

    Absolutely a great solution, Liz.

    I noticed that when using just the tab key to navigate the website, there was no outline on the buttons, so it seemed like it wasn't working.

    It was a small fix, and I forked your repo and created a pull request.

    You can check the pull request here

  • P
    Daniel 🛸•44,810
    @danielmrz-dev
    What are you most proud of, and what would you do differently next time?

    🛸 Hello FEM Community! I'm Daniel and this is my solution for this challenge! 😊

    🛠️ Built with:

    • Angular 🅰️
    • SASS 🎨
    • TypeScript 🔷
    • BEM Notation 🅱️
    • Mobile first workflow approach 📲

    My first GURU level project 😊

    If you have any suggestions on how I can improve this project, feel free to leave me a comment!

    Feedback welcome 😊

    Designo Multi-Page Website built with Angular + SASS 🅰️

    #angular#angular-material#sass/scss#typescript#rxjs
    4
    Achi Gyuse Achi•490
    @Achigyus

    Great work, buddy. Congrats on completing your first guru level project

  • Achi Gyuse Achi•490
    @Achigyus

    Hey @Coder-Liz,

    A really great solution; all buttons are accessible and work well. The UI looks good as well.

    The only thing I noticed is that it would be nice to add some cursor styling to the buttons apart from just the background change on hover.

    You can add that with the code below:

    .rating__submit-btn, .rating__number-btn {
    cursor: pointer;
}
View more comments