Skip to content
  • Learning paths
  • Challenges
  • Solutions
  • Articles
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 5 years ago

A lot of CSS Grids: SCSS and JS

Nic•595
@nicm42
A solution to the Manage landing page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


I haven't really used a lot of CSS Grids, so I learnt a lot using them in this one. I also learnt Gulp, which took forever to learn how to use, but was really useful once I got it working.

I'm not sure I'm using SCSS to its full potential - it's pretty much just CSS with some variables. What can I do to make better use of it?

Code
Select a file

Please log in to post a comment

Log in with GitHub

Community feedback

  • Adarsh Pratap•5,515
    @adarshcodes
    Posted about 5 years ago

    Hey! @nicm42, your solution looks fine. You can change a few things like

    • font-weight for and size for the navbar links.

    Few things to improve responsiveness

    • At breakpoint 870px around you can make changes to the navbar links.

    • Increase the font size just a bit.

    • Solve the Accessibility and HTML issues.

    • I haven't learned the SCSS yet, so can't tell you much about it, but you can use mixins and there's a lot to make you code reusable and shorter :)

    Great work!

  • Nic•595
    @nicm42
    Posted about 5 years ago

    Thank you.

    Annoyingly, I have fixed the HTML and Accessibility issues, but when I tell FrontEnd Mentor to check again, it's still checking the old html file, even though I can definitely see the new one in GitHub.

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