diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html index 081de569..9b9db099 100644 --- a/src/app/login/login.component.html +++ b/src/app/login/login.component.html @@ -31,6 +31,9 @@
+
+ +
\ No newline at end of file diff --git a/src/app/login/login.component.scss b/src/app/login/login.component.scss index 25c07368..7472bef4 100644 --- a/src/app/login/login.component.scss +++ b/src/app/login/login.component.scss @@ -1,3 +1,9 @@ +.page-container { + height: 100%; + display: flex; + flex-direction: column; + background-image: linear-gradient(to right bottom, #e2bd2b, #f0a829, #fa9133, #ff7a41, #ff6352, #ff5774, #f55595, #df5db3, #af77d6, #748be2, #3798d8, #229ec2); + } #login-screen { background-image: linear-gradient(to right bottom, #e2bd2b, #f0a829, #fa9133, #ff7a41, #ff6352, #ff5774, #f55595, #df5db3, #af77d6, #748be2, #3798d8, #229ec2); } @@ -56,8 +62,27 @@ } #login-screen .input-field { width: 100%; + padding-bottom: 1%; } #login-screen .error { color: #fff; font-size: 1rem; } +.bottom-20{ + padding-bottom: 10%; +} +.icon-bottom{ + width: 30%; + height: 30%; + align-items: center; + justify-content: center; + margin: auto; + padding: 30% 5%; +} +::ng-deep .mat-form-field-appearance-outline.mat-form-field-invalid .mat-form-field-outline { + color: red!important; +} + +::ng-deep input.ng-invalid.ng-touched{ + border: none!important; +} \ No newline at end of file diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts index 682935b4..601efdc6 100644 --- a/src/app/login/login.component.ts +++ b/src/app/login/login.component.ts @@ -8,7 +8,8 @@ import { FormBuilder, FormGroup, Validators } from "@angular/forms"; }) export class LoginComponent implements OnInit { - logoPath:string = 'assets/images/bajaj_logo_ai.png'; + logoPath:string = 'assets/images/bajaj_logo_white.png'; + bottomImagePath:string = 'assets/images/bajaj_logo_70_white.png'; loginForm!: FormGroup; username:string =''; password:string = ''; @@ -23,6 +24,13 @@ export class LoginComponent implements OnInit { this.initFormControls(); } + ngAfterViewInit(){ + setTimeout(() => { + this.loginForm.controls['password'].markAsTouched(); + this.loginForm.controls['username'].markAsTouched(); + }, 0); + } + initFormControls(){ this.loginForm = this.formBuilder.group({ usernameId: ['',[Validators.required]], diff --git a/src/assets/images/bajaj_logo_70_white.png b/src/assets/images/bajaj_logo_70_white.png new file mode 100644 index 00000000..f262609f Binary files /dev/null and b/src/assets/images/bajaj_logo_70_white.png differ diff --git a/src/assets/images/bajaj_logo_white.png b/src/assets/images/bajaj_logo_white.png new file mode 100644 index 00000000..1b563dca Binary files /dev/null and b/src/assets/images/bajaj_logo_white.png differ