@caiomarcatti12/ui-header
v1.0.3
Published
Este projeto tem a finalidade de ser uma biblioteca que centraliza o contexto de "Cabeçalho" de aplicações em um formato padrão.
Downloads
2
Readme
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
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