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 <[email protected]>

Author: FarahRasheed1

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">