kfmc_website/src/app/dashboard/header/header.component.html

<div class="headerDashBoard" *ngIf="authSer.showDashboardHeader">   
    <!-- top Header content -->
    <div class="header" *ngIf="authSer.showHeaderDashBoard">
      <div class="container">
        <div class="row">
          <div class="col-6 col-sm-6 col-md-6 col-lg-6">
            <div class="notificationDiv-w">
                <div class="col">
                  <div ngbDropdown class="d-inline-block" style="float: right; direction: ltr;">
                      <!-- <button class="btn btn-outline-primary buttonW" id="dropdownBasic1" ngbDropdownToggle><img class="img" src="{{authSer.dataLoginUser['photo'] ? authSer.pathImg + authSer.dataLoginUser['photo'] : authSer.imgSrc}}" title="image">
                        {{authSer.dataLoginUser['name']}}</button> -->
                      <!-- <div ngbDropdownMenu aria-labelledby="dropdownBasic1" class="listDropMenu-w">
                          <button class="dropdown-item" style="cursor: pointer" (click)="onGetProfile()">صفحتي</button>
                          <button class="dropdown-item" style="cursor: pointer" (click)="onInternalPage()">البوابه الداخليه</button>
                          <button class="dropdown-item" style="cursor: pointer" (click)="onLogout()">تسجيل الخروج</button>
                      </div> -->
                      <ul class="list-unstyled notificationList-w" *ngIf="!authSer.isAuthenticated()">
                          <li class="profileData-w">
                            <div class="btn-group" ngbDropdown role="group" aria-label="Button group with nested dropdown">
                                <button class="buttonW" ngbDropdownToggle>
                                    <img src="{{authSer.dataLoginUser['photo'] ? authSer.pathImg + authSer.dataLoginUser['photo'] : authSer.imgSrc}}" title="imageProfile" alt="" />
                                        {{authSer.dataLoginUser['name']}} 
                                </button>
                  
                            <div class="dropdown-menu" style="text-align:right" ngbDropdownMenu>

                                <button class="dropdown-item" style="cursor: pointer;" >
                                <i class="fas fa-bell"></i>
                                <span>الاشعارات</span>
                                </button>
                    <!-- <button class="dropdown-item" style="cursor: pointer;" >
                       <i class="fas fa-comments"></i>
                       <span>رسائل</span>
                    </button> -->
                                <button class="dropdown-item" style="cursor: pointer;" (click)="onGetProfile()">
                                    <i class="fas fa-user-alt"></i>
                                    <span>ملفي</span>
                                </button>
                                <button class="dropdown-item" style="cursor: pointer;" >
                                <i class="fas fa-sticky-note"></i>
                                <span>ملاحظاتي</span>
                                </button>
                                <button class="dropdown-item" style="cursor: pointer;" >
                                <i class="fas fa-tasks"></i>
                                <span>مهامي</span>
                                </button>
                                 <button class="dropdown-item" style="cursor: pointer;" (click)="onInternalPage()">
                                    <i class="fas fa-solar-panel"></i>
                                    <span> البوابه الداخليه</span>
                                </button>
                                <button class="dropdown-item" style="cursor: pointer;color: #da0b0b !important;background-color: #f3f3f3;border-radius: 4px;" (click)="onLogout()">
                                    <i class="fas fa-sign-out-alt" style="color: #da0b0b !important;"></i>
                                    <span>خروج</span>
                                </button>
                            </div>
                         </div>
                      </li>
                          <!-- <li><span><i class="fas fa-comments"></i></span></li>
                          <li><span><i class="fas fa-bell"></i></span></li> -->
                      </ul>
                   </div>
                </div>
            </div>
          </div>
          <div class="col-6 col-sm-6 col-md-6 col-lg-6">
            <div class="dateDiv-w">
                <p style="float:left;">{{currentDate}}</p>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- bottomHeader content -->
    <div class="bottomHeader-w">
      <div class="overlay">
        <div class="container">
          <div class="row">
            <div class="col-12 col-sm-6 col-md-4 col-lg-4">
              <div class="rightLogo-w">
                <img src="../../assets/image/logo1.png" alt="logo" title="logo" />
              </div>
            </div>
            <div class="col-12 col-sm-6 col-md-4 col-lg-4">
              <div class="center text-center">
                <h2>المنصه الداخليه</h2>
                <p>مجمع الملك فيصل الطبي بصحه الطائف</p>
              </div>
            </div>
            <div class="col-6 col-sm-6 col-md-4 col-lg-4 hidden-xs">
              <div class="leftLogo-w">
                <img src="../../assets/image/logo2.png" alt="logo" title="alt" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>     
    
    <!-- services content -->
    <div class="pagesHeader-w">
      
    </div>
</div>