top-bar adjusted.

This commit is contained in:
Jegor 2021-06-07 09:53:39 +02:00
parent 54e68479f6
commit f30942443f
3 changed files with 22 additions and 80 deletions

View File

@ -1,54 +0,0 @@
.top-bar-wrapper {
display: grid;
grid-template-columns: 200px 360px 820px 20px 250px;
grid-template-rows: 40px;
grid-column-gap: 0px;
grid-row-gap: 0px;
align-items: center;
}
.top-logo {
grid-area: 1/1;
}
#better {
font-size: 28px;
font-weight: bold;
color: #3480E3;
}
#zon {
font-size: 28px;
font-weight: bold;
color: #E53167;
}
.search-button {
/*background-color: #E53167;*/
}
.sign-up {
/*background-color: #E53167;*/
margin-left: 50px;
margin-right: 25px;
}
.login {
margin-right: 25px;
}
#signin {
border-radius: 25px;
background-color: #E53167;
}
._links > a {
/*background-color: #E53167;*/
margin-left: 10px;
margin-right: 10px;
}
._signing_links > a {
/*background-color: #E53167;*/
margin-left: 50px;
}

View File

@ -1,26 +1,22 @@
<div class="top-bar-wrapper"> <nav class="navbar navbar-expand-lg bg-secondary text-uppercase fixed-top" id="mainNav">
<div class="<top-logo>" routerLink=''> <div class="container">
<a><span id="better">BETTER</span><span id="zon">ZON</span></a> <a class="navbar-brand" routerLink=""> Betterzon</a>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
</form>
<button class="navbar-toggler text-uppercase font-weight-bold bg-primary text-white rounded" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ms-auto">
<li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#top-gesuchte">Top-Gesuchte</a></li>
<li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#about">über uns</a></li>
<li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#unsere-kunden">Unsere Kunden</a></li>
<li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/signin">Anmelden</a></li>
<li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/registration">Konto Erstellen</a></li>
</ul>
</div>
</div> </div>
<div class="links">
<nav class="_links">
<a routerLink="signin">KONTAKTIERE UNS</a>
<a>KUNDEN</a>
<a>FAQ</a>
</nav> </nav>
</div>
<div class="footer_space">
</div>
<div class="search-button">
<a>
<img src="assets/images/search_black_24dp.svg" alt="Sarch button">
</a>
</div>
<div class="links">
<nav class="_signing_links">
<a routerLink="signup" routerLinkActive="acitve">SIGN UP</a>
<a routerLink="singin" routerLinkActive="acitve"><span id="signin">SIGN IN</span></a>
</nav>
</div>
</div>

View File

@ -11,7 +11,7 @@ export class TopBarComponent implements OnInit {
constructor() { } constructor() { }
ngOnInit(): void { ngOnInit() {
} }
} }