@broadstone/login v0.0.4

LogIn Component

Angular version 8.2.14.

How to use

npm i @broadstone/login --save

ADD to app.module.ts

import { FormLoginModule} from '@broadstone/login';
@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
    FormLoginModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})

ADD in .html EXAMPLE HERE

<component-login-form (forgotPassword)="forgot_pass()" (onSubmit)="call_api($event)" [carousel_data]="carousel_data" [logo]="logo_src"></component-login-form>
    
<component-login-form (onSubmit)="call_api($event)" (forgotPassword)="forgot_pass()" left_image='./assets/icons/dd_logo.svg'></component-login-form>

Inside Component

  @Output() signUpLink: EventEmitter<any> = new EventEmitter();
  @Output() forgotPassword: EventEmitter<any> = new EventEmitter();
  @Output() onSubmit: EventEmitter<any> = new EventEmitter(); //{account:object, remember:boolean, loading:object}
  @Input() logo: string = null;
  @Input() carousel_data: any = []; //{image: string, title:string, subtitle:string};
  @Input() left_image: string;
  loading: any = { save_loading:  false };

Colors --string base on cornerstone Variables Must be defined in project styles.scss

:root {
	$color_primary: var(--color_primary);

	$color_grey_2: var(--color_grey_2);
	$color_grey_5: var(--color_grey_5);

	$color_white: var(--color_white);
	$shadow_color: var(--shadow_color);

	$shadow_1: var(--shadow_1);
	$border_small_ultra_light_grey: var(--border_small_ultra_light_grey);
	$font_demi_bold: var(--font_demi_bold);
	$p_size: var(--p_size);
}

For support Internet Explorer In angular project tsconfig.json change target to "target": "es5", Add npm install --save css-vars-ponyfill - import cssVars from 'css-vars-ponyfill'; // In app.component.ts - cssVars({watch: true, onlyLegacy: true }); // app.component.ts Constructor()

Depending on

@broadstone/clib-button
ng-zorro-antd