Merge pull request #1963 from bcgov/bugfix/ALCS-2350-remove-table-bor…

…der-on-warning ALCS-2350 Remove borders when there is a residential warning
bcgov · Nov 6, 2024 · 4ed64bb · 4ed64bb
2 parents 01791a8 + 0f54acd
commit 4ed64bb
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 17 deletions.
diff --git a/...features/applications/edit-submission/proposal/pfrs-proposal/pfrs-proposal.component.html b/...features/applications/edit-submission/proposal/pfrs-proposal/pfrs-proposal.component.html
@@ -314,12 +314,12 @@ <h2>Proposal</h2>
         <table mat-table [dataSource]="structuresSource" multiTemplateDataRows *ngIf="!isMobile">
           <ng-container matColumnDef="index">
             <th mat-header-cell *matHeaderCellDef>#</th>
-            <td mat-cell *matCellDef="let i = dataIndex">{{ i + 1 }}</td>
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">{{ i + 1 }}</td>
           </ng-container>
 
           <ng-container matColumnDef="type">
             <th mat-header-cell *matHeaderCellDef>Type</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <mat-select
                   [value]="element.type"
@@ -350,7 +350,7 @@ <h2>Proposal</h2>
 
           <ng-container matColumnDef="area">
             <th mat-header-cell *matHeaderCellDef>Total Floor Area</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <input
                   type="text"
@@ -383,7 +383,7 @@ <h2>Proposal</h2>
 
           <ng-container matColumnDef="action">
             <th mat-header-cell *matHeaderCellDef>Action</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <button mat-stroked-button color="accent" (click)="onStructureRemove(element.id)" type="button">
                 Remove
               </button>

diff --git a/...features/applications/edit-submission/proposal/pfrs-proposal/pfrs-proposal.component.scss b/...features/applications/edit-submission/proposal/pfrs-proposal/pfrs-proposal.component.scss
@@ -36,3 +36,11 @@ section {
   margin: rem(10) 0 rem(20) rem(5);
   line-height: rem(24);
 }
+
+.no-top-border {
+  border-top-style: hidden;
+}
+
+.no-bottom-border {
+  border-bottom-style: hidden;
+}
diff --git a/...features/applications/edit-submission/proposal/pofo-proposal/pofo-proposal.component.html b/...features/applications/edit-submission/proposal/pofo-proposal/pofo-proposal.component.html
@@ -222,12 +222,12 @@ <h2>Proposal</h2>
         <table mat-table [dataSource]="structuresSource" multiTemplateDataRows *ngIf="!isMobile">
           <ng-container matColumnDef="index">
             <th mat-header-cell *matHeaderCellDef>#</th>
-            <td mat-cell *matCellDef="let i = dataIndex">{{ i + 1 }}</td>
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">{{ i + 1 }}</td>
           </ng-container>
 
           <ng-container matColumnDef="type">
             <th mat-header-cell *matHeaderCellDef>Type</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <mat-select
                   [value]="element.type"
@@ -258,7 +258,7 @@ <h2>Proposal</h2>
 
           <ng-container matColumnDef="area">
             <th mat-header-cell *matHeaderCellDef>Total Floor Area</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <input
                   type="text"
@@ -291,7 +291,7 @@ <h2>Proposal</h2>
 
           <ng-container matColumnDef="action">
             <th mat-header-cell *matHeaderCellDef>Action</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <button mat-stroked-button color="accent" (click)="onStructureRemove(element.id)" type="button">
                 Remove
               </button>

diff --git a/...features/applications/edit-submission/proposal/pofo-proposal/pofo-proposal.component.scss b/...features/applications/edit-submission/proposal/pofo-proposal/pofo-proposal.component.scss
@@ -36,3 +36,11 @@ section {
   margin: rem(10) 0 rem(20) rem(5);
   line-height: rem(24);
 }
+
+.no-top-border {
+  border-top-style: hidden;
+}
+
+.no-bottom-border {
+  border-bottom-style: hidden;
+}
diff --git a/...features/applications/edit-submission/proposal/roso-proposal/roso-proposal.component.html b/...features/applications/edit-submission/proposal/roso-proposal/roso-proposal.component.html
@@ -224,12 +224,12 @@ <h2>Proposal</h2>
             <table mat-table [dataSource]="structuresSource" multiTemplateDataRows *ngIf="!isMobile">
               <ng-container matColumnDef="index">
                 <th mat-header-cell *matHeaderCellDef>#</th>
