- CustomerPortal.tsx: change main from overflow-x-hidden to overflow-hidden
to properly clip child overflow in both axes
- BillingPayments.tsx: add overflow-x-auto to tab button row so long
button labels scroll instead of causing page-level overflow
- PetProfiles.tsx: already has overflow-x-auto on tab row — no change needed
Discovered in UAT by Shedward (DEF-2 and DEF-3 on GRO-754).
Co-Authored-By: Paperclip <noreply@paperclip.ing>
* fix(GRO-766): prevent horizontal overflow on portal mobile pages
- Add overflow-x-hidden to main content area in CustomerPortal
- Add w-full overflow-hidden to content wrapper div
- Add flex-wrap to BillingPayments tab button row
Co-Authored-By: Paperclip <noreply@paperclip.ing>
* fix(GRO-769): proxy logo uploads through API server to fix mixed content
The pre-signed URL flow used an internal HTTP endpoint for S3 uploads,
which browsers blocked as mixed content on HTTPS pages. Instead of
generating a pre-signed URL that the browser uploads to directly,
the new /logo/upload endpoint receives the file via multipart POST
and streams it to S3 from the API server using the internal endpoint.
This resolves the mixed content error that was blocking logo uploads
on dev.groombook.dev.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
---------
Co-authored-by: Test User <test@example.com>
Co-authored-by: Paperclip <noreply@paperclip.ing>
- Add overflow-x-hidden to main content area in CustomerPortal
- Add w-full overflow-hidden to content wrapper div
- Add flex-wrap to BillingPayments tab button row
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Add role="dialog", aria-modal="true", focus trap, Escape-to-close,
and focus-restore-on-close to Invoices.tsx and Clients.tsx Modal
components, and to the two inline modals in BillingPayments.tsx.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Remove readOnly guard from Pay Now button and PaymentModal in BillingPayments.
The readOnly guard was too broad — it hid the Pay Now button during staff
impersonation sessions, making it impossible for staff to collect payments.
Other readOnly guards (Remove payment method, Autopay toggle) remain intact.
Co-authored-by: groombook-engineer[bot] <269742240+groombook-engineer[bot]@users.noreply.github.com>
Co-authored-by: Paperclip <noreply@paperclip.ing>
Fixes GRO-261 — billing portal session header mismatch and response format bug.
- x-session-id → X-Impersonation-Session-Id in BillingPayments.tsx and Dashboard.tsx
- Handle bare array response from /api/portal/invoices
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Closes GRO-261 — Pay Now button on Billing page now opens a payment modal with invoice selection and simulated payment flow.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Replace all hardcoded brand color hex values with CSS custom properties
so BrandingContext drives both the customer portal and staff site.
- index.css: add derived accent/primary vars using color-mix()
(--color-accent-hover, --color-accent-dark, --color-accent-light,
--color-accent-lighter, --color-primary-dark); fix focus ring styles
to use var(--color-primary) instead of hardcoded hex
- BrandingContext.tsx: also update <meta name="theme-color"> in sync
with primaryColor so PWA theme-color tracks branding at runtime
- portal/sections: replace bg-[#8b7355], text-[#6b5a42], bg-[#f0ebe4],
bg-[#faf5ef], hover:bg-[#7a6549] etc. with Tailwind v4 CSS var
utilities (bg-(--color-accent), text-(--color-accent-dark), etc.)
- pages: replace inline style "#4f8a6f"/"#3d7a5f" with
var(--color-primary) / var(--color-primary-dark) across Appointments,
Book, Clients, GroupBooking, Invoices, Reports, Services, Staff, and
DevSessionIndicator
Closes#91
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Chris Farhood
the-dogfather-cto[bot]