From f84d63dd0e1b10afa9f063feeaf2e92ba5c86254 Mon Sep 17 00:00:00 2001
From: Pearl Dsilva <pearl1594@gmail.com>
Date: Mon, 14 Mar 2022 22:25:02 +0530
Subject: [PATCH] UI: Fix alignement of message (#6109)

---
 ui/public/locales/en.json               |  2 +-
 ui/src/views/network/EgressRulesTab.vue | 10 +++++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/ui/public/locales/en.json b/ui/public/locales/en.json
index a25ae922368..789f40210ca 100644
--- a/ui/public/locales/en.json
+++ b/ui/public/locales/en.json
@@ -2887,7 +2887,7 @@
 "message.edit.traffic.type": "Please specify the traffic label you want associated with this traffic type.",
 "message.egress.rules.allow": "Allow (traffic matching the egress rules added will be denied)",
 "message.egress.rules.deny": "Deny (traffic matching the egress rules added will be allowed)",
-"message.egress.rules.info.for.network": "The default egress policy of this network is %x. <br><br> Outgoing traffic matching the following rules will be %y",
+"message.egress.rules.info.for.network": "The default egress policy of this network is %x. <br> Outgoing traffic matching the following rules will be %y",
 "message.enable.account": "Please confirm that you want to enable this account.",
 "message.enable.netsacler.provider.failed": "failed to enable Netscaler provider",
 "message.enable.securitygroup.provider.failed": "failed to enable security group provider",
diff --git a/ui/src/views/network/EgressRulesTab.vue b/ui/src/views/network/EgressRulesTab.vue
index 180e9c5a41c..dcd80548567 100644
--- a/ui/src/views/network/EgressRulesTab.vue
+++ b/ui/src/views/network/EgressRulesTab.vue
@@ -19,9 +19,13 @@
   <div>
     <div>
       <a-alert
-        type="info"
-        v-html="$t('message.egress.rules.info.for.network').replace('%x', resource.egressdefaultpolicy ? '<b>' + $t('label.allow') + '</b>' :
-          '<b>' + $t('label.deny') + '</b>').replace('%y', resource.egressdefaultpolicy ? '<b>' + $t('message.denied') + '</b>' : '<b>' + $t('message.allowed') + '</b>')" />
+        type="info">
+        <template #message>
+        <div
+          v-html="$t('message.egress.rules.info.for.network').replace('%x', resource.egressdefaultpolicy ? '<b>' + $t('label.allow') + '</b>' :
+          '<b>' + $t('label.deny') + '</b>').replace('%y', resource.egressdefaultpolicy ? '<b>' + $t('message.denied') + '</b>' : '<b>' + $t('message.allowed') + '</b>.')" />
+        </template>
+      </a-alert>
       <a-divider />
       <div class="form" v-ctrl-enter="addRule">
         <div class="form__item">