Having created a simple Bootstrap 5 template for my Joomla 4 website, I've been attempting to customize the navbar with CSS in my user.css file. However, it seems that the styles added in user.css are not being applied.
I have verified that user.css is indeed loaded on the page based on the page source code, and I have also checked the contents of the user.css file on the web server.
Below is the code for my navbar and the corresponding CSS:
user.css
nav .navbar-dark .nav-link {
text-decoration: none !important;
}
Index.php
<nav class="navbar navbar-dark bg-dark navbar-expand-lg">
<div class="container-fluid">
<a href="" class="navbar-brand"><?php echo ($sitename); ?></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainmenu" aria-controls="mainmenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Put menu links in the navbar -->
<?php if ($this->countModules('menu')): ?>
<div class="collapse navbar-collapse" id="mainmenu">
<jdoc:include type="modules" name="menu" style="none" />
</div>
<?php endif; ?>
</div>
</nav>