feat: card style and input keyup

liou666 · Apr 3, 2023 · f77d3b1 · f77d3b1
1 parent c9da946
commit f77d3b1
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 5 deletions.
diff --git a/src/components/Content.vue b/src/components/Content.vue
@@ -47,6 +47,7 @@ const onSubmit = async () => {
     const res = await generateText(store.currentChatMessages, key!, getOpenProxy())
     if (res.error) {
       alert(res.error?.message)
+      store.changeConversations(store.currentChatMessages.slice(-1))
       return store.changeLoading(false)
     }
     const content = res.choices[0].message.content
@@ -60,6 +61,7 @@ const onSubmit = async () => {
     store.changeLoading(false)
   }
   catch (error) {
+    store.changeConversations(store.currentChatMessages.slice(-1))
     store.changeLoading(false)
   }
 }
@@ -93,7 +95,7 @@ const translate = (text: string) => {
 </script>
 
 <template>
-  <div flex flex-col p-2 rounded-md bg-white dark="bg-#1e1e1e">
+  <div flex flex-col p-2 rounded-md bg-white dark="bg-#1e1e1e" shadow-sm>
     <div ref="el" class="hide-scrollbar flex-1 overflow-auto">
       <template v-if="chatMessages.length">
         <div
@@ -146,7 +148,7 @@ const translate = (text: string) => {
         v-else-if="!store.loading"
         v-model="message"
         type="text"
-        text-p
+        @keyup.enter="onSubmit"
         placeholder="Type your message here..."
         input-box p-3 flex-1
       >

diff --git a/src/components/Nav.vue b/src/components/Nav.vue
@@ -19,7 +19,7 @@ const handleCardClick = (key: Key) => {
 </script>
 
 <template>
-  <nav class="rounded-md bg-#fff dark:bg-#1d262a h-[calc(100vh-78px)]">
+  <nav class="rounded-md bg-#fff dark:bg-#1d262a h-[calc(100vh-78px)] shadow-sm">
     <div h-full flex flex-col p-1>
       <div class="hide-scrollbar overflow-y-auto flex-1 ">
         <Card

diff --git a/src/components/widgets/Card.vue b/src/components/widgets/Card.vue
@@ -12,8 +12,8 @@ const { name, desc, active, avaterUrl } = defineProps<{
     p-2 cursor-pointer center-y
     m-2 rounded duration-300 shadow-sm
     dark="bg-gray-700/80 hover:bg-gray-500/80"
-    bg="gray-400/10 hover:gray-500/20"
-    :class="{ 'bg-gray-500/20! dark:bg-gray-500/80! shadow-lg': active }"
+    bg="gray-400/20 hover:gray-500/20"
+    :class="{ 'bg-gradient-to-r from-purple-400 via-pink-500 to-pink-500 dark:bg-gray-500/80! shadow-lg': active }"
   >
     <div mr-2>
       <div w-10 h-10>

diff --git a/unocss.config.ts b/unocss.config.ts
@@ -23,6 +23,9 @@ export default defineConfig({
     ['input-box', 'bg-slate-300/50 dark:text-slate-400 dark:placeholder:text-slate-400 dark:placeholder:opacity-30 dark:bg-slate-500/40 border-0 text-lg outline-none rounded px-3;'],
     ['chat-box', ' bg-slate/30 dark:bg-slate-500/40 dark:text-slate-200 rounded'],
     ['nav-item', 'flex h-6 cursor-pointer items-center gap-3 rounded-md py-2 px-3  transition-colors duration-200 hover:bg-gray-500/10'],
+    ['base-shadow', 'shadow-pink/10 shadow'],
+
+
   ],
   presets: [
     presetUno(),