mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-11-04 02:52:55 +00:00
Code Issues Releases Wiki Activity

Logo is aligned to the left in the header, but still using grid layout

Browse Source
This commit is contained in:
Gabor PEK
2018-03-07 14:22:20 +01:00
parent 603cdb9911
commit ed8f09b11d
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/header/header.component.html Normal file → Executable file
View File

@@ -3,8 +3,8 @@
<!-- <ul class="navbar-nav tao-grid-center-right"> <!-- <ul class="navbar-nav tao-grid-center-right">
<li class="nav-item tao-header-title">an</li> <li class="nav-item tao-header-title">an</li>
</ul>--> </ul>-->
<img src="images/avatao_logo.svg" routerLink="/" class="tao-grid-center-right tao-company-logo" alt=""> <img src="images/avatao_logo.svg" routerLink="/" class="tao-grid-center-left tao-company-logo" alt="">
<ul class="navbar-nav tao-grid-center-left"> <ul class="navbar-nav">
<li class="nav-item tao-header-title">Tutorials</li> <li class="nav-item tao-header-title">Tutorials</li>
</ul> </ul>
</div> </div>

5
src/app/header/header.component.scss Normal file → Executable file
View File

@@ -25,6 +25,7 @@ $font-size-h3: floor(($font-size-base * 1.3));
$tao-navbar-height: 67px; $tao-navbar-height: 67px;
$company-logo-width: 130px;
// //
// Classes // Classes
@@ -44,14 +45,14 @@ $tao-navbar-height: 67px;
.tao-grid-navbar { .tao-grid-navbar {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: $company-logo-width 1fr;
grid-column-gap: 8px; grid-column-gap: 8px;
width: 100%; width: 100%;
} }
.tao-company-logo { .tao-company-logo {
display: block; display: block;
width: 130px; width: $company-logo-width;
} }
.tao-company-logo-mobile { .tao-company-logo-mobile {