Fairoj : Component changes

2019-09-04 14:30:14 +05:30 · 2019-09-04 14:30:14 +05:30 · 07bd907a84
commit 07bd907a84
parent 6de45ac218
12 changed files with 263 additions and 46 deletions
--- a/ng8-seed/package-lock.json
+++ b/ng8-seed/package-lock.json
@ -786,8 +786,9 @@
      }
    },
    "@swimlane/ngx-datatable": {
-      "version": "git+https://github.com/zackarychapple/ngx-datatable.git#24d02ef0dcf14b99c11809a35cda7612230f293a",
-      "from": "git+https://github.com/zackarychapple/ngx-datatable.git"
+      "version": "15.0.2",
+      "resolved": "https://registry.npmjs.org/@swimlane/ngx-datatable/-/ngx-datatable-15.0.2.tgz",
+      "integrity": "sha512-IlUyCs/hLv12hzz2pGugbrdRpBbwE6JUM4Bm4CCqLptmZj+t8pw8Ywthde8yUDdpgGgTJeJ9G5o92QadyGbP3g=="
    },
    "@types/d3": {
      "version": "3.5.43",
--- a/ng8-seed/package.json
+++ b/ng8-seed/package.json
@ -26,7 +26,7 @@
    "@angular/router": "^8.2.2",
    "@ngx-translate/core": "^10.0.2",
    "@ngx-translate/http-loader": "^3.0.1",
-    "@swimlane/ngx-datatable": "git+https://github.com/zackarychapple/ngx-datatable.git",
+    "@swimlane/ngx-datatable": "^15.0.2",
    "angular-calendar": "^0.26.4",
    "angular-sortablejs": "^2.6.0",
    "angular-tree-component": "^8.4.0",
--- a/ng8-seed/src/app/components/contribute/contribute.component.html
+++ b/ng8-seed/src/app/components/contribute/contribute.component.html
@ -1,3 +1,4 @@
+<div id="top"></div>
  <!--starts-->
  <div fxLayout fxLayout="row"  fxLayout.xs="column"  fxLayoutGap.xs="0">
    <!-- <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="40" fxFlex.lg="1000" fxFlex.xl="40"> -->
@ -8,22 +9,22 @@
             <div fxLayout="row" fxLayoutAlign="start center" class="mb-2 pt-1">
 <mat-form-field dividerColor="primary" class="ml-xs mr-xs" style="width: 100%;">
 <mat-select placeholder="Select District" [(ngModel)]="currentDrink" [required]="isRequired" [disabled]="isDisabled" #drinkControl="ngModel">
-        <mat-option *ngFor="let drink of drinks" [value]="drink.value" [disabled]="drink.disabled">
-            {{ drink.viewValue }}
+        <mat-option *ngFor="let item of districtList" [value]="item.id" >
+            {{ item.value }}
        </mat-option>
    </mat-select>
 </mat-form-field>
 <mat-form-field dividerColor="accent" class="ml-xs mr-xs" style="width: 100%;">
 <mat-select placeholder="Select Schools" [(ngModel)]="currentDrink" [required]="isRequired" [disabled]="isDisabled" #drinkControl="ngModel">
-        <mat-option *ngFor="let drink of drinks" [value]="drink.value" [disabled]="drink.disabled">
-            {{ drink.viewValue }}
+        <mat-option *ngFor="let item of schoolList" [value]="item.id" >
+            {{ item.value }}
        </mat-option>
    </mat-select>
 </mat-form-field>
 <mat-form-field dividerColor="warn" class="ml-xs mr-xs" style="width: 100%;">
 <mat-select placeholder="Select Category" [(ngModel)]="currentDrink" [required]="isRequired" [disabled]="isDisabled" #drinkControl="ngModel">
-        <mat-option *ngFor="let drink of drinks" [value]="drink.value" [disabled]="drink.disabled">
-            {{ drink.viewValue }}
+        <mat-option *ngFor="let item of categoryList" [value]="item.id" >
+            {{ item.value }}
        </mat-option>
    </mat-select>
 </mat-form-field>
@ -44,11 +45,11 @@
                         <!-- <td class="product-remove">
                             <a href="#" class="remove" title="Remove this item">×</a> </td> -->
                         <td class="product-thumbnail">
-                             <a href="#"><img src="assets/images/nike.jpg" alt="" width="100"></a>
+                             <a href="#"><img src="assets/images/csr-img/donate.jpg" alt="" width="100"></a>
                         </td>
                         <td class="product-name">Student Benches required at Govt Girls School, Panruti, Villupuram Dt.</td>
                         <td class="product-price">
-                             <span class=" amount">25<br><span class="price">$</span>23.00</span>
+                             <span class=" amount">25<br><span class="price">&#8377;</span>23.00</span>
                         </td>
                         <td class="product-quantity" data-title="Quantity">
                             <div class="quantity buttons_added">
@ -56,19 +57,19 @@
                             </div>
                         </td>
                         <td class="product-subtotal" data-title="Total">
-                             <span class="price-amount"><span>$</span>69.00</span>
+                             <span class="price-amount"><span>&#8377;</span>69.00</span>
                         </td>
                     </tr>
                     <tr class="cart_item">
                         <!-- <td class="product-remove">
                             <a href="#" class="remove" title="Remove this item">×</a> </td> -->
                         <td class="product-thumbnail">
-                             <a href="#"><img src="assets/images/nike.jpg" alt="" width="100"></a>
+                             <a href="#"><img src="assets/images/csr-img/img1.jpeg" alt="" width="100"></a>
                         </td>
                         <td class="product-name">
                             <a href="#">Student Benches required at Govt Girls School, Panruti, Villupuram Dt.</a> </td>
                         <td class="product-price">
-                             <span class=" amount">20<br><span class="price">$</span>23.00</span>
+                             <span class=" amount">20<br><span class="price">&#8377;</span>23.00</span>
                         </td>
                         <td class="product-quantity" data-title="Quantity">
                             <div class="quantity buttons_added">
@ -76,19 +77,19 @@
                             </div>
                         </td>
                         <td class="product-subtotal" data-title="Total">
-                             <span class="price-amount"><span>$</span>69.00</span>
+                             <span class="price-amount"><span>&#8377;</span>69.00</span>
                         </td>
                     </tr>
                     <tr class="cart_item">
                            <!-- <td class="product-remove">
                                <a href="#" class="remove" title="Remove this item">×</a> </td> -->
                            <td class="product-thumbnail">
-                                <a href="#"><img src="assets/images/nike.jpg" alt="" width="100"></a>
+                                <a href="#"><img src="assets/images/csr-img/img2.jpeg" alt="" width="100"></a>
                            </td>
                            <td class="product-name">
                                <a href="#">Student Benches required at Govt Girls School, Panruti, Villupuram Dt.</a> </td>
                            <td class="product-price">
-                                <span class=" amount">20<br><span class="price">$</span>23.00</span>
+                                <span class=" amount">20<br><span class="price">&#8377;</span>23.00</span>
                            </td>
                            <td class="product-quantity" data-title="Quantity">
                                <div class="quantity buttons_added">
@ -96,19 +97,19 @@
                                </div>
                            </td>
                            <td class="product-subtotal" data-title="Total">
-                                <span class="price-amount"><span>$</span>69.00</span>
+                                <span class="price-amount"><span>&#8377;</span>69.00</span>
                            </td>
                        </tr>
                        <tr class="cart_item">
                                <!-- <td class="product-remove">
                                    <a href="#" class="remove" title="Remove this item">×</a> </td> -->
                                <td class="product-thumbnail">
-                                    <a href="#"><img src="assets/images/nike.jpg" alt="" width="100"></a>
+                                    <a href="#"><img src="assets/images/csr-img/img3.jpg" alt="" width="100"></a>
                                </td>
                                <td class="product-name">
                                    <a href="#">Student Benches required at Govt Girls School, Panruti, Villupuram Dt.</a> </td>
                                <td class="product-price">
-                                    <span class=" amount">20<br><span class="price">$</span>23.00</span>
+                                    <span class=" amount">20<br><span class="price">&#8377;</span>23.00</span>
                                </td>
                                <td class="product-quantity" data-title="Quantity">
                                    <div class="quantity buttons_added">
@ -116,7 +117,7 @@
                                    </div>
                                </td>
                                <td class="product-subtotal" data-title="Total">
-                                    <span class="price-amount"><span>$</span>69.00</span>
+                                    <span class="price-amount"><span>&#8377;</span>69.00</span>
                                </td>
                            </tr>
                     <tr>
@ -124,14 +125,14 @@
                                <strong><span>Total</span></strong>                                   
                         </td>
                         <td class="product-subtotal" data-title="Total">
-                                <strong><span class="amount"><span class="currency-symbol">$</span>167.00</span></strong>
+                                <strong><span class="amount"><span class="currency-symbol">&#8377;</span>167.00</span></strong>
                         </td>
                     </tr>
                 </tbody>
             </table>
             <div class="pt-1" style="text-align: right;">
                    <button mat-raised-button color="primary" class="mr-1 mb-1">Will Contribute the above in kind</button>
-                    <button mat-raised-button color="primary" class="mr-1 mb-1">Proceed for Payment</button>
+                    <button [routerLink]="['/authentication']" mat-raised-button style="background-color:rgb(69, 189, 189);color:white" >Proceed for Payment</button>
                  </div>
         </form>
         <!-- <div class="clearfix order-total">
@ -140,12 +141,12 @@
                 <table class="table-responsive" cellspacing="0">
                     <tr class="cart-subtotal">
                         <th>Subtotal</th>
-                         <td><span class="amount"><span class="currency-symbol">$</span>167.00</span>
+                         <td><span class="amount"><span class="currency-symbol">&#8377;</span>167.00</span>
                         </td>
                     </tr>
                     <tr class="order-total">
                         <th>Total</th>
-                         <td><strong><span class="amount"><span class="currency-symbol">$</span>167.00</span></strong> </td>
+                         <td><strong><span class="amount"><span class="currency-symbol">&#8377;</span>167.00</span></strong> </td>
                     </tr>
                 </table>
                 <div class="order-checkout">
@ -176,24 +177,31 @@
                    <mat-radio-button name="group1" class="pb-1">State School Dev Fund</mat-radio-button> 
                    <mat-radio-button name="group1">District School Dev Fund</mat-radio-button>
                    <mat-form-field style="width: 100%" class="pl-1">
-                            <mat-select placeholder="Select District" [(ngModel)]="currentDrink" [required]="isRequired" [disabled]="isDisabled" #drinkControl="ngModel">
-                                    <mat-option *ngFor="let drink of drinks" [value]="drink.value" [disabled]="drink.disabled">
-                                        {{ drink.viewValue }}
+                            <mat-select placeholder="Select District"  [required]="isRequired" [disabled]="isDisabled" >
+                                    <mat-option *ngFor="let item of districtList" [value]="item.id" >
+                                        {{ item.value }}
                                    </mat-option>
                                </mat-select>
                    </mat-form-field> 
                    <mat-radio-button name="group1">School Dev Fund</mat-radio-button> 
                    <mat-form-field style="width: 100%" class="pl-1">
-                            <mat-select placeholder="Select School" [(ngModel)]="currentDrink" [required]="isRequired" [disabled]="isDisabled" #drinkControl="ngModel">
-                                    <mat-option *ngFor="let drink of drinks" [value]="drink.value" [disabled]="drink.disabled">
-                                        {{ drink.viewValue }}
+                            <mat-select placeholder="Select District"  [required]="isRequired" [disabled]="isDisabled" >
+                                    <mat-option *ngFor="let item of districtList" [value]="item.id" >
+                                        {{ item.value }}
+                                    </mat-option>
+                                </mat-select>
+                    </mat-form-field> 
+                    <mat-form-field style="width: 100%" class="pl-1">
+                            <mat-select placeholder="Select School" [required]="isRequired" [disabled]="isDisabled" >
+                                    <mat-option *ngFor="let item of schoolList" [value]="item.id" >
+                                        {{ item.value }}
                                    </mat-option>
                                </mat-select>
                    </mat-form-field>  
                    <mat-form-field dividerColor="warn" class="ml-xs mr-xs" style="width: 100%;">
                            <textarea matInput placeholder="Remarks" value="Some Text ..."></textarea>
                          </mat-form-field>  
-                    <button class="mat-green" mat-raised-button>Proceed for Payment</button>                      
+                    <button [routerLink]="['/authentication']" class="mat-green" mat-raised-button>Proceed for Payment</button>                      
                </div>
    </mat-card-content>
 </mat-card>
--- a/ng8-seed/src/app/components/contribute/contribute.component.scss
+++ b/ng8-seed/src/app/components/contribute/contribute.component.scss
@ -80,4 +80,30 @@
        .calculated-shipping{
            width: 100%;
        }
-    }
+    }
+     .footer {
+    margin:0;
+    width:100%;
+    overflow: hidden;
+  position: relative;
+  // bottom: 10px;
+  top:20px;
+  // margin:0;
+  width: 100%;
+  padding-left:10px;
+  /* Set the fixed height of the footer here */
+  height: 40px;
+  line-height: 60px;
+  background-color:rgb(69, 189, 189);
+}
+.footer h5{
+    font-size: 13px;
+    color:white;
+    font-weight: bold;
+  position: absolute;
+  top: 1%;
+  left: 50%;
+  -moz-transform: translateX(-50%) translateY(-50%);
+  -webkit-transform: translateX(-50%) translateY(-50%);
+  transform: translateX(-50%) translateY(-50%);
+}
--- a/ng8-seed/src/app/components/contribute/contribute.component.ts
+++ b/ng8-seed/src/app/components/contribute/contribute.component.ts
@ -38,9 +38,55 @@ export class ContributeComponent implements OnInit {
    value: 'milk-8',
    viewValue: 'Milk'
  }];
