feat: truncate action bar button labels on mobile portrait

1 files changed, 2 insertions, 2 deletions

diff --git a/apps/web/app/reader/_components/entry-detail-panel.tsx b/apps/web/app/reader/_components/entry-detail-panel.tsx
index fa74d6f..6982083 100644
--- a/apps/web/app/reader/_components/entry-detail-panel.tsx
+++ b/apps/web/app/reader/_components/entry-detail-panel.tsx
@@ -455,7 +455,7 @@ export function EntryDetailPanel({
         }
         className="shrink-0 whitespace-nowrap border border-border px-2 py-1 text-text-secondary transition-colors hover:bg-background-tertiary hover:text-text-primary"
       >
-        {isRead ? "mark unread" : "mark read"}
+        {isRead ? <><span className="sm:hidden">unread</span><span className="hidden sm:inline">mark unread</span></> : <><span className="sm:hidden">read</span><span className="hidden sm:inline">mark read</span></>}
       </button>
       <button
         type="button"
@@ -476,7 +476,7 @@ export function EntryDetailPanel({
           rel="noopener noreferrer"
           className="shrink-0 whitespace-nowrap border border-border px-2 py-1 text-text-secondary transition-colors hover:bg-background-tertiary hover:text-text-primary"
         >
-          open original
+          <span className="sm:hidden">original</span><span className="hidden sm:inline">open original</span>
         </a>
       )}
       {shareData?.isShared ? (