3 Commits

Author SHA1 Message Date
4e98680eab Merge version_3 into main
Merge version_3 into main
2026-05-09 02:59:49 +00:00
e9191607ad Update src/app/chat/page.tsx 2026-05-09 02:59:45 +00:00
030b1e5c3f Merge version_2 into main
Merge version_2 into main
2026-05-09 02:58:09 +00:00

View File

@@ -4,7 +4,7 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { MessageSquare, Send, Bot, User } from "lucide-react"; import { Bot, User, Send } from "lucide-react";
import { useState } from "react"; import { useState } from "react";
export default function ChatPage() { export default function ChatPage() {
@@ -33,25 +33,26 @@ export default function ChatPage() {
<main className="min-h-screen pt-32 pb-20 flex flex-col items-center px-4 md:px-8"> <main className="min-h-screen pt-32 pb-20 flex flex-col items-center px-4 md:px-8">
<div className="max-w-4xl w-full flex flex-col gap-6"> <div className="max-w-4xl w-full flex flex-col gap-6">
<div className="bg-card/30 backdrop-blur-2xl border border-white/10 rounded-3xl p-8 shadow-2xl flex-grow overflow-y-auto min-h-[500px] flex flex-col gap-4"> <div className="relative overflow-hidden bg-white/5 backdrop-blur-3xl border border-white/20 rounded-3xl p-8 shadow-[0_8px_30px_rgb(0,0,0,0.12)] flex-grow min-h-[500px] flex flex-col gap-6">
<div className="absolute inset-0 bg-gradient-to-br from-white/10 to-transparent pointer-events-none" />
{messages.map((msg, i) => ( {messages.map((msg, i) => (
<div key={i} className={`flex gap-4 ${msg.role === 'user' ? 'flex-row-reverse' : ''}`}> <div key={i} className={`relative flex gap-4 ${msg.role === 'user' ? 'flex-row-reverse' : ''}`}>
<div className="w-10 h-10 rounded-full bg-accent/20 flex items-center justify-center"> <div className="w-10 h-10 rounded-full bg-white/10 backdrop-blur-md border border-white/20 flex items-center justify-center shrink-0">
{msg.role === 'bot' ? <Bot size={20} /> : <User size={20} />} {msg.role === 'bot' ? <Bot size={20} className="text-white" /> : <User size={20} className="text-white" />}
</div> </div>
<div className={`p-4 rounded-2xl ${msg.role === 'user' ? 'bg-primary-cta text-white' : 'bg-white/5 text-foreground'}`}> <div className={`p-4 px-6 rounded-2xl backdrop-blur-md border border-white/10 shadow-lg ${msg.role === 'user' ? 'bg-primary-cta text-white' : 'bg-black/20 text-white'}`}>
{msg.content} {msg.content}
</div> </div>
</div> </div>
))} ))}
</div> </div>
<div className="bg-card/30 backdrop-blur-2xl border border-white/10 rounded-full p-2 flex items-center gap-2"> <div className="bg-white/5 backdrop-blur-3xl border border-white/20 rounded-full p-2 flex items-center gap-2 shadow-xl">
<input <input
className="flex-grow bg-transparent px-6 py-3 outline-none text-foreground placeholder:text-foreground/50" className="flex-grow bg-transparent px-6 py-4 outline-none text-white placeholder:text-white/40"
placeholder="Type your message..." placeholder="Type your message..."
/> />
<button className="p-4 rounded-full bg-primary-cta text-white"> <button className="p-4 rounded-full bg-primary-cta text-white hover:opacity-90 transition-opacity">
<Send size={20} /> <Send size={20} />
</button> </button>
</div> </div>