fix(ui): bottom action buttons clipped by browser/OS chrome + add AGENTS.md#5
Open
DDancingDeath wants to merge 1 commit into
Open
fix(ui): bottom action buttons clipped by browser/OS chrome + add AGENTS.md#5DDancingDeath wants to merge 1 commit into
DDancingDeath wants to merge 1 commit into
Conversation
…NTS.md `www/css/tabs.css`: The .tab CSS rule had `padding: 70px 16px 24px 16px` together with `height: 100vh`. 24 px is below the Windows taskbar height (~40-50 px) and below the iOS home-indicator safe area, and `height: 100vh` (not `min-height`) locks the tab to the viewport at the moment of layout so it doesn't re-flow when mobile browser chrome appears. Result: the WhatsApp / Save / Print row at the bottom of the Bills form (and any similar bottom row in other tabs) was partially or fully hidden behind the OS taskbar / dynamic browser chrome on user devices. The fix bumps bottom padding to 96 px and adds `env(safe-area-inset-bottom)` on top so the iOS home indicator is also respected. `height: 100vh` is intentionally kept — replacing it is a larger refactor with risk of breaking inner-scroll behaviour on Android. Verified in the staging clone via Playwright at viewport heights 720 and 600 — Save and Print buttons fully on-screen with margin to spare in both cases. (Origin commit: aadhat-staging 6a90200.) `AGENTS.md` (new): Adds a top-level orientation guide for AI coding agents working in this repo. Mirrors the AGENTS.md that already exists in the staging clone, adapted for prod context (production-safety rules instead of clone- safety rules; staging-clone existence documented in section 6 so future agents know where greenfield work happens). No application logic changed; both files are documentation/CSS only. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Two changes, both safe / additive:
1. Fix clipped bottom action buttons (CSS)
www/css/tabs.css — the .tab rule had
padding: 70px 16px 24px 16pxtogether withheight: 100vh. 24 px is below the Windows taskbar height (~40-50 px) and below the iOS home-indicator safe area.height: 100vh(notmin-height) locks tab height to the viewport at the moment of layout, so it does not re-flow when mobile browser chrome appears.Symptom: WhatsApp / Save / Print row at the bottom of the Bills form was partially or fully hidden behind the OS taskbar / dynamic browser chrome.
Fix: bump bottom padding to 96 px and add
env(safe-area-inset-bottom)so iOS home indicator is also respected.Verification: applied to the staging clone first (commit
6a90200on aadhat-staging). Verified with Playwright at viewport heights 720 and 600 — Save and Print fully on-screen with margin to spare in both:height: 100vhis intentionally left alone — replacing it is a larger refactor with risk to Android inner-scroll behaviour.2. Add
AGENTS.mdTop-level orientation file for any AI coding agent (or human, frankly) landing in this repo. Mirrors the AGENTS.md that already exists in the private staging clone, adapted for prod context (production-safety rules; staging-clone existence documented so agents know where greenfield work happens).
Risk
Documentation + 1 CSS rule. No application logic changed. No JS, no Firestore, no rules. Easy to revert.
Origin commit
Staging clone:
aadhat-staging 6a90200(private repo).