feat: adjust quick settings position

app/page.tsx

@@ -3,13 +3,16 @@ import { Card } from "@/components/ui/card";
 import { Separator } from "@/components/ui/separator";
 import Header from "@/components/header";
 import Chat from "@/components/chat";
+import SettingsQuick from "@/components/settings/settings-quick";
 
 export default function Page() {
   return (
     <main className="h-full pt-[13px]">
       <Card className="mx-auto flex h-full w-[95%] max-w-5xl flex-col">
         <Header />
         <Separator />
+        <SettingsQuick />
+        <Separator />
         <Chat />
       </Card>
     </main>

components/chat-body.tsx

@@ -6,7 +6,6 @@ import Dividers from "@/components/dividers";
 import { emitter, mittKey } from "@/lib/mitt";
 import { ScrollArea } from "@/components/ui/scroll-area";
 import { Loader } from "lucide-react";
-import SettingsQuick from "@/components/settings/settings-quick";
 
 function ChatBody({
   isLoading,
@@ -84,7 +83,6 @@ function ChatBody({
       viewportClass="p-2 sm:p-4"
       onScroll={(e) => onScroll(e.currentTarget)}
     >
-      <SettingsQuick />
       {messages.map((value, index) => {
         return (
           <div key={value.id}>

components/header.tsx

@@ -9,7 +9,7 @@ import { Separator } from "@/components/ui/separator";
 
 function Header() {
   return (
-    <header className="flex h-12 items-center gap-1 px-4">
+    <header className="flex h-12 items-center gap-1 pl-4 pr-2">
       <HeaderTopic />
       <ChatList
         trigger={

components/settings/settings-quick.tsx

@@ -1,25 +1,16 @@
+"use client";
 import React from "react";
-import { Card } from "@/components/ui/card";
 import SettingsModel from "@/components/settings/settings-model";
-import { Separator } from "@/components/ui/separator";
 import SettingsTemperature from "@/components/settings/settings-temperature";
 import SettingsGoogle from "@/components/settings/settings-google";
-import { Settings2 } from "lucide-react";
 
 function SettingsQuick() {
   return (
-    <Card className="mb-3 flex flex-col gap-4 p-4">
-      <div className="flex items-center gap-1">
-        <Settings2 size={20} strokeWidth={1.8} />
-        <h3 className="font-medium">快捷设置</h3>
-      </div>
-      <Separator />
-      <div className="flex flex-col gap-4 md:flex-row md:justify-between">
-        <SettingsModel className="md:max-w-xs md:flex-1" />
-        <SettingsTemperature className="md:max-w-xs md:flex-1" />
-        <SettingsGoogle className="md:w-[180px]" />
-      </div>
-    </Card>
+    <div className="flex flex-col gap-1 px-4 pb-1 pt-2 md:flex-row md:justify-between md:gap-4 md:py-3">
+      <SettingsModel className="md:max-w-xs md:flex-1" />
+      <SettingsTemperature className="md:max-w-xs md:flex-1" />
+      <SettingsGoogle className="md:w-[180px]" />
+    </div>
   );
 }
 

package.json

@@ -29,7 +29,7 @@
     "mitt": "^3.0.1",
     "next": "^15.0.3",
     "next-themes": "^0.3.0",
-    "openai": "^4.72.0",
+    "openai": "^4.73.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-markdown": "8.0.7",