+  districtList=[{
+    id:"1",
+    value:"Chennai"
+  },{
+    id:"2",
+    value:"Vellore"
+  },{
+    id:"3",
+    value:"Thiruvannamalai"
+  },{
+    id:"4",
+    value:"Kanchipuram"
+  },{
+    id:"5",
+    value:"Nagapattinam"
+  },]
+  schoolList=[{
+    id:"1",
+    value:"Govt High School"
+  },
+  {
+    id:"2",
+    value:"Govt Primary School"
+  }]
+  categoryList=[{
+    id:"1",
+    value:"Building"
+  },
+  {
+    id:"2",
+    value:"Furnitures"
+  },
+  {
+    id:"2",
+    value:"Students kit"
+  }]
  constructor() { }

  ngOnInit() { 
  }

+  ngAfterViewInit() {
+    // Hack: Scrolls to top of Page after page view initialized
+    let top = document.getElementById('top');
+    console.log("d",top);
+    if (top !== null) {
+      top.scrollIntoView();
+      top = null;
+    }
+  }
+
 }
--- a/ng8-seed/src/app/components/project-detail/project-detail.component.html
+++ b/ng8-seed/src/app/components/project-detail/project-detail.component.html
@ -1,4 +1,5 @@
 <!-- <app-layout-admin></app-layout-admin> -->
