Hej,
Mam dwa problemy.
1. Nie widać zawartości navbar-toggler-icon. (zdjęcie)
Nie ma tych paseczków, próbowałam już wielu konfiguracji i nadal nie wiem jak to "odzyskać".
Kod:
.navbar-dark-custom {
background-color: $color-primary-dark;
color: $white;
a {
color: darken($white,10%);
font-weight: 600;
text-transform: uppercase;
&:hover {
color: $color-secondary-light;
}
&:active {
color: $color-secondary-dark;
}
}
.navbar-brand {
color: $white;
text-transform: none;
font-weight: 300;
}
.navbar-nav {
padding-left: 50%;
// float: right;
// padding-right: 0;
}
.navbar-toggler {
background-color: darken($color-primary-dark, 5%);
border-color: $color-primary;
.navbar-toggler-icon {
border-color: $white;
}
}
}
<!-- Menu navbar -->
<nav class="navbar navbar-expand-lg sticky-top navbar-dark-custom">
<div class="container">
<a class="navbar-brand" href="#">Natalia Waśko</a>
<!-- fragment odpowiedzialny za menu rozwijane na komórkach -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navContent" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navContent">
<ul class="navbar-nav">
<li class="nav-item active"><a href="#" class="nav-link">Główna</a></li>
<li class="nav-item"><a href="#" class="nav-link">Aktualności</a></li>
<li class="nav-item"><a href="#" class="nav-link">Oferta</a></li>
<li class="nav-item"><a href="#" class="nav-link">Portfolio</a></li>
<li class="nav-item"><a href="#" class="nav-link">Kontakt</a></li>
</ul>
</div>
</nav>
2. Wiem, że to pewnie jest proste, ale nie wiem jak linki w menu ustawić po prawej stronie. Działa tylko:
.navbar-nav {
padding-left: 50%;
}
ale to jest tak na oko.
Próbowałam navbar-right, float: right i jeszcze kilku innych rozwiązań z internetu - nic nie zadziałało.
Przepraszam jeśli taki temat już był, ale obijam się o ten temat już parę godzin.