Ensure app task and status info does not overflow the header toolbar

dashboard/src/views/AppConfigureView.vue

@@ -214,7 +214,7 @@ onBeforeUnmount(() => {
 
     <div class="configure-inner" v-if="!busy">
       <div class="titlebar">
-        <div style="display: flex; flex-grow: 1;">
+        <div style="display: flex; flex-grow: 1; overflow: hidden;">
           <img :src="app.iconUrl" v-fallback-image="API_ORIGIN + '/img/appicon_fallback.png'" style="height: 64px; width: 64px; margin-right: 10px;"/>
           <h2>
             <a class="applink" :href="link || null" target="_blank">{{ app.label || app.fqdn }}</a>
@@ -290,12 +290,12 @@ onBeforeUnmount(() => {
 
 .titlebar {
   display: flex;
-  flex-wrap: wrap;
   gap: 10px;
   justify-content: space-between;
 }
 
 .titlebar h2 {
+  overflow: hidden;
   flex-grow: 1;
   padding: 0;
   margin: 0;
@@ -320,6 +320,9 @@ onBeforeUnmount(() => {
 .statelabel {
   font-size: 12px;
   margin-top: 6px;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  text-wrap: nowrap;
 }
 
 .applink:not([href]) {