port branding + calendar fixes from sandbox: Tech Mahindra logo, Mira rename, calendar anchors today, Powered by Zino footer
This commit is contained in:
parent
d16cd8d86e
commit
e56b94c18c
@ -3,7 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/zino.svg" />
|
<link rel="icon" type="image/svg+xml" href="/tech-mahindra-favicon.svg" />
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
|
||||||
|
|||||||
BIN
public/mahindra-favicon.png
Normal file
BIN
public/mahindra-favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 99 KiB |
BIN
public/mahindra.png
Normal file
BIN
public/mahindra.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
3
public/tech-mahindra-favicon.svg
Normal file
3
public/tech-mahindra-favicon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48.0759 49.2998">
|
||||||
|
<path d="M0 18.1239V49.2998L48.0759 31.4757V0.299805L0 18.1239Z" fill="#E31837"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 162 B |
BIN
public/tech-mahindra.png
Normal file
BIN
public/tech-mahindra.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
@ -248,7 +248,7 @@ function CurrentAppShell() {
|
|||||||
<Sparkles size={14} className="text-white" />
|
<Sparkles size={14} className="text-white" />
|
||||||
</div>
|
</div>
|
||||||
<div className="flex-1 min-w-0">
|
<div className="flex-1 min-w-0">
|
||||||
<div className="text-[12.5px] font-semibold text-[#9D0D24]">Maya is on the line</div>
|
<div className="text-[12.5px] font-semibold text-[#9D0D24]">Mira is on the line</div>
|
||||||
<div className="text-[11.5px] text-stone-500 dark:text-zinc-400 mt-0.5">
|
<div className="text-[11.5px] text-stone-500 dark:text-zinc-400 mt-0.5">
|
||||||
The AI scheduler is placing the call right now. This page refreshes on completion.
|
The AI scheduler is placing the call right now. This page refreshes on completion.
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -129,8 +129,9 @@ export function CalendarView() {
|
|||||||
if (cancelled) return;
|
if (cancelled) return;
|
||||||
setDrives(td);
|
setDrives(td);
|
||||||
setCars((c.records as unknown as Car[]) ?? []);
|
setCars((c.records as unknown as Car[]) ?? []);
|
||||||
|
const todayKey = istDayKey(new Date().toISOString());
|
||||||
const days = td.map((r) => istDayKey(r.slot_start)).sort();
|
const days = td.map((r) => istDayKey(r.slot_start)).sort();
|
||||||
setWeekStart(days[0] ?? null);
|
setWeekStart(days.length ? todayKey : null);
|
||||||
})
|
})
|
||||||
.catch((e: any) => !cancelled && setError(e?.message ?? "Failed to load"))
|
.catch((e: any) => !cancelled && setError(e?.message ?? "Failed to load"))
|
||||||
.finally(() => !cancelled && setLoading(false));
|
.finally(() => !cancelled && setLoading(false));
|
||||||
|
|||||||
@ -171,11 +171,9 @@ function Sidebar({
|
|||||||
borderRight: `1px solid ${TM_BORDER}`,
|
borderRight: `1px solid ${TM_BORDER}`,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="px-5 pt-6 pb-5 border-b border-stone-200/60">
|
<div className="px-5 pt-4 pb-3 border-b border-stone-200/60 text-center">
|
||||||
<div className="leading-tight">
|
<img src={`${import.meta.env.BASE_URL}tech-mahindra.png`} alt="Tech Mahindra" className="mx-auto h-auto block" style={{ maxWidth: "85%" }} />
|
||||||
<img src={`${import.meta.env.BASE_URL}zino.svg`} alt="Zino" className="h-5 w-auto" />
|
<div className="mt-2 text-[10.5px] uppercase tracking-[0.18em] text-stone-500">AI Sales Ops</div>
|
||||||
<div className="text-[10.5px] uppercase tracking-[0.18em] text-stone-500 mt-2">AI Sales Ops</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex-1 px-3 py-4 overflow-y-auto">
|
<div className="flex-1 px-3 py-4 overflow-y-auto">
|
||||||
@ -864,7 +862,7 @@ function DetailPage({
|
|||||||
<Sparkles size={15} className="text-white" />
|
<Sparkles size={15} className="text-white" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div className="text-[13px] font-semibold text-[#e31837]">Maya is on the call</div>
|
<div className="text-[13px] font-semibold text-[#e31837]">Mira is on the call</div>
|
||||||
<div className="text-[12px] text-[#5f0229]">The AI scheduler is handling this lead. This page refreshes when complete.</div>
|
<div className="text-[12px] text-[#5f0229]">The AI scheduler is handling this lead. This page refreshes when complete.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -1003,7 +1001,7 @@ function DetailPage({
|
|||||||
const tone = meta?.tone ?? "system";
|
const tone = meta?.tone ?? "system";
|
||||||
const isLast = i === audit.length - 1;
|
const isLast = i === audit.length - 1;
|
||||||
const dotColor = isLast ? ACCENT : tone === "ai" ? TM_NAVY : tone === "user" ? "#57534e" : "#a8a29e";
|
const dotColor = isLast ? ACCENT : tone === "ai" ? TM_NAVY : tone === "user" ? "#57534e" : "#a8a29e";
|
||||||
const actor = tone === "ai" ? "AI · Maya" : (e.user_roles?.[0] ?? "System");
|
const actor = tone === "ai" ? "AI · Mira" : (e.user_roles?.[0] ?? "System");
|
||||||
return (
|
return (
|
||||||
<li key={e.id} className="relative pl-7 pb-4 last:pb-0 text-[13px]">
|
<li key={e.id} className="relative pl-7 pb-4 last:pb-0 text-[13px]">
|
||||||
<span
|
<span
|
||||||
@ -1115,7 +1113,7 @@ const SECTION_EMPTY: Record<string, { icon: React.ReactNode; title: string; body
|
|||||||
ai: {
|
ai: {
|
||||||
icon: <Sparkles size={18} strokeWidth={2} />,
|
icon: <Sparkles size={18} strokeWidth={2} />,
|
||||||
title: "No AI call activity",
|
title: "No AI call activity",
|
||||||
body: "Maya's call summary appears here once she's connected.",
|
body: "Mira's call summary appears here once she's connected.",
|
||||||
},
|
},
|
||||||
other: {
|
other: {
|
||||||
icon: <Inbox size={18} strokeWidth={2} />,
|
icon: <Inbox size={18} strokeWidth={2} />,
|
||||||
|
|||||||
@ -42,7 +42,7 @@ export default function Login() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen flex bg-white">
|
<div className="min-h-screen flex bg-white relative">
|
||||||
{/* ── Left — TM brand panel ───────────────────────────────────── */}
|
{/* ── Left — TM brand panel ───────────────────────────────────── */}
|
||||||
<div
|
<div
|
||||||
className="hidden lg:flex lg:w-[45%] flex-col justify-between p-14 relative overflow-hidden text-white"
|
className="hidden lg:flex lg:w-[45%] flex-col justify-between p-14 relative overflow-hidden text-white"
|
||||||
@ -60,9 +60,10 @@ export default function Login() {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Brand lockup — zino mark + Sales Ops subtitle */}
|
{/* Brand lockup — zino mark + Sales Ops subtitle */}
|
||||||
<div className="relative z-10 leading-tight">
|
<div className="relative z-10">
|
||||||
<img src={`${import.meta.env.BASE_URL}zino.svg`} alt="Zino" className="h-7 w-auto" />
|
<div className="bg-white rounded-xl px-5 py-3 shadow-lg inline-block">
|
||||||
<div className="text-[10.5px] uppercase tracking-[0.18em] text-white/60 mt-2">AI Sales Ops</div>
|
<img src={`${import.meta.env.BASE_URL}tech-mahindra.png`} alt="Tech Mahindra" className="h-24 w-auto block" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Headline + feature bullets */}
|
{/* Headline + feature bullets */}
|
||||||
@ -76,7 +77,7 @@ export default function Login() {
|
|||||||
|
|
||||||
<div className="space-y-5">
|
<div className="space-y-5">
|
||||||
{[
|
{[
|
||||||
{ icon: <PhoneCall size={14} />, title: "Auto-dial leads", desc: "Maya, your AI scheduler, calls customers within seconds of capture." },
|
{ icon: <PhoneCall size={14} />, title: "Auto-dial leads", desc: "Mira, your AI scheduler, calls customers within seconds of capture." },
|
||||||
{ icon: <CalendarCheck2 size={14} />, title: "Live slot booking", desc: "Real-time availability against the dealer's calendar." },
|
{ icon: <CalendarCheck2 size={14} />, title: "Live slot booking", desc: "Real-time availability against the dealer's calendar." },
|
||||||
{ icon: <Sparkles size={14} />, title: "Feedback loop", desc: "Post-drive AI follow-up captures NPS and concerns." },
|
{ icon: <Sparkles size={14} />, title: "Feedback loop", desc: "Post-drive AI follow-up captures NPS and concerns." },
|
||||||
].map((item) => (
|
].map((item) => (
|
||||||
@ -96,10 +97,7 @@ export default function Login() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Footer rule */}
|
<div aria-hidden />
|
||||||
<div className="relative z-10 text-[11px] uppercase tracking-[0.18em] text-white/40">
|
|
||||||
© Zino
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* ── Right — login form ──────────────────────────────────────── */}
|
{/* ── Right — login form ──────────────────────────────────────── */}
|
||||||
@ -107,7 +105,7 @@ export default function Login() {
|
|||||||
<div className="w-full max-w-[360px]">
|
<div className="w-full max-w-[360px]">
|
||||||
{/* Compact lockup for mobile (left panel hidden) */}
|
{/* Compact lockup for mobile (left panel hidden) */}
|
||||||
<div className="flex items-center mb-10 lg:hidden">
|
<div className="flex items-center mb-10 lg:hidden">
|
||||||
<img src={`${import.meta.env.BASE_URL}zino.svg`} alt="Zino" className="h-6 w-auto" />
|
<img src={`${import.meta.env.BASE_URL}mahindra.png`} alt="Mahindra" className="h-20 w-auto" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mb-8">
|
<div className="mb-8">
|
||||||
@ -173,12 +171,14 @@ export default function Login() {
|
|||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<div className="flex items-center justify-center gap-1.5 mt-12">
|
|
||||||
<span className="text-[11px] uppercase tracking-[0.12em] text-stone-400">Powered by</span>
|
|
||||||
<span className="text-[11px] font-bold uppercase tracking-[0.12em]" style={{ color: INK }}>Zino</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Powered by Zino — bottom right */}
|
||||||
|
<div className="absolute bottom-4 right-6 flex items-center gap-1.5 z-20">
|
||||||
|
<span className="text-[11px] uppercase tracking-[0.12em] text-stone-400">Powered by</span>
|
||||||
|
<span className="text-[11px] font-bold uppercase tracking-[0.12em]" style={{ color: "#f97316" }}>Zino</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user