ui: fullsize ai answered content

components/ai/Conversation.vue

@@ -161,16 +161,16 @@ const onDeleteConversation = (conversationId: string) => {
         >
           <div
             class="gradient-border"
-            :class="
+            :class="`${
               message.role === 'assistant'
-                && !currentConversation?.finished_at
-                && message.content
+              && !currentConversation?.finished_at
+              && message.content
                 ? ''
                 : 'inactive'
-            "
+            } ${message.role == 'user' ? 'w-fit' : 'w-full'}`"
           >
             <div
-              class="w-fit px-4 py-3 rounded-lg max-w-prose shadow bg-white dark:bg-gray-800 border"
+              class="w-full px-4 py-3 rounded-lg shadow bg-white dark:bg-gray-800 border"
               :class="[
                 message.role == 'user' ? 'rounded-br-none' : 'rounded-bl-none',
               ]"
@@ -191,13 +191,15 @@ const onDeleteConversation = (conversationId: string) => {
               </div>
             </div>
             <div
-              v-if="message.role === 'assistant' && currentConversation?.finished_at && message.content"
+              v-if="
+                message.role === 'assistant'
+                  && currentConversation?.finished_at
+                  && message.content
+              "
               class="pt-4 flex items-center gap-2"
             >
               <!-- download button -->
-              <Button
-                size="sm"
-              >
+              <Button size="sm">
                 <Icon name="tabler:plus" />
                 加入教案库
               </Button>