Skip to content

Commit 3092013

Browse files
authored
Merge pull request #15 from vietnamesekid/main
Refactor layout and scrolling for chat and welcome screens
2 parents c4969e4 + 8304e3f commit 3092013

File tree

3 files changed

+5
-11
lines changed

3 files changed

+5
-11
lines changed

frontend/src/App.tsx

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -151,12 +151,7 @@ export default function App() {
151151

152152
return (
153153
<div className="flex h-screen bg-neutral-800 text-neutral-100 font-sans antialiased">
154-
<main className="flex-1 flex flex-col overflow-hidden max-w-4xl mx-auto w-full">
155-
<div
156-
className={`flex-1 overflow-y-auto ${
157-
thread.messages.length === 0 ? "flex" : ""
158-
}`}
159-
>
154+
<main className="h-full w-full max-w-4xl mx-auto">
160155
{thread.messages.length === 0 ? (
161156
<WelcomeScreen
162157
handleSubmit={handleSubmit}
@@ -188,7 +183,6 @@ export default function App() {
188183
historicalActivities={historicalActivities}
189184
/>
190185
)}
191-
</div>
192186
</main>
193187
</div>
194188
);

frontend/src/components/ChatMessagesView.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -253,9 +253,9 @@ export function ChatMessagesView({
253253
}
254254
};
255255
return (
256-
<div className="flex flex-col h-full overflow-hidden">
257-
<ScrollArea className="flex-1 min-h-0" ref={scrollAreaRef}>
258-
<div className="p-4 md:p-6 pb-2 space-y-2 max-w-4xl mx-auto">
256+
<div className="flex flex-col h-full">
257+
<ScrollArea className="flex-1 overflow-y-auto" ref={scrollAreaRef}>
258+
<div className="p-4 md:p-6 space-y-2 max-w-4xl mx-auto pt-16">
259259
{messages.map((message, index) => {
260260
const isLast = index === messages.length - 1;
261261
return (

frontend/src/components/WelcomeScreen.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ export const WelcomeScreen: React.FC<WelcomeScreenProps> = ({
1515
onCancel,
1616
isLoading,
1717
}) => (
18-
<div className="flex flex-col items-center justify-center text-center px-4 flex-1 w-full max-w-3xl mx-auto gap-4">
18+
<div className="h-full flex flex-col items-center justify-center text-center px-4 flex-1 w-full max-w-3xl mx-auto gap-4">
1919
<div>
2020
<h1 className="text-5xl md:text-6xl font-semibold text-neutral-100 mb-3">
2121
Welcome.

0 commit comments

Comments
 (0)