fixed chat drawer mobile formatting

This commit is contained in:
Carter 2026-02-25 12:01:21 -06:00
parent c33ce3d03a
commit 5c1434a2e7
4 changed files with 15 additions and 10 deletions

View file

@ -92,13 +92,15 @@ export default function Chat(props: Props) {
</Box> </Box>
) : ( ) : (
<Box className={classes.chatContainer}> <Box className={classes.chatContainer}>
<Box sx={{ flex: 1, overflowY: "hidden", minHeight: 0 }}>
<ChatOutput <ChatOutput
totalMessages={totalMessages} totalMessages={totalMessages}
messages={chats} messages={chats}
removeNoteMethod={removeNote} removeNoteMethod={removeNote}
loadMore={loadMore} loadMore={loadMore}
/> />
<Box style={{bottom: 0}}> </Box>
<Box style={{ flexShrink: 0 }}>
<Divider /> <Divider />
<ChatInput newNoteMethod={showNewNotes} objectKey={objectKey} type={type} /> <ChatInput newNoteMethod={showNewNotes} objectKey={objectKey} type={type} />
</Box> </Box>

View file

@ -23,8 +23,10 @@ const useStyles = makeStyles<Theme>((theme: Theme) => ({
}, },
chatDrawerMobile: { chatDrawerMobile: {
backgroundColor: theme.palette.background.default, backgroundColor: theme.palette.background.default,
height: "auto", height: "100vh",
width: "100%", width: "100%",
display: "flex", // add this
flexDirection: "column", // add this
}, },
drawerHeader: { drawerHeader: {
display: "flex", display: "flex",

View file

@ -72,6 +72,7 @@ export default function ChatOutput(props: Props) {
<Box ref={containerRef} onScroll={onScroll} style={{ <Box ref={containerRef} onScroll={onScroll} style={{
overflowY: "scroll", overflowY: "scroll",
overflowX: "hidden", overflowX: "hidden",
height: "100%",
}}> }}>
{props.messages.length < props.totalMessages && ( {props.messages.length < props.totalMessages && (
<ListItemButton onClick={seeMore} sx={{ justifyContent: "center"}}> <ListItemButton onClick={seeMore} sx={{ justifyContent: "center"}}>

View file

@ -223,7 +223,7 @@ export default function TeamPage() {
const isStreamline = IsStreamline() const isStreamline = IsStreamline()
return ( return (
<PageContainer spacing={isMobile ? 0 : 2}> <PageContainer spacing={isMobile ? 1 : 2}>
<Box className={classes.container}> <Box className={classes.container}>
<Box className={classes.leftBox}> <Box className={classes.leftBox}>
{title()} {title()}