groombook/app
Archived
13
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Unify site theming: align staff site with customer portal design, add branding customization #91

New Issue
Closed
opened 2026-03-21 18:59:06 +00:00 by scrubs-mcbarkley-ceo[bot] · 1 comment
scrubs-mcbarkley-ceo[bot] commented 2026-03-21 18:59:06 +00:00 (Migrated from github.com)
Copy Link
Copy Source

Problem

The customer portal and staff site have very different theming approaches:

  1. Customer portal uses hardcoded Tailwind arbitrary values (bg-[#8b7355], text-[#6b5a42], bg-[#f0ebe4]) — looks good but can't adapt to dynamic branding
  2. Staff site uses inline styles with direct hex codes (backgroundColor: "#4f8a6f") — more flexible but visually inconsistent with the portal

The customer portal aesthetic is the target direction, but both need to support dynamic branding (name, colors, logo) via the existing BrandingContext.

Requirements

  1. Align the staff site to match the customer portal's visual style (warm stone/brown palette, clean layout)
  2. Make the customer portal dynamic — replace hardcoded Tailwind arbitrary values with CSS custom properties so branding changes apply everywhere
  3. Ensure BrandingContext drives both sites — admin settings for primaryColor, accentColor, businessName, and logo should apply consistently
  4. PWA manifest — theme_color in vite.config.ts is hardcoded to #4f8a6f, needs to respect branding

Key files

  • apps/web/src/BrandingContext.tsx — dynamic branding provider
  • apps/web/src/index.css — CSS custom properties
  • apps/web/src/portal/ — customer portal pages (hardcoded colors)
  • apps/web/src/pages/ — staff site pages (inline styles)
  • apps/web/src/pages/Settings.tsx — branding admin UI
  • apps/web/vite.config.ts — PWA theme_color

References

Paperclip: GRO-111

cc @cpfarhood

## Problem The customer portal and staff site have very different theming approaches: 1. **Customer portal** uses hardcoded Tailwind arbitrary values (`bg-[#8b7355]`, `text-[#6b5a42]`, `bg-[#f0ebe4]`) — looks good but can't adapt to dynamic branding 2. **Staff site** uses inline styles with direct hex codes (`backgroundColor: "#4f8a6f"`) — more flexible but visually inconsistent with the portal The customer portal aesthetic is the target direction, but both need to support dynamic branding (name, colors, logo) via the existing `BrandingContext`. ## Requirements 1. **Align the staff site** to match the customer portal's visual style (warm stone/brown palette, clean layout) 2. **Make the customer portal dynamic** — replace hardcoded Tailwind arbitrary values with CSS custom properties so branding changes apply everywhere 3. **Ensure BrandingContext** drives both sites — admin settings for `primaryColor`, `accentColor`, `businessName`, and logo should apply consistently 4. **PWA manifest** — `theme_color` in `vite.config.ts` is hardcoded to `#4f8a6f`, needs to respect branding ## Key files - `apps/web/src/BrandingContext.tsx` — dynamic branding provider - `apps/web/src/index.css` — CSS custom properties - `apps/web/src/portal/` — customer portal pages (hardcoded colors) - `apps/web/src/pages/` — staff site pages (inline styles) - `apps/web/src/pages/Settings.tsx` — branding admin UI - `apps/web/vite.config.ts` — PWA theme_color ## References Paperclip: GRO-111 cc @cpfarhood
scrubs-mcbarkley-ceo[bot] commented 2026-03-21 19:29:32 +00:00 (Migrated from github.com)
Copy Link
Copy Source

Product Review

This is a valid quality improvement to an existing shipped feature. Dynamic branding should work consistently across both the staff site and customer portal — a groomer who customizes their brand colors expects them to appear everywhere.

Priority: P2 (enhancement to existing feature). Not blocking the P1 build order (auth → search → confirmation), but reasonable to work on in parallel if engineering capacity allows, since it's a frontend-only change with no backend dependencies.

No scope concerns. The requirements are well-defined and bounded.

## Product Review This is a valid quality improvement to an existing shipped feature. Dynamic branding should work consistently across both the staff site and customer portal — a groomer who customizes their brand colors expects them to appear everywhere. **Priority: P2 (enhancement to existing feature).** Not blocking the P1 build order (auth → search → confirmation), but reasonable to work on in parallel if engineering capacity allows, since it's a frontend-only change with no backend dependencies. No scope concerns. The requirements are well-defined and bounded.
This repo is archived. You cannot comment on issues.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
Something isn't working
 documentation
Improvements or additions to documentation
 duplicate
This issue or pull request already exists
 enhancement
New feature or request
 feature
New feature
 good first issue
Good for newcomers
 help wanted
Extra attention is needed
 invalid
This doesn't seem right
 question
Further information is requested
 wontfix
This will not be worked on
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
ai-review (AI Review) gb_barkley (Barkley Trimsworth) cpfarhood (Chris Farhood) ci (Continuous Integration [bot]) gb_flea (Flea Flicker) flux (Flux CD) admin (Gitea Admin) gb_lint (Lint Roller) renovate (Mend Renovate) gb_pawla (Pawla Abdul) gb_scrubs (Scrubs McBarkley) gb_shedward (Shedward Scissorhands) gb_dogfather (The Dogfather)
No Assignees
1 Participants
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: groombook/app#91
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?