Ensure the restore progress message does not overflow the screen

dashboard/src/views/RestoreView.vue

@@ -349,7 +349,7 @@ onMounted(async () => {
         <div style="display: flex; flex-direction: column; height: 100%; align-items: center;">
           <Whirlpool/>
           <h1>Please wait while Cloudron is restoring <AnimatedDots/></h1>
-          <h4 style="margin-top: 0">{{ progressMessage }}</h4>
+          <h4 class="progress-message">{{ progressMessage }}</h4>
           <small>You can follow the logs on the server at <code @click="onCopyToClipboard('/home/yellowtent/platformdata/logs/box.log')">/home/yellowtent/platformdata/logs/box.log</code></small>
           <p v-show="taskMinutesActive >= 4">If restore appears stuck, it can be restarted by running <code @click="onCopyToClipboard('systemctl restart box')">systemctl restart box</code> and reloading this page.</p>
         </div>
@@ -477,4 +477,11 @@ onMounted(async () => {
   margin-top: 20px;
 }
 
+.progress-message {
+  margin-top: 0;
+  max-width: 90vw;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 </style>