Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
6
Comments
3
Brian Farmer
@brianlfarmerllc

All comments

  • Roy•195
    @royschrauwen
    Submitted almost 4 years ago

    PING Coming Soon Page: Did I make it responsive and accessible enough?

    2
    Brian Farmer•210
    @brianlfarmerllc
    Posted almost 4 years ago

    I think the responsiveness and accessibility is great. The form is keyboard accessible and the use of a tags lets you tab through all the links in the footer.

    Not sure if you are familiar with it but the lighthouse tool in google chrome dev tools can give you great insight to the accessibility areas that need to be improved on in projects. I use it a lot. Firefox dev tools also have a great accessibility tool. Though i'm still learning how to use it myself.

    Great Job!

    Marked as helpful
  • Iulian Cenușă•330
    @iulian-cenusa
    Submitted almost 4 years ago

    Tip Calculator App by Iulian Cenușă using CSS Grid and Flexbox

    1
    Brian Farmer•210
    @brianlfarmerllc
    Posted almost 4 years ago

    great job!

    The bug I saw on the input was that the input got larger when you clicked on it. Was that what you were referring to? If so you could add this to the bill_container and the nr_people_container to keep the img and the input on the same line.

    display: flex; justify-content: space-between; align-items: center;

    For the nan maybe use a ternary operator in the case that it's a negative number in the input? I didn't look at the code for that but maybe something you could easily fix?

    Marked as helpful
  • Jean Pierre Bizimana•20
    @jpbiz
    Submitted about 4 years ago

    I used CSS Grid and Flex but mostly Grid with Grid-template-area

    3
    Brian Farmer•210
    @brianlfarmerllc
    Posted about 4 years ago

    Hi there looks really good but I have two suggestions.

    To help with the mobile layout you should look into the built in responsiveness that css grid can provide. I found this article very helpful. https://css-tricks.com/look-ma-no-media-queries-responsive-layouts-using-css-grid/

    and second consider creating a 4 row template on the container where the bottom one would hold your social icons. This would help with getting the icons closer to the bottom of the page.

    Keep up the great work!

Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub