nezumi/foodify-frontend
1
0
Fork 0
mirror of https://github.com/Nezumi-2711/foodify-frontend.git synced 2026-09-23 04:09:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/dat-dev'

Browse Source
This commit is contained in:
Nguyen Ha Khue
2023-04-25 18:21:36 +07:00
parent 7bf25cdd54 7e2b4e0f77
commit b185b1f984
13 changed files with 192 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/shared/components/header/header.component.html
+29 -7
View File
@@ -1,10 +1,10 @@
<div class="page-main-header" [class.open]="open">
<div class="main-header-right row">
<div class="main-header-left d-lg-none col">
<div class="main-header-right row header-responsive">
<div class="main-header-left d-lg-none col res-logo">
<div class="logo-wrapper"><a [routerLink]="'/dashboard/default'"><img class="blur-up lazyloaded"
src="assets/images/dashboard/multikart-logo.png" alt=""></a></div>
</div>
<div class="mobile-sidebar col">
<div class="mobile-sidebar col res-left-sidebar">
<div class="media-body switch-sm">
<label class="switch">
<a>
@@ -15,7 +15,7 @@
</div>
</div>
<div class="nav-right col">
<ul class="nav-menus" [ngClass]="{'open' : openNav}">
<ul class="nav-menus">
<!-- <li>-->
<!-- <form class="form-inline search-form">-->
<!-- <div class="form-group">-->
@@ -96,7 +96,7 @@
<!-- </a></li>-->
<li class="onhover-dropdown">
<div class="media align-items-center"><img
class="align-self-center pull-right img-50 rounded-circle" src="{{ user?.imageUrl }}"
class="align-self-center pull-right img-50 rounded-circle border border-dark" src="{{ user?.imageUrl }}"
alt="header-user">
<div class="dotted-animation"><span class="animate-circle"></span><span
@@ -130,9 +130,31 @@
</ul>
</li>
</ul>
<div class="d-lg-none mobile-toggle pull-right" (click)="openMobileNav()">
<app-feather-icons [icon]="'more-horizontal'"></app-feather-icons>
<div class="d-lg-none mobile-toggle pull-right pt-0 d-flex flex-column " (click)="openMobileNav()">
<div class="media align-items-center">
<img class="align-self-center pull-right img-50 rounded-circle border border-dark res-icon" src="{{ user?.imageUrl }}" alt="header-user">
<!-- <div class="dotted-animation"><span class="animate-circle"></span><span class="main-circle"></span></div> -->
</div>
<div *ngIf="isMobileNavOpen" class="d-flex flex-column width-dropdown position-absolute">
<div class="py-2 px-3" *ngIf="isShop">
<a class="d-flex align-items-center " [routerLink]="['/vendors','details', shopId]">
<app-feather-icons [icon]="'user'" class="mr-2"></app-feather-icons><span class="font-weight-bold text-dark">Trang cá nhân</span>
</a>
</div>
<div class="py-2 px-3" *ngIf="!isShop">
<a class="d-flex align-items-center " [routerLink]="['/users', 'detail', loggedId]">
<app-feather-icons [icon]="'user'" class="mr-2"></app-feather-icons><span class="font-weight-bold text-dark">Trang cá nhân</span>
</a>
</div>
<div class="py-2 px-3">
<a class="d-flex align-items-center " (click)="logOut()">
<app-feather-icons [icon]="'log-out'" class="mr-2"></app-feather-icons><span class="font-weight-bold text-dark">Đăng xuất</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
src/app/shared/components/header/header.component.scss
+30 -4
View File
@@ -1,5 +1,31 @@
.width-dropdown {
width: 180px;
box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
border-radius: 5px;
}
width: 180px;
box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
border-radius: 5px;
}
@media (max-width:993px) {
.header-responsive {
display: flex;
align-items: center;
// .res-logo {
// position: absolute;
// left: 136px;
// }
// .res-icon {
// max-width: 40px;
// }
.position-absolute {
position: absolute;
top: 66px;
right: 0px;
text-align: start;
z-index: 999999;
}
}
}
src/app/shared/components/header/header.component.ts
+3 -1
View File
@@ -3,6 +3,7 @@ import { NavService } from '../../service/nav.service';
import { User } from '../../tables/user';
import { UserService } from '../../service/user.service';
import { FirebaseService } from '../../service/firebase.service';
import { threadId } from 'worker_threads';
@Component({
selector: 'app-header',
@@ -16,6 +17,7 @@ export class HeaderComponent implements OnInit {
public openNav: boolean = false;
public isOpenMobile: boolean;
public user: User;
isMobileNavOpen: boolean = false;
//Log-in
token: string = localStorage.getItem("jwt-token");
@@ -43,7 +45,7 @@ export class HeaderComponent implements OnInit {
}
openMobileNav() {
this.openNav = !this.openNav;
this.isMobileNavOpen = !this.isMobileNavOpen;
}