Login

O componente Login deve ser adicionado em uma pagina, e ele carrega os ítens necessários para realizar a autenticação.

Existe dois tipo de autenticação: Com formulário e Apenas com botão.

Login sem Formulário

Login com Formulário

Atributos da tag

Atributo	Input/Output	Tipo	Obrigatório	Valor padrão
header	@Input	String	Sim	Header
subHeader	@Input	String	Não	Subheader
buttonText	@Input	String	Não	Button
desktopImage	@Input	String	Não	-
mobileImage	@Input	String	Não	-
floatLogo	@Input	String	Não	-
googleLogo	@Input	String	Não	-
buttonBackground	@Input	String	Não	red
hasForm	@Input	Boolean	Não	false
fieldUser	@Input	Boolean	Não	User
fieldPass	@Input	Boolean	Não	Password
signIn	@Input	String	Sim	-

Button background

As cores aceitas são: red, aquamarine, gray, yellow, green e purple

Como usar

HTML

<ugl-login #auth

[header]="'Ugla'"

[subheader]="'Library'"

[buttonText]="'Authenticate'"

[desktopImage]="'./assets/imgs/autentication-desktop.jpg'"

[mobileImage]="'./assets/imgs/autentication-mobile.jpg'"

[googleLogo]="'./assets/imgs/icon-google.svg'"

[buttonBackgroud]="'aquamarine'"

[hasForm]="true"

(signIn)="signIn2()"></ugl-login>

Typescript

// Para o tipo Form, recebe o objeto do tipo Auth

signIn(auth: Auth) {

this.toast.success('Login', `Usuário ${auth.user} autenticado com sucesso`, 5000);

}

// Para o tipo No Form, não recebe o objeto do tipo Auth

signIn2() {

this.toast.success('Login', `Usuário autenticado com sucesso`, 5000);

}