import { Component } from '@angular/core';
import { Topbar } from "../default/topbar";

@Component({
  selector: "rd-frame-header",
  template: `
    <header id="m_header" class="m-grid__item m-header" m-minimize-offset="200" m-minimize-mobile-offset="200">
      <div class="m-container m-container--fluid m-container--full-height">
        <div class="m-stack m-stack--ver m-stack--desktop m-header__wrapper">
          <div class="m-stack__item m-brand  m-brand--mobile" style="width:100%">
            <div class="m-stack m-stack--ver m-stack--general">
              <div class="m-stack__item m-stack__item--middle m-brand__logo">
                <a routerLink="/home" class="m-brand__logo-wrapper">
                  <img alt="logo" class="logo-default" style="height:40px;margin:0" src="assets/custom/edas_logo.png" />
                </a>
              </div>
              <div class="m-stack__item m-stack__item--middle m-brand__tools">
                <a href="javascript:;" id="m_aside_left_toggle_mobile" class="m-brand__icon m-brand__toggler m-brand__toggler--left">
                  <span></span>
                </a>
                <a id="m_aside_header_topbar_mobile_toggle" href="javascript:;" class="m-brand__icon">
                  <i class="flaticon-more"></i>
                </a>
              </div>
            </div>
          </div>
          <div class="m-stack__item m-stack__item--middle m-stack__item--left m-header-head" id="m_header_nav">
            <div class="m-stack m-stack--ver m-stack--desktop">
              <div class="m-stack__item m-stack__item--middle m-stack__item--fit">
                <a href="javascript:;" id="m_aside_left_toggle" class="m-aside-left-toggler m-aside-left-toggler--left m_aside_left_toggler">
                  <span></span>
                </a>
              </div>
            </div>
          </div>
          <div class="m-stack__item m-stack__item--middle m-stack__item--center">
            <a routerLink="/home" class="m-brand m-brand--desktop">
              <img alt="logo" class="logo-default" style="height:40px;margin:0" src="assets/custom/edas_logo.png" />
            </a>
          </div>
          <div class="m-stack__item m-stack__item--right">			
            <div id="m_header_topbar" class="m-topbar m-stack m-stack--ver m-stack--general">
              <div class="m-stack__item m-topbar__nav-wrapper">
                <ul class="m-topbar__nav m-nav m-nav--inline">
                  <ng-container *ngFor="let item of items">
                    <rd-dynamic-component-loader [rd-page-type]="item"></rd-dynamic-component-loader>
                  </ng-container>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </header>
  `
})
export class TrandyHeader extends Topbar {

}