From b8a2e704bdf67a55986302f3d4ada1e707b2bb52 Mon Sep 17 00:00:00 2001
From: Farah Rasheed <Farah.Rasheed1@dell.com>
Date: Fri, 5 Jul 2024 10:30:31 -0500
Subject: Update network hostname display style

Add 'word-break: break-all' CSS property to ensure long
hostnames wrap properly within their container. This
prevents overflow issues that occur with long hostnames
without spaces. Fixes #111

The change improves the readability and layout
consistency of the network information display in the
NetworkGlobalSettings view.

Change-Id: I142d18b9507f6ae0a90778e5a338b015507c9d79
Signed-off-by: Farah Rasheed <Farah.Rasheed1@dell.com>
---
 src/views/Settings/Network/NetworkGlobalSettings.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/views/Settings/Network/NetworkGlobalSettings.vue b/src/views/Settings/Network/NetworkGlobalSettings.vue
index db834047d..0c062ea2e 100644
--- a/src/views/Settings/Network/NetworkGlobalSettings.vue
+++ b/src/views/Settings/Network/NetworkGlobalSettings.vue
@@ -12,7 +12,9 @@
               <icon-edit :title="$t('pageNetwork.modal.editHostnameTitle')" />
             </b-button>
           </dt>
-          <dd>{{ dataFormatter(firstInterface.hostname) }}</dd>
+          <dd style="word-break: break-all">
+            {{ dataFormatter(firstInterface.hostname) }}
+          </dd>
         </dl>
       </b-col>
       <b-col md="2">
-- 
cgit v1.2.3