fix: correct print layout URL and separate preview from download

- Fixed print-layout API to return correct URL format (?print=true instead of /print)
- Modified print endpoint to only force download when &download=true is added
- Updated create page and share page to use download parameter for download button
- Print preview now renders properly as an image

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

web/app/api/print-layout/route.ts

@@ -45,7 +45,7 @@ export async function POST(request: NextRequest) {
 
     return NextResponse.json({
       success: true,
-      printLayoutUrl: `/api/zine/${zineId}/print`,
+      printLayoutUrl: `/api/zine/${zineId}?print=true`,
       filename: `${zineName || "mycrozine"}_print.png`,
     });
   } catch (error) {

web/app/api/zine/[id]/route.ts

@@ -62,13 +62,19 @@ export async function GET(request: NextRequest, context: RouteContext) {
       }
 
       const printBuffer = await readFileAsBuffer(printPath);
-      return new NextResponse(new Uint8Array(printBuffer), {
-        headers: {
-          "Content-Type": "image/png",
-          "Content-Disposition": `attachment; filename="${id}_print.png"`,
-          "Cache-Control": "public, max-age=31536000, immutable",
-        },
-      });
+      const downloadParam = url.searchParams.get("download");
+
+      const headers: Record<string, string> = {
+        "Content-Type": "image/png",
+        "Cache-Control": "public, max-age=31536000, immutable",
+      };
+
+      // Only add Content-Disposition for explicit downloads
+      if (downloadParam === "true") {
+        headers["Content-Disposition"] = `attachment; filename="${id}_print.png"`;
+      }
+
+      return new NextResponse(new Uint8Array(printBuffer), { headers });
     }
 
     // Return zine metadata

web/app/create/page.tsx

@@ -621,7 +621,7 @@ export default function CreatePage() {
             {/* Actions */}
             <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
               <a
-                href={state.printLayoutUrl || "#"}
+                href={state.printLayoutUrl ? `${state.printLayoutUrl}&download=true` : "#"}
                 download={`${state.topic.slice(0, 20).replace(/[^a-zA-Z0-9]/g, "_")}_print.png`}
                 className="punk-border bg-black text-white py-4 px-6 flex items-center justify-center gap-2
                           hover:bg-green-500 hover:text-black transition-colors punk-text"

web/app/z/[id]/ZineViewer.tsx

@@ -145,7 +145,7 @@ export default function ZineViewer({ zine }: ZineViewerProps) {
         <div className="flex flex-col sm:flex-row justify-center gap-4 mt-8">
           {zine.printLayoutUrl && (
             <a
-              href={zine.printLayoutUrl}
+              href={`${zine.printLayoutUrl}&download=true`}
               download={`${zine.topic.slice(0, 20).replace(/[^a-zA-Z0-9]/g, "_")}_print.png`}
               className="punk-border bg-black text-white py-3 px-6 flex items-center justify-center gap-2
                         hover:bg-green-500 hover:text-black transition-colors punk-text"