alex/simple-chat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: tiny layout inconsistency on mobile

Browse source
This commit is contained in:
Alexander Daichendt 2025-02-13 15:28:18 +01:00
parent 8bb3c09e70
commit 918924874b
2 changed files with 2 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/src/components/Layout.tsx
View file

@ -5,7 +5,7 @@ interface LayoutProps {
function Layout({ children }: LayoutProps) { function Layout({ children }: LayoutProps) {
return ( return (
<> <>
<main className="min-h-screen p-1 sm:p-4"> <main className="min-h-screen p-1 py-4 sm:p-4">
<header className="top-0 w-full bg-white" role="banner"> <header className="top-0 w-full bg-white" role="banner">
<h1 className="text-3xl text-center mb-3">Simple Chat</h1> <h1 className="text-3xl text-center mb-3">Simple Chat</h1>
</header> </header>

1
client/src/components/MessageDisplay.tsx
View file

@ -92,6 +92,7 @@ function MessageDisplay({ sendMessage }: MessageDisplayProps) {
width={width} width={width}
itemCount={state.messages.length} itemCount={state.messages.length}
itemSize={90} // sadly, this will make the system messages really tall. apparently its non trivial to fix that itemSize={90} // sadly, this will make the system messages really tall. apparently its non trivial to fix that
overscanCount={5}
> >
{Row} {Row}
</List> </List>