diff --git a/src/components/styled/views/Home.styled.jsx b/src/components/styled/views/Home.styled.jsx index 6903f681..92d81fc1 100644 --- a/src/components/styled/views/Home.styled.jsx +++ b/src/components/styled/views/Home.styled.jsx @@ -277,18 +277,19 @@ export const BoardsContent = styled.div` } .board-avatar-container { - width: 150px; - height: 150px; + width: auto; + height: auto; border: 1px solid #800; display: inline-block; overflow: hidden; position: relative; + line-height: 0; } - .board-avatar-container img.board-avatar { - width: 100%; - height: 100%; - object-fit: cover; + img, + video { + max-width: 150px; + max-height: 150px; } .offline-indicator { diff --git a/src/components/views/Home.jsx b/src/components/views/Home.jsx index 06096473..6d67bce7 100644 --- a/src/components/views/Home.jsx +++ b/src/components/views/Home.jsx @@ -18,6 +18,7 @@ const RecentThread = ({ commentCid }) => { const subplebbit = useSubplebbit({ subplebbitAddress: comment?.subplebbitAddress }); const { setSelectedAddress, setSelectedTitle } = useGeneralStore((state) => state); const commentMediaInfo = getCommentMediaInfo(comment); + const fallbackImgUrl = 'assets/filedeleted-res.gif'; const isMediaShowed = comment.link && commentMediaInfo && @@ -30,7 +31,7 @@ const RecentThread = ({ commentCid }) => { return ( <> - {isMediaShowed ? ( + {isMediaShowed && comment.replyCount > 0 ? (