From fbd92a9bcfa1f40f31b676c234429bf85e8abdd2 Mon Sep 17 00:00:00 2001
From: celine <celine@hyperlink.academy>
Date: Mon, 1 Jun 2026 13:11:56 -0400
Subject: [PATCH] update cover images in medium size standard site post block
 to be smaller

---
 .../[publication]/PublicationPostItem.tsx     | 65 ++++++++++---------
 1 file changed, 36 insertions(+), 29 deletions(-)

diff --git a/app/(app)/lish/[did]/[publication]/PublicationPostItem.tsx b/app/(app)/lish/[did]/[publication]/PublicationPostItem.tsx
index 854c3bec..9b58a93f 100644
--- a/app/(app)/lish/[did]/[publication]/PublicationPostItem.tsx
+++ b/app/(app)/lish/[did]/[publication]/PublicationPostItem.tsx
@@ -37,7 +37,7 @@ function MetaRow({
   const hasDate = date !== undefined && date !== null;
   return (
     <div
-      className={`justify-between w-full ${textClassName} text-tertiary flex gap-1 flex-wrap items-center`}
+      className={`sm:justify-between place-items-start! sm:place-items-center! w-full ${textClassName} text-tertiary flex sm:flex-row flex-col gap-1 flex-wrap items-center`}
     >
       <p
         className={`${textClassName} text-tertiary flex gap-1 items-center flex-wrap`}
@@ -102,36 +102,43 @@ export function PublicationPostItemMedium(props: MediumProps) {
   const hasCoverImage = !!props.coverImageSrc;
 
   return (
-    <div className="flex w-full items-stretch ">
-      <div className="flex w-full grow flex-col justify-between min-w-0  pl-3 pr-3 py-2">
-        <PostLink href={props.href}>
-          {props.title && (
-            <h3 className="text-primary leading-snug line-clamp-2 pb-1">
-              {props.title}
-            </h3>
-          )}
-          <p className="text-secondary line-clamp-3 grow mb-2">
-            {props.description}
-          </p>
-        </PostLink>
-        <MetaRow
-          author={props.author}
-          date={props.date}
-          interactions={props.interactions}
-          textClassName="text-sm place-self-end"
-        />
-        <div className="shrink-0">{props.footer}</div>
-      </div>
-      {hasCoverImage && (
-        <div
-          className={`self-start shrink-0 w-16  border-l border-border-light ${props.footer ? " w-[182px] h-[182px]" : "sm:h-36 sm:w-36"}`}
-        >
-          <img
-            src={props.coverImageSrc}
-            alt={props.coverImageAlt || props.title || ""}
-            className="w-full h-full aspect-square object-cover rounded"
+    <div className="flex w-full flex-col">
+      <div className="flex w-full items-stretch ">
+        <div className="flex w-full grow flex-col justify-between min-w-0  pl-3 pr-3 py-2">
+          <PostLink href={props.href}>
+            {props.title && (
+              <h3 className="text-primary leading-snug line-clamp-2 pb-1">
+                {props.title}
+              </h3>
+            )}
+            <p className="text-secondary line-clamp-3 grow mb-2">
+              {props.description}
+            </p>
+          </PostLink>
+          <MetaRow
+            author={props.author}
+            date={props.date}
+            interactions={props.interactions}
+            textClassName="text-sm place-self-end"
           />
+          {props.footer && (
+            <div className="shrink-0 hidden sm:block">{props.footer}</div>
+          )}
         </div>
+        {hasCoverImage && (
+          <div
+            className={`self-start shrink-0 w-24 h-24 rounded-md mt-2 mr-2 border-l sm:border-border-light border-transparent ${props.footer ? "sm:w-[182px] sm:h-[182px] sm:rounded-none sm:m-0" : "sm:h-36 sm:w-36 sm:rounded-none sm:m-0"}`}
+          >
+            <img
+              src={props.coverImageSrc}
+              alt={props.coverImageAlt || props.title || ""}
+              className="w-full h-full aspect-square object-cover sm:rounded-[0px] rounded-md"
+            />
+          </div>
+        )}
+      </div>
+      {props.footer && (
+        <div className="shrink-0 sm:hidden px-3 pb-2">{props.footer}</div>
       )}
     </div>
   );
-- 
2.51.2