Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
27
Comments
7
Ricky
@rickyxyz

All comments

  • Cyril Salamite•160
    @Cyrilange
    Submitted over 1 year ago

    I used React for this challenge and scss

    #react#tanstack-query#react-router
    1
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    Cool React code.

    For the CSS, I usually sees people use rem instead of px for sizing. This article might be helpful PX or REM in CSS? Just Use REM

    Cheers 🍻

    Marked as helpful
  • Cyril Salamite•160
    @Cyrilange
    Submitted over 1 year ago

    CSS flex and media query ( 390px )

    3
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    Fellow beginner here, so take this with a grain of salt 🧂.

    I think this could be helpful for you BEM naming convention, since CSS names can get confusing quickly.

    Cheers 🍻

    Marked as helpful
  • Renukta-21•130
    @Renukta-21
    Submitted over 1 year ago

    Responsive Landing Page with grid

    #accessibility
    1
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    I'm also a beginner, so take this with a grain of salt 🧂.

    I think your HTML structure is odd.

    Take for example your 3 botCard cards, they have no container div to unify them. This could a problem when you have more than 3 cards, for example you would need to re-style the grid layout if there are 4 cards. I think it would be better if the botCard cards are contained in a div with grid or flex layout.

    Also you might want to look into semantic HTML5 guide.

    Cheers 🍻

  • Evergarden•1,290
    @Evergardenx
    Submitted over 1 year ago

    NFT-Preview-card-component

    #accessibility#cube-css#contentful
    1
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    Fellow beginner here.

    I think this could be helpful px or rem in css, since I usually see a lot of people use rem instead of px.

    Cheers 🍻

    Marked as helpful
  • Talha Asre•10
    @talhaasre
    Submitted over 1 year ago

    Responsive QR code component using html & CSS.

    2
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    I'm a beginner myself, so you might want to take this with a grain of salt 🧂.

    Maybe you could try making responsive font size and styling the elements using rem based on the responsive font size. Also, just as a suggestion, you might want to look at the most common screen size being used right now, so you can determine how small or how large of a screen you should accomodate.

    Cheers 🍻.

  • Mulugeta•360
    @MrDevM
    Submitted over 1 year ago

    NFT preview card component

    1
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    I'm also a beginner, so you might want to take this with a grain of salt 🧂.

    Just a suggestion, I think this article could be helpful BEM naming convention.

    Cheers 🍻.

    Marked as helpful
  • Anusha Fatima Ali•100
    @anusha-fatima
    Submitted over 1 year ago

    age-calculator-app-main.

    #accessibility
    1
    Ricky•460
    @rickyxyz
    Posted over 1 year ago

    Just a small suggestion for the number input, maybe hide the default up and down arrow in the input. Since in firefox the arrow is always visible.

    This could be helpful. W3S Hide Arrows From Input Number

    Cheers 🍻

    Marked as helpful
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

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

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