feat: add border on highlighted message box

ai-shifu · May 14, 2023 · 7ead511 · 7ead511
1 parent 26ec0ba
commit 7ead511
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/components/Messages/ChatMessage.vue b/src/components/Messages/ChatMessage.vue
@@ -1,6 +1,10 @@
 <template>
   <v-card
-    :class="['message', message.type]"
+    :class="[
+      'message',
+      message.type,
+      message.highlight ? 'highlight-border' : '',
+    ]"
     :loading="message.done ? false : 'primary'"
   >
     <v-card-title v-if="message.type === 'response'" class="title">
@@ -109,6 +113,10 @@ export default {
     text-align: left;
 }
 
+.highlight-border {
+    box-shadow: 0 0 0 2px rgba(var(--v-theme-primary), 1);
+}
+
 .prompt {
     background-color: #95EC69;
     width: fit-content;