Add class to center error text in error flex boxes

ScottLogic · Jul 29, 2024 · 0b5b789 · 0b5b789
1 parent 5e8eff4
commit 0b5b789
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/src/app/carbon-estimator-form/carbon-estimator-form.component.html b/src/app/carbon-estimator-form/carbon-estimator-form.component.html
@@ -85,7 +85,7 @@
           required
           [attr.aria-describedby]="(numberOfServers | invalidated) ? 'numberOfServersError' : null" />
         @if (numberOfServers | invalidated) {
-          <div class="tce-error-box tce-flex tce-gap-1" aria-live="polite" id="numberOfServersError">
+          <div class="tce-error-box tce-flex tce-items-center tce-gap-1" aria-live="polite" id="numberOfServersError">
             <span class="material-icons-outlined">error</span>
             <p>{{ errorConfig.numberOfServers.errorMessage }}</p>
           </div>
@@ -214,7 +214,10 @@
             required
             [attr.aria-describedby]="(monthlyActiveUsers | invalidated) ? 'monthlyActiveUsersError' : null" />
           @if (monthlyActiveUsers | invalidated) {
-            <div class="tce-error-box tce-flex tce-gap-1" aria-live="polite" id="monthlyActiveUsersError">
+            <div
+              class="tce-error-box tce-flex tce-items-center tce-gap-1"
+              aria-live="polite"
+              id="monthlyActiveUsersError">
               <span class="material-icons-outlined">error</span>
               <p>{{ errorConfig.monthlyActiveUsers.errorMessage }}</p>
             </div>