From 32d21d1260a4a76e9ead30e292bf42dffcea57f5 Mon Sep 17 00:00:00 2001 From: Vadym Samoilenko Date: Sat, 23 May 2026 20:15:33 +0100 Subject: [PATCH] feat: new logo mark, 8 persona avatars, remove unauthenticated billing API call - Logo.tsx: C arc + 3 people silhouettes SVG mark matching brand design - favicon.svg: updated to match new logo mark - public/avatars/: 8 diverse persona SVGs (skin tones, hair styles, ages) - Index.tsx: remove billingApi.getBalance() call on public landing page (was causing 401 console errors for anonymous visitors; pricing uses hardcoded defaults) Co-Authored-By: Claude Sonnet 4.6 --- public/avatars/persona-1.svg | 23 ++++++++++ public/avatars/persona-2.svg | 25 +++++++++++ public/avatars/persona-3.svg | 25 +++++++++++ public/avatars/persona-4.svg | 28 ++++++++++++ public/avatars/persona-5.svg | 26 +++++++++++ public/avatars/persona-6.svg | 29 ++++++++++++ public/avatars/persona-7.svg | 28 ++++++++++++ public/avatars/persona-8.svg | 28 ++++++++++++ public/favicon.svg | 25 +++++++---- src/components/brand/Logo.tsx | 84 ++++++++++++++++++++++++----------- src/pages/Index.tsx | 16 +------ 11 files changed, 287 insertions(+), 50 deletions(-) create mode 100644 public/avatars/persona-1.svg create mode 100644 public/avatars/persona-2.svg create mode 100644 public/avatars/persona-3.svg create mode 100644 public/avatars/persona-4.svg create mode 100644 public/avatars/persona-5.svg create mode 100644 public/avatars/persona-6.svg create mode 100644 public/avatars/persona-7.svg create mode 100644 public/avatars/persona-8.svg diff --git a/public/avatars/persona-1.svg b/public/avatars/persona-1.svg new file mode 100644 index 00000000..02dd14a8 --- /dev/null +++ b/public/avatars/persona-1.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-2.svg b/public/avatars/persona-2.svg new file mode 100644 index 00000000..a270477e --- /dev/null +++ b/public/avatars/persona-2.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-3.svg b/public/avatars/persona-3.svg new file mode 100644 index 00000000..44f9cb9e --- /dev/null +++ b/public/avatars/persona-3.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-4.svg b/public/avatars/persona-4.svg new file mode 100644 index 00000000..1ae6621f --- /dev/null +++ b/public/avatars/persona-4.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-5.svg b/public/avatars/persona-5.svg new file mode 100644 index 00000000..35639f5b --- /dev/null +++ b/public/avatars/persona-5.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-6.svg b/public/avatars/persona-6.svg new file mode 100644 index 00000000..30d4235b --- /dev/null +++ b/public/avatars/persona-6.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-7.svg b/public/avatars/persona-7.svg new file mode 100644 index 00000000..e1d00cc9 --- /dev/null +++ b/public/avatars/persona-7.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/avatars/persona-8.svg b/public/avatars/persona-8.svg new file mode 100644 index 00000000..be3f5bf0 --- /dev/null +++ b/public/avatars/persona-8.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/favicon.svg b/public/favicon.svg index 5a9e8bbc..d296503d 100644 --- a/public/favicon.svg +++ b/public/favicon.svg @@ -1,13 +1,20 @@ - - + - - - + + + + + + + - - - + + + + + + + + diff --git a/src/components/brand/Logo.tsx b/src/components/brand/Logo.tsx index 68197bc7..4cf2ecbd 100644 --- a/src/components/brand/Logo.tsx +++ b/src/components/brand/Logo.tsx @@ -1,3 +1,4 @@ +import { useId } from 'react'; import { cn } from '@/lib/utils'; interface LogoProps { @@ -6,37 +7,68 @@ interface LogoProps { size?: 'sm' | 'md' | 'lg'; } -const sizes = { sm: 'h-6 w-6', md: 'h-8 w-8', lg: 'h-10 w-10' }; +function LogoMark({ px, id }: { px: number; id: string }) { + const arcId = `${id}-arc`; + const personId = `${id}-person`; + + return ( + + + {/* Arc gradient: light orange top → deep orange bottom */} + + + + + {/* Center person gradient: same orange */} + + + + + + + {/* + C arc: center (50,50), mid-radius 37, stroke-width 14 + Opens to the right. Tips at ±42° from horizontal right. + Top tip: (50+37·cos(-42°), 50+37·sin(-42°)) ≈ (77.5, 25.3) + Bottom tip: (77.5, 74.7) + large-arc=1, sweep=0 → long counter-clockwise arc through the left side = C shape + */} + + + {/* ── Left person — dark gray, small, behind ── */} + {/* Head */} + + {/* Shoulder arc */} + + + {/* ── Right person — dark gray, small, behind ── */} + + + + {/* ── Center person — orange, larger, in front ── */} + + + + ); +} export default function Logo({ className, withWordmark = false, size = 'md' }: LogoProps) { + const id = useId().replace(/:/g, ''); + const px = size === 'sm' ? 24 : size === 'lg' ? 40 : 32; + const textSize = size === 'sm' ? 'text-base' : size === 'lg' ? 'text-xl' : 'text-lg'; + return ( -
- - - - - - - - {/* Hexagonal mark */} - - - +
+ {withWordmark && ( Cohorta diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index 920aafcb..b9e6fec6 100755 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -5,8 +5,6 @@ import { Zap, Clock, DollarSign, Globe, ChevronDown, ChevronUp, CheckCircle2, Star } from 'lucide-react'; -import { billingApi } from '@/lib/api'; - // ────────────────────────────────────────────── // Helpers // ────────────────────────────────────────────── @@ -108,7 +106,7 @@ function FAQItem({ q, a }: { q: string; a: string }) { export default function Index() { const navigate = useNavigate(); const [searchParams] = useSearchParams(); - const [packs, setPacks] = useState(DEFAULT_PACKS); + const packs = DEFAULT_PACKS; useEffect(() => { const section = searchParams.get('scroll'); @@ -117,18 +115,6 @@ export default function Index() { } }, [searchParams]); - useEffect(() => { - billingApi.getBalance() - .then(r => { - const apiPacks: CreditPack[] = (r.data.credit_packs || []).map((p: any) => ({ - ...p, - popular: p.id === 'pro', - })); - if (apiPacks.length >= 2) setPacks(apiPacks); - }) - .catch(() => {}); - }, []); - return (