Kevin Powell - CommunityKP-C
Kevin Powell - Community•3y ago•
5 replies
BimmerG87

One Navlink not showing

https://github.com/Aman2980/S2-23_Website
Here is a link to the project. In the header on each page I have this nav-item 
 <li class="nav-item">
                    <a href="Stats.html" class="nav-link stats">Statistics</a>
                </li>
In the common.css file I set 
.nav-link.stats{
    visibility: hidden;
}
to hidden by default. Then inside login.js im selecting that item with 
const statsNavItem = document.querySelector('.nav-link.stats');
and changing its state based on some conditions 
if (username) {
        const legend = document.querySelector('legend h2');
        if (legend) {
            legend.textContent = `WELCOME ${username}`.toUpperCase();
        }
        loginButton.replaceWith(logoutButton);
        statsNavItem.style.visibility = 'visible'; // Make the stats navigation item visible
    } else {
        statsNavItem.style.visibility = 'hidden'; // Hide the stats navigation item
    }
Now my issue is that this statistics page should appear when someone logs in. It does appear but can be accessed from login page and it hidden from each page. How can i make it visible on each page when someone logs in?
GitHub
GitHub - Aman2980/S2-23_Website
Contribute to Aman2980/S2-23_Website development by creating an account on GitHub.
GitHub - Aman2980/S2-23_Website
Was this page helpful?