moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ChatPage: fix height on mobile (where ThumbNavigation is present)

This commit is contained in:
Alex Gleason 2022-09-22 17:38:00 -05:00
parent 3c9ffd30b1
commit c8adde735f
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/soapbox/features/chats/components/chat-page/chat-page.tsx
View File

@ -21,7 +21,10 @@ const ChatPage = () => {
const { top } = containerRef.current.getBoundingClientRect(); const { top } = containerRef.current.getBoundingClientRect();
const fullHeight = document.body.offsetHeight; const fullHeight = document.body.offsetHeight;
setHeight(fullHeight - top); // On mobile, account for bottom navigation.
const offset = document.body.clientWidth < 976 ? -61 : 0;
setHeight(fullHeight - top + offset);
}; };
useEffect(() => { useEffect(() => {

2
app/soapbox/pages/chats-page.tsx
View File

@ -3,7 +3,7 @@ import React from 'react';
/** Custom layout for chats on desktop. */ /** Custom layout for chats on desktop. */
const ChatsPage: React.FC = ({ children }) => { const ChatsPage: React.FC = ({ children }) => {
return ( return (
<div className='md:col-span-12 lg:col-span-9 pb-16 sm:pb-0'> <div className='md:col-span-12 lg:col-span-9'>
{children} {children}
</div> </div>
); );