KeyArgo
/
llama-gpt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

slight input ui tweak

This commit is contained in:
Mckay Wrigley 2023-03-18 22:27:50 -06:00
parent d0b4a355ca
commit 481c339d1c
2 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/Chat/Chat.tsx
View File

@ -8,7 +8,7 @@ import { ModelSelect } from "./ModelSelect";
interface Props { interface Props {
model: OpenAIModel; model: OpenAIModel;
messages: Message[]; messages: Message[];
messageIsStreaming: boolean, messageIsStreaming: boolean;
loading: boolean; loading: boolean;
lightMode: "light" | "dark"; lightMode: "light" | "dark";
onSend: (message: Message) => void; onSend: (message: Message) => void;
@ -57,8 +57,11 @@ export const Chat: FC<Props> = ({ model, messages, messageIsStreaming, loading,
)} )}
</div> </div>
<div className="h-[80px] sm:h-[140px] w-[340px] sm:w-[400px] md:w-[500px] lg:w-[700px] xl:w-[800px] mx-auto"> <div className="h-[100px] w-[340px] sm:w-[400px] md:w-[500px] lg:w-[700px] xl:w-[800px] mx-auto">
<ChatInput messageIsStreaming={messageIsStreaming} onSend={onSend} /> <ChatInput
messageIsStreaming={messageIsStreaming}
onSend={onSend}
/>
</div> </div>
</div> </div>
); );

4
components/Chat/ChatInput.tsx
View File

@ -52,15 +52,13 @@ export const ChatInput: FC<Props> = ({ onSend, messageIsStreaming }) => {
return ( return (
<div className="relative"> <div className="relative">
<div className="absolute bottom-[-70px] sm:bottom-[-120px] w-full"> <div className="absolute bottom-[-80px] w-full">
<textarea <textarea
ref={textareaRef} ref={textareaRef}
className="rounded-lg pl-4 pr-8 py-3 w-full focus:outline-none max-h-[280px] dark:bg-[#40414F] dark:border-opacity-50 dark:border-neutral-800 dark:text-neutral-100 border border-neutral-300 shadow text-neutral-900" className="rounded-lg pl-4 pr-8 py-3 w-full focus:outline-none max-h-[280px] dark:bg-[#40414F] dark:border-opacity-50 dark:border-neutral-800 dark:text-neutral-100 border border-neutral-300 shadow text-neutral-900"
style={{ style={{
resize: "none", resize: "none",
bottom: `${textareaRef?.current?.scrollHeight}px`, bottom: `${textareaRef?.current?.scrollHeight}px`,
height: "auto",
minHeight: "100px",
maxHeight: "400px", maxHeight: "400px",
overflow: "auto" overflow: "auto"
}} }}