steve/check-printing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): resolve deposit panel scroll and PDF open on iOS

Browse Source 
- Switch #deposit-panel to 100dvh so iOS browser chrome doesn't clip the Save button
- Move overflow-y:auto to #deposit-panel-body so the actions footer stays pinned
- Replace window.open(blob:) with <a download> click to fix PDF opening in Firefox iOS
  (Firefox iOS blocks blob: URL navigation in new tabs)

Closes #7, closes #9
This commit is contained in:
Steve Dogiakos
2026-04-28 08:32:07 -06:00
parent 0ee95dbb09
commit 657de9e61a
2 changed files with 18 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/style.css
+4 -2
View File
@@ -679,7 +679,7 @@ input[type="file"] {
right: 0; right: 0;
width: 560px; width: 560px;
max-width: 98vw; max-width: 98vw;
height: 100vh; height: 100dvh;
background: var(--surface); background: var(--surface);
z-index: 101; z-index: 101;
box-shadow: -4px 0 24px rgba(0,0,0,0.15); box-shadow: -4px 0 24px rgba(0,0,0,0.15);
@@ -687,7 +687,7 @@ input[type="file"] {
transition: transform 0.2s ease; transition: transform 0.2s ease;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow-y: auto; overflow: hidden;
} }
#deposit-panel.open { transform: translateX(0); } #deposit-panel.open { transform: translateX(0); }
@@ -697,6 +697,8 @@ input[type="file"] {
flex-direction: column; flex-direction: column;
gap: 14px; gap: 14px;
flex: 1; flex: 1;
overflow-y: auto;
min-height: 0;
} }
.dep-summary { .dep-summary {
public/js/app.js
+14 -2
View File
@@ -780,6 +780,18 @@ async function deleteCheck(id) {
} }
} }
// Firefox on iOS blocks window.open(blob:) in a new tab; use a temporary <a download> instead.
function openPdfBlob(blob, filename) {
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
setTimeout(() => URL.revokeObjectURL(url), 10000);
}
async function generatePdf() { async function generatePdf() {
const ids = [...state.selected]; const ids = [...state.selected];
if (ids.length === 0) return; if (ids.length === 0) return;
@@ -801,7 +813,7 @@ async function generatePdf() {
throw new Error(err.error || res.statusText); throw new Error(err.error || res.statusText);
} }
const blob = await res.blob(); const blob = await res.blob();
window.open(URL.createObjectURL(blob), '_blank'); openPdfBlob(blob, 'checks.pdf');
await loadChecks(); // refresh to show printed status await loadChecks(); // refresh to show printed status
} catch (err) { } catch (err) {
countSpan.textContent = savedCount; countSpan.textContent = savedCount;
@@ -1595,7 +1607,7 @@ async function generateDepositPdf(type) {
throw new Error(err.error || res.statusText); throw new Error(err.error || res.statusText);
} }
const blob = await res.blob(); const blob = await res.blob();
window.open(URL.createObjectURL(blob), '_blank'); openPdfBlob(blob, type === 'slip' ? 'deposit-slip.pdf' : 'deposit-report.pdf');
if (type === 'slip') await loadDeposits(); if (type === 'slip') await loadDeposits();
} catch (err) { } catch (err) {
alert('PDF error: ' + err.message); alert('PDF error: ' + err.message);