+<div id="top"></div>
 <mat-card class="p-2 main-detail-product">
        <div fxLayout="row wrap">
            <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="30" fxFlex.lg="50" fxFlex.xl="30">
@ -34,7 +35,7 @@
                    <div class="price">
                        <!-- <h2>$120<span class="sale">$129</span></h2> -->
                        <h4>Thiruvannamalai</h4>
-                        <button mat-raised-button  class="button-cyan">Contribute</button>
+                        <button mat-raised-button [routerLink]="['/contribute']" class="button-cyan">Contribute</button>
                    </div>
                    <div class="separator"></div>
                    <p>Tamil Nadu is one of the most literate states in India. The state's literacy rate is 80.33% in 2011, which is above the national average. A survey conducted by the Industry body Assocham ranks Tamil Nadu top among Indian states with about 100% Gross Enrollment Ratio (GER) in primary and upper primary education.</p>
--- a/ng8-seed/src/app/components/project-detail/project-detail.component.ts
+++ b/ng8-seed/src/app/components/project-detail/project-detail.component.ts
@ -28,6 +28,16 @@ export class ProjectDetailComponent implements OnInit {
  ngOnInit() {
  }

+  ngAfterViewInit() {
+    // Hack: Scrolls to top of Page after page view initialized
+    let top = document.getElementById('top');
+    console.log("d",top);
+    if (top !== null) {
+      top.scrollIntoView();
+      top = null;
+    }
+  }
+
  thumbnailClick(index){
    this.sliderimg.goToSlide(index);
  }
--- a/ng8-seed/src/app/dashboard/dashboard.component.html
+++ b/ng8-seed/src/app/dashboard/dashboard.component.html
@ -1,22 +1,33 @@
 <!-- <app-layout></app-layout> -->
+<div id="top"></div>
 <div fxLayout="row wrap">
  <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="200" fxFlex.xl="100"> 
    <div class="form-bg">
      <!-- <div class="container"> -->
-        <div fxLayout="row wrap" fxLayoutAlign="center" class="mb-2 pt-3">
-            <div fxLayoutAlign="center" fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="18.33" fxFlex.lg="18.33" fxFlex.xl="18.33" fxFlex="100">
-               <mat-card class="mc-1" style="width: 75%;height: 160px;"> 
+         <div fxLayout="column" fxLayoutAlign="center">
+            <!-- <div fxFlex="100"> -->
+               <div style="margin: 0px;" fxLayoutAlign="center"  fxFlex="10">
+               <h5 class="flex-text">There is no exercise better for the heart than reaching down and lifting people up.</h5>
+            </div>
+            <!-- </div> -->
+         </div>
+        
+        <div fxLayout="row wrap" fxLayoutAlign="center" >
+           <!-- <div > -->
+            <div fxLayoutAlign="center" fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="25.33" fxFlex.lg="25.33" fxFlex.xl="25.33" fxFlex="100" *ngFor="let flex_value of flexContent;let i=index" style="margin-top:30px;">
+               <mat-card [class]="flex_value.card_class" style="width: 75%;height: 160px;"> 
                  <div fxFlex.gt-sm="100%" fxLayoutAlign="center center" fxFlex="100" class="m-gap p-gap mb-0 icon-tp">
                      <div class="text-center m-color">
-                         <i class="fa fa-university fa-3x"></i>
+                         <i [class]="flex_value.icon"></i>
                         <div class="d-inline-block">
-                            <h5>School</h5>
+                            <h5>{{flex_value.name}}</h5>
                         </div>
                      </div>
                   </div>
               </mat-card>
            </div>
-            <div fxLayoutAlign="center" fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="18.33" fxFlex.lg="18.33" fxFlex.xl="18.33" fxFlex="100">
+         <!-- </div> -->
+            <!-- <div fxLayoutAlign="center" fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="18.33" fxFlex.lg="18.33" fxFlex.xl="18.33" fxFlex="100">
                <mat-card class="mc-2" style="width: 75%;height: 160px;"> 
                    <div fxFlex.gt-sm="100%" fxLayoutAlign="center center" fxFlex="100" class="m-gap p-gap mb-0 icon-tp">
                        <div class="text-center m-color">
@ -57,7 +68,7 @@
                    <div fxFlex.gt-sm="100%" fxLayoutAlign="center center" fxFlex="100" class="m-gap p-gap mb-0 icon-tp">
                        <div class="text-center m-color">
                           <i class="fa fa-university fa-3x"></i>
-                           <div class="d-inline-block">
+                           <div >
                              <h5>School</h5>
                           </div>
                        </div>
@ -125,7 +136,7 @@
                        </div>
                     </div> 
                  </mat-card>
-             </div>
+             </div> -->
         </div>
        <!-- </div> -->
    </div>
--- a/ng8-seed/src/app/dashboard/dashboard.component.scss
+++ b/ng8-seed/src/app/dashboard/dashboard.component.scss
@ -16,21 +16,77 @@ $p: 12px;
 // }
 .mc-1{
    background-color: rgba(51,211,192,0.9);
+    z-index: 4;
+}
+.mc-1 :hover{
+    cursor: pointer;
+    background-color: rgba(65, 158, 147, 0.9);
+    i{
+        font-size:52px;
+        // padding:10px;
+       
+    }
+}
+.mc-2 :hover{
+    background-color: rgba(1, 152, 172, 0.9);
+    cursor: pointer;
+    i{
+        font-size:52px;
+       
+    }
+}
+.mc-3 :hover{ 
+    background-color: rgb(0, 126, 175);
+    cursor: pointer;
+    i{
+        font-size:52px;
+       
+    }
+}
+
+.mc-4 :hover{
+    background-color: rgba(5, 107, 170, 0.9);
+    cursor: pointer;
+    i{
+        font-size:52px;
+       
+    }
+}
+.mc-5 :hover{
+    background-color: rgb(102, 90, 177);
+    cursor: pointer;
+    i{
+        font-size:52px;
+       
+    }
+}
+.mc-6 :hover{
+    background-color: rgba(180, 143, 69, 0.9);
+    cursor: pointer;
+    i{
+        font-size:52px;
+       
+    }
 }
 .mc-2{
+    z-index: 4;
    background-color: rgba(0,190,214,0.9);
 }
 .mc-3{
    background-color: rgba(0,165,228,0.9);
+    z-index: 4;
 }
 .mc-4{
    background-color: rgba(0,136,223,0.9);
+    z-index: 4;
 }
 .mc-5{
    background-color: rgba(111,99,195,0.9);
+    z-index: 4;
 }
 .mc-6{
    background-color: rgba(255,198,88,0.9);
+    z-index: 4;
 }
 .mc-7{
    background-color: rgba(255,148,92,0.9);
@ -43,10 +99,23 @@ $p: 12px;
 }
 .mc-10{
    background-color: rgba(150,55,144,0.9);
+    
 }
 .m-color{
    color: #fff !important;
 }
+.flex-text{
+    color:white;
+    font-style: oblique;
+    font-size: 22px;
+    z-index: 2;
+}
+.flex-text2{
+    color:white;
+    font-style: oblique;
+    font-size: 18px;
+    z-index: 2;
+}
 .form-bg{
    height: 80vh;
    min-height: calc(54vh + 70px);
--- a/ng8-seed/src/app/dashboard/dashboard.component.ts
+++ b/ng8-seed/src/app/dashboard/dashboard.component.ts
@ -23,10 +23,54 @@ export class DashboardComponent {
    // url:'https://cdn.vox-cdn.com/uploads/chorus_image/image/56789263/akrales_170919_1976_0104.0.jpg',
    url:'assets/images/csr-img/ban3.jpg',
    caption:'Third'
-  }
-  
-]
+  }]
+
+  flexContent=[{
+    id:1,
+    icon:'fa fa-university fa-3x',
+    name:'School',
+    card_class:"mc-1"
+  },
+  {
+    id:2,
+    icon:'fa fa-building fa-3x',
+    name:'Building',
+    card_class:'mc-2'
+  },
+  {
+    id:3,
+    icon:'fa fa-laptop fa-3x',
+    name:'Furniture',
+    card_class:'mc-3'
+  },
+  {
+    id:4,
+    icon:'fa fa-child fa-3x',
+    name:'Uniforms',
+    card_class:'mc-4'
+  },
+  {
+    id:5,
+    icon:'fa fa-briefcase fa-3x',
+    name:'Bags',
+    card_class:'mc-5'
+  },
+  {
+    id:6,
+    icon:'fa fa-book fa-3x',
+    name:'Kit',
+    card_class:'mc-6'
+  }]
  constructor() {
    this.txt=this.txt;
  }
+  ngAfterViewInit() {
+    // Hack: Scrolls to top of Page after page view initialized
+    let top = document.getElementById('top');
+    console.log("d",top);
+    if (top !== null) {
+      top.scrollIntoView();
+      top = null;
+    }
+  }
 }
--- a/ng8-seed/src/assets/styles/scss/_material.variables.scss
+++ b/ng8-seed/src/assets/styles/scss/_material.variables.scss
@ -4,6 +4,7 @@

@import '~@angular/material/theming';
 $primary: mat-palette($mat-deep-purple);
+$secondary:rgb(69, 189, 189);
 $accent:  mat-palette($mat-amber, A200, A100, A400);
 $warn: mat-palette($mat-red);
 $theme: mat-light-theme($primary, $accent, $warn);
--- a/ng8-seed/src/assets/styles/scss/core/_sessions.scss
+++ b/ng8-seed/src/assets/styles/scss/core/_sessions.scss
@ -8,7 +8,7 @@
 }

 .form-bg {
-    background-image: url("/../../../assets/images/login.jpg");
+    background-image: url("assets/images/login.jpg");
 }

 .form-bg {