style

components/message-item/file-message.vue

 <template>
     <div class="msg-detail file-message d-flex" @dblclick="openFile">
-        <div class="file-message-info">
+        <div
+            class="file-message-info"
+            :class="{ 'd-flex align-items-center': !messageBody.msg.size }"
+        >
             <div
-                class="text-nowrap text-truncate file-message-name"
+                class="file-message-name"
                 :title="messageBody.msg.name"
+                :class="{ 'text-truncate': messageBody.msg.size }"
             >
                 {{ messageBody.msg.name }}
             </div>
-            <div class="text-hint">
+            <div class="text-hint" v-if="messageBody.msg.size">
                 {{ format(messageBody.msg.size) }}
             </div>
         </div>