image updates

src/app/login/login.component.html

@@ -31,6 +31,9 @@
             <div class="align-middle flex-row">
                 <button mat-raised-button color="primary">Sign In</button>
             </div>
+            <div class="flex-row">
+                <img class="icon-bottom" [src]="bottomImagePath" />
+            </div>
         </div>
     </form>
 </div>

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;
+}

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]],