Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
13
Comments
2

Heiko John

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

  • Profile Card Component (HTML | CSS)

    #bem

    Heiko John•250
    Submitted 8 months ago

    0 comments
  • Todo App with Drag and Drop (Next.js | Tailwind)

    #next#react#tailwind-css#typescript

    Heiko John•250
    Submitted over 1 year ago

    0 comments
  • Manage landing page (Next.js | Tailwind)

    #next#react#tailwind-css#typescript

    Heiko John•250
    Submitted over 1 year ago

    0 comments
  • Huddle landing page w. single introductory section (Next.js, Tailwind)

    #next#react#tailwind-css#typescript

    Heiko John•250
    Submitted over 1 year ago

    0 comments
  • Easybank landing page with Sass

    #sass/scss

    Heiko John•250
    Submitted over 1 year ago

    0 comments
  • Interactive card details form with SASS, RegExp

    #sass/scss

    Heiko John•250
    Submitted over 1 year ago

    0 comments
View more solutions

Latest comments

  • Ashong•930
    @AshongAbdallah06
    Submitted over 1 year ago
    What specific areas of your project would you like help with?

    I haven't implemented the drag-and-drop feature yet. Any help on how to do it would be greatly appreciated.

    Todo App

    #react
    1
    Heiko John•250
    @daHatta
    Posted over 1 year ago

    Hi, you can try react-beautiful-dnd or dnd-kit for the drag and drop feature.

    Happy coding!

    Heiko

    Marked as helpful
  • Sae Matsuda•240
    @SaeM843
    Submitted over 1 year ago

    FAQ Accordion Using HTML, CSS and JS

    1
    Heiko John•250
    @daHatta
    Posted over 1 year ago

    Hi Sae,

    it looks pretty good so far. According to your questions I might have some tips for you. I solved the quest by setting the whole accordion at the top of the page with the distance mentioned in the design, so the whole thing stays fixed and moves only downwards.

    Another thing I did, I wrote a function which closes all answers first, followed by the opening of the answer of the clicked question. So every questions stays where it is.

    I set only margin-inline: auto and a width for my solution to center my accordion properly. Might be a solution for you too?

    I also recommend to use main and section to get the right landmarks. I get often warnings about landmarks by myself. ;)

    Hope my answer was helpful!

    Keep up coding. You are awesome! :)

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