feat(branding): symmetric light/dark logo fallback + customer surface

Pick the logo by the active color mode with a symmetric fallback: a
single uploaded logo serves both modes (dark uses dark||light, light
uses light||dark). Apply to admin header, customer gallery, and the
customer portal (follows branding_force_color_mode). PDFs already use
the light branding logo with the business-profile PDF logo as override
(resolveLogoFile) — unchanged.
This commit is contained in:
Luca
2026-06-03 13:33:27 +02:00
parent 4790ea5ccd
commit 44590b8c0b
3 changed files with 20 additions and 8 deletions
+10 -1
View File
@@ -65,7 +65,16 @@ export const CustomerLayout: React.FC = () => {
const [sidebarOpen, setSidebarOpen] = useState(false);
const companyName = settingsData?.branding_company_name?.trim() || 'PicPeak';
const logoUrl = settingsData?.branding_logo_url?.trim();
// Theme-aware logo: the customer surface follows branding_force_color_mode
// ('auto' → OS preference). Symmetric fallback so a single uploaded logo
// serves both modes.
const forceMode = settingsData?.branding_force_color_mode;
const customerIsDark = forceMode === 'dark'
|| (forceMode === 'auto' && typeof window !== 'undefined'
&& window.matchMedia?.('(prefers-color-scheme: dark)').matches);
const lightLogo = settingsData?.branding_logo_url?.trim();
const darkLogo = settingsData?.branding_logo_url_dark?.trim();
const logoUrl = customerIsDark ? (darkLogo || lightLogo) : (lightLogo || darkLogo);
const resolvedLogoUrl = logoUrl || '/picpeak-logo-transparent.png';
// Filter out feature-gated entries the customer can't see. Galleries +