WEB-35 Make htmlhint pass with no warnings (#2311)

src/app/products/charges/charges.component.html

@@ -9,11 +9,11 @@
 
 <div class="container">
   <div #filter fxLayout="row" fxLayoutGap="20px">
-    <mat-form-field fxFlex fxFlex="68%">
+    <mat-form-field fxFlex="68%">
       <mat-label>{{ 'labels.inputs.Filter' | translate }}</mat-label>
       <input matInput (keyup)="applyFilter($event.target.value)" />
     </mat-form-field>
-    <mat-form-field fxFlex fxFlex="28%">
+    <mat-form-field fxFlex="28%">
       <mat-select
         placeholder="{{ 'labels.inputs.Filter' | translate }}"
         (selectionChange)="filterByAppliesTo($event.value)"
@@ -104,7 +104,7 @@
 
 <ng-template #templateButtonCreateCharge let-popover="popover">
   <h2>{{ 'labels.text.Create Charge' | translate }}</h2>
-  <p class="mw300">{{ 'labels.text.Supports Loan charges, Savings & deposits' | translate }}</p>
+  <p class="mw300">{{ 'labels.text.Supports Loan charges, Savings &amp; deposits' | translate }}</p>
   <div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
     <button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
       {{ 'labels.buttons.Close' | translate }}

src/app/products/charges/edit-charge/edit-charge.component.html

@@ -16,7 +16,7 @@
           </mat-form-field>
         </div>
 
-        <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" style="margin-top: 10px">
+        <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" class="form-section">
           <mat-form-field fxFlex="48%">
             <mat-label>{{ 'labels.inputs.Name' | translate }}</mat-label>
             <input matInput required autofocus formControlName="name" />
@@ -192,7 +192,7 @@
           </mat-form-field>
         </div>
 
-        <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" style="margin-top: 10px">
+        <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" class="form-section">
           <div fxFlex="48%" class="password-never-expires-wrapper">
             <mat-checkbox labelPosition="before" formControlName="active">
               {{ 'labels.status.Active' | translate }}

src/app/products/charges/edit-charge/edit-charge.component.scss

@@ -1,3 +1,7 @@
 .checkbox {
   padding-top: 10px;
 }
+
+.form-section {
+  margin-top: 10px;
+}