React Router Navbar background change only works in pages folder, but not on App.js?

Question

So, I have this navbar component that changes the color of the background based on a specific page I am located on. It works fine if I add the navbar individually to each pa