-                <td mat-cell *matCellDef="let i = dataIndex">{{ i + 1 }}</td>
+                <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">{{ i + 1 }}</td>
               </ng-container>
 
               <ng-container matColumnDef="type">
                 <th mat-header-cell *matHeaderCellDef>Type</th>
-                <td mat-cell *matCellDef="let element">
+                <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
                   <mat-form-field appearance="outline">
                     <mat-select
                       [value]="element.type"
@@ -260,7 +260,7 @@ <h2>Proposal</h2>
 
               <ng-container matColumnDef="area">
                 <th mat-header-cell *matHeaderCellDef>Total Floor Area</th>
-                <td mat-cell *matCellDef="let element">
+                <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
                   <mat-form-field appearance="outline">
                     <input
                       type="text"
@@ -293,7 +293,7 @@ <h2>Proposal</h2>
 
               <ng-container matColumnDef="action">
                 <th mat-header-cell *matHeaderCellDef>Action</th>
-                <td mat-cell *matCellDef="let element">
+                <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
                   <button mat-stroked-button color="accent" (click)="onStructureRemove(element.id)" type="button">
                     Remove
                   </button>

diff --git a/...features/applications/edit-submission/proposal/roso-proposal/roso-proposal.component.scss b/...features/applications/edit-submission/proposal/roso-proposal/roso-proposal.component.scss
@@ -36,3 +36,11 @@ section {
   margin: rem(10) 0 rem(20) rem(5);
   line-height: rem(24);
 }
+
+.no-top-border {
+  border-top-style: hidden;
+}
+
+.no-bottom-border {
+  border-bottom-style: hidden;
+}
diff --git a/...e-of-intents/edit-submission/additional-information/additional-information.component.html b/...e-of-intents/edit-submission/additional-information/additional-information.component.html
@@ -82,12 +82,12 @@ <h2>Additional Proposal Information</h2>
         <table mat-table [dataSource]="structuresSource" multiTemplateDataRows *ngIf="!isMobile">
           <ng-container matColumnDef="index">
             <th mat-header-cell *matHeaderCellDef>#</th>
-            <td mat-cell *matCellDef="let i = dataIndex">{{ i + 1 }}</td>
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">{{ i + 1 }}</td>
           </ng-container>
 
           <ng-container matColumnDef="type">
             <th mat-header-cell *matHeaderCellDef>Type</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <mat-select
                   [value]="element.type"
@@ -118,7 +118,7 @@ <h2>Additional Proposal Information</h2>
 
           <ng-container matColumnDef="area">
             <th mat-header-cell *matHeaderCellDef>Total Floor Area</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <mat-form-field appearance="outline">
                 <input
                   type="text"
@@ -151,7 +151,7 @@ <h2>Additional Proposal Information</h2>
 
           <ng-container matColumnDef="action">
             <th mat-header-cell *matHeaderCellDef>Action</th>
-            <td mat-cell *matCellDef="let element">
+            <td mat-cell *matCellDef="let i = dataIndex; let element" [ngClass]="{ 'no-bottom-border': isWarning(i, element) }">
               <button mat-stroked-button color="accent" (click)="onStructureRemove(element.id)" type="button">
                 Remove
               </button>
@@ -162,7 +162,7 @@ <h2>Additional Proposal Information</h2>
           <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
 
           <ng-container matColumnDef="msgWarning">
-            <td colspan="7" mat-cell *matCellDef>
+            <td colspan="7" mat-cell *matCellDef class="no-top-border">
               <div class="residential-warning">
                 <div class="residential-warning-text">
                   The proposed residential structure and its total floor area must be allowed under the ALC Act and/or ALR Use Regulation. 

diff --git a/...e-of-intents/edit-submission/additional-information/additional-information.component.scss b/...e-of-intents/edit-submission/additional-information/additional-information.component.scss
@@ -36,3 +36,11 @@
   margin: rem(10) 0 rem(20) rem(5);
   line-height: rem(24);
 }
+
+.no-top-border {
+  border-top-style: hidden;
+}
+
+.no-bottom-border {
+  border-bottom-style: hidden;
+}