From 8cd2cdb3fe7949bbabe91a6d6597f7d033533ad9 Mon Sep 17 00:00:00 2001
From: celine <celine@hyperlink.academy>
Date: Wed, 10 Dec 2025 01:58:17 -0500
Subject: [PATCH] fixes to canvas metadata popover

---
 app/[leaflet_id]/actions/PublishButton.tsx             |  1 -
 app/lish/[did]/[publication]/[rkey]/CanvasPage.tsx     | 10 ++++++----
 .../[publication]/[rkey]/PostHeader/PostHeader.tsx     |  4 ++--
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/app/[leaflet_id]/actions/PublishButton.tsx b/app/[leaflet_id]/actions/PublishButton.tsx
index 4098d1ff..43d5dd54 100644
--- a/app/[leaflet_id]/actions/PublishButton.tsx
+++ b/app/[leaflet_id]/actions/PublishButton.tsx
@@ -108,7 +108,6 @@ const PublishToPublicationButton = (props: { entityID: string }) => {
   let { identity } = useIdentityData();
   let { permission_token } = useReplicache();
   let query = useSearchParams();
-  console.log(query.get("publish"));
   let [open, setOpen] = useState(query.get("publish") !== null);
 
   let isMobile = useIsMobile();
diff --git a/app/lish/[did]/[publication]/[rkey]/CanvasPage.tsx b/app/lish/[did]/[publication]/[rkey]/CanvasPage.tsx
index 9d45e6b6..ef32af60 100644
--- a/app/lish/[did]/[publication]/[rkey]/CanvasPage.tsx
+++ b/app/lish/[did]/[publication]/[rkey]/CanvasPage.tsx
@@ -22,6 +22,7 @@ import { PostHeader } from "./PostHeader/PostHeader";
 import { useDrawerOpen } from "./Interactions/InteractionDrawer";
 import { PollData } from "./fetchPollData";
 import { SharedPageProps } from "./PostPages";
+import { useIsMobile } from "src/hooks/isMobile";
 
 export function CanvasPage({
   blocks,
@@ -206,8 +207,9 @@ const CanvasMetadata = (props: {
   quotesCount: number | undefined;
   commentsCount: number | undefined;
 }) => {
+  let isMobile = useIsMobile();
   return (
-    <div className="flex flex-row gap-3 items-center absolute top-6 right-3 sm:top-4 sm:right-4 bg-bg-page border-border-light rounded-md px-2 py-1 h-fit z-20">
+    <div className="flex flex-row gap-3 items-center absolute top-3 right-3 sm:top-4 sm:right-4 bg-bg-page border-border-light rounded-md px-2 py-1 h-fit z-20">
       <Interactions
         quotesCount={props.quotesCount || 0}
         commentsCount={props.commentsCount || 0}
@@ -219,9 +221,9 @@ const CanvasMetadata = (props: {
         <>
           <Separator classname="h-5" />
           <Popover
-            side="left"
-            align="start"
-            className="flex flex-col gap-2 p-0! max-w-sm w-[1000px]"
+            side="bottom"
+            align="end"
+            className={`flex flex-col gap-2 p-0! text-primary ${isMobile ? "w-full" : "max-w-sm w-[1000px] t"}`}
             trigger={<InfoSmall />}
           >
             <PostHeader
diff --git a/app/lish/[did]/[publication]/[rkey]/PostHeader/PostHeader.tsx b/app/lish/[did]/[publication]/[rkey]/PostHeader/PostHeader.tsx
index 1ad7ed76..fbc5a153 100644
--- a/app/lish/[did]/[publication]/[rkey]/PostHeader/PostHeader.tsx
+++ b/app/lish/[did]/[publication]/[rkey]/PostHeader/PostHeader.tsx
@@ -66,9 +66,9 @@ export function PostHeader(props: {
               </a>
             )}
         </div>
-        <h2 className="">{record.title}</h2>
+        <h2 className="leading-tight">{record.title}</h2>
         {record.description ? (
-          <p className="italic text-secondary">{record.description}</p>
+          <p className="italic text-secondary pt-1">{record.description}</p>
         ) : null}
 
         <div className="text-sm text-tertiary pt-3 flex gap-1 flex-wrap">
-- 
2.51.2