crazywebtag-header

Crazywebtag Header

#Installation

Angular 5.2.0

$ npm install crazywebtag-header

#Usage

##App Module In app.module add

import { CrazywebtagHeaderComponent } from './crazywebtag-header/crazywebtag-header.component';

and

@NgModule({
  declarations: [
    CrazywebtagHeaderComponent
  ],
});

####Component In component html page add

<crazywebtag-header [headerData]="headerData"></crazywebtag-header>

######headerData

Main format for headerData should be like below:

{
    "logo": "./assets/images/logo.png",
    "sitename": "Crazywebtag",
    "href": "/home",
    menu: [
      {
        "name": "Home",
        "href": "/home"
      },
      {
        "name": "About Me",
        "href": "/about-me"
      },
      {
        "name": "Portfolio",
        "href": "/portfolio",
        submenu: [
          {
            "name": "What I Do",
            "href": "/portfolio/what-i-do"
          },
          {
            "name": "My Works",
            "href": "/portfolio/my-works"
          },
          {
            "name": "Clients",
            "href": "/portfolio/clients"
          }
        ]
      },
      {
        "name": "Blog",
        "href": "/blog/all",
        submenu: [
          {
            "name": "CSS Properties",
            "href": "/blog/css-properties"
          },
          {
            "name": "Plugins & Component",
            "href": "/blog/plugins"
          },
          {
            "name": "UI & UX",
            "href": "/blog/uiux"
          }
        ]
      },
      {
        "name": "Contact Me",
        "href": "/contact-me"
      }
    ]
  };

'logo': is the path of the logo image, it also support svg format.
'sitename': is the site name as text.
'name': is the text will be showen fot the user.
'href': is where link go when user click.

Note All fileds are required.

##Demo

Please see demo