Skip to content
Submitted over 1 year ago

Responsive Template with Tailwind ✔

tailwind-css
Haitham Bahr•160
@MR-b7r
A solution to the Advice generator app challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

That's my first template with Tailwind-CSS 🐱‍👤. I would be grateful with Any suggestion to improve my skills 🙌.

Code

Please log in to post a comment

Log in

Community feedback

  • Melvin Aguilar 🧑🏻‍💻•61,020
    @MelvinAguilar

    Hello there 👋. Good job on completing the challenge !

    I have some suggestions about your code that might interest you.

    • The use of three links in the HTML file, including output.css, input.css, and style.css, is unnecessary. You only need the output.css link.
    • The styles in "style.css" may be redundant as Tailwind CSS includes an excellent default CSS reset. You can write custom styles in "input.css" if needed.
    • Ensure your class names like "Light-Cyan" are in lowercase for consistency with tailwindCSS.
    • Consider using Prettier and a Prettier plugin for Tailwind CSS to automatically organize and format your classes. This helps maintain code readability. You can learn more about automatic class sorting with Prettier in this Tailwind CSS blog post.

    I hope you find it useful! 😄 Above all, the solution you submitted is great!

    Happy coding!

    Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord