@caiomarcatti12/ui-header

Header

Este projeto tem a finalidade de ser uma biblioteca que centraliza o contexto de "Cabeçalho" de aplicações em um formato padrão.

Features

A estrutura do component possui as seguintes features:

• Cabeçalho header azul com nome dinâmico, que pode ser alterado com a propriedade do component "title".
• Um sidebar que pode ser incluído uma lista de aplicações de forma dinâmica, que pode ser alterado com a propriedade do component "applications"

Pré requisitos

• Npm 8.19.3
• Angular 15.1.0
• Nodejs 16.19.0

Dependências

• Primeng
• PrimeIcon
• PrimeFlex

Como usar

Adicione o código abaixo em seu arquivo *.component.ts

 @Input('title')
  title: string = ''

  @Input('applications')
  applications: any = [
    {
      name: "Extrator de contatos telegram",
      image: "https://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Telegram_logo.svg/480px-Telegram_logo.svg.png",
      url: "/telegram/contact-extractor/"
    }
  ]

Adicione o código abaixo em seu arquivo *.component.html

<lib-header [title]="title" [applications]="applications">

Como podem ver o "input" applications é uma matriz que possui propriedades sugestivas, mas vamos explicar elas aqui.

• Lista
  • name: Nome da aplicação
  • image: Icone da aplicação
  • url: Url que será redirecionado ao clicar na aplicação