From 9ce164245f51b834997f31f3f12497ee87474965 Mon Sep 17 00:00:00 2001 From: Jay Sitter <jsit@users.noreply.github.com> Date: Wed, 5 Jul 2023 15:31:08 -0400 Subject: [PATCH] fix: Fix mobile thumbnail being too small (#1814) Co-authored-by: SleeplessOne1917 <abias1122@gmail.com> --- src/assets/css/main.css | 5 +++++ src/shared/components/post/post-listing.tsx | 4 ++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/assets/css/main.css b/src/assets/css/main.css index b92f086..36566b9 100644 --- a/src/assets/css/main.css +++ b/src/assets/css/main.css @@ -204,6 +204,11 @@ blockquote { height: 5rem; } +.mobile-thumbnail-container .thumbnail { + width: 100%; + height: auto; +} + .thumbnail svg { height: 1.25rem; width: 1.25rem; diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index d9b3ad2..eb4dc8d 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -1327,10 +1327,10 @@ export class PostListing extends Component<PostListingProps, PostListingState> { const post = this.postView.post; return post.thumbnail_url || (post.url && isImage(post.url)) ? ( <div className="row"> - <div className={`${this.state.imageExpanded ? "col-12" : "col-8"}`}> + <div className={`${this.state.imageExpanded ? "col-12" : "col-9"}`}> {this.postTitleLine()} </div> - <div className="col-4"> + <div className="col-3 mobile-thumbnail-container"> {/* Post thumbnail */} {!this.state.imageExpanded && this.thumbnail()} </div> -- 2.44.1