React, TS, Zustand, React Router, Framer Motion, CSS Modules

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted 11 months ago

  Hello there 👋. Good job on completing the challenge !

  • Your issue is that you've set a.active in your Header.module.css file, but remember that when elements are rendered, React automatically assigns a unique name to that class. So, your class might look something like a._active_10909_45, and such a class doesn't exist because <NavLink> adds the .active class without changing its name. That's why you'll never see the active link turn whiter.

    To solve that issue and avoid the problem, you could use the [class="active"] selector to prevent React from changing the class name and match the one set by NavLink:

    .header nav a[class="active"] img {
      filter: brightness(300%);
    }
    

  I hope you find it useful! 😄

  Happy coding!

  Marked as helpful

  0

  ---

  

  P

  Waldemar Glaz•825

  @waldekglazPosted 11 months ago

  @MelvinAguilar

  excellent stuff, thank you for your help.

  0
• 

  Thomsen-Codes•40

  @Thomsen-CodesPosted 11 months ago

  The side bar looks much better in the solution than in the original design, good and clean work.

  0