/* Floating UI fragments — chunks of the actual app, presented as glass cards. No full phone bezel; each card is a self-contained product moment. */ // ── Calculator result fragment ── const FragCalcResult = ({style}) => (
Day rate
1st AC · 12-hour day
ACCP
$1,284 .50
); const Row = ({k, v, amber, accent}) => (
{k} {v}
); // ── Invoice list ── const FragInvoiceList = ({style}) => (
Recent Invoices
See all
); const StatusDot = ({s}) => { const map = { paid: {c: 'var(--sa-green)', t:'Paid'}, sent: {c: 'var(--sa-accent-hi)', t:'Sent'}, overdue: {c: 'var(--sa-red)', t:'Overdue'}, draft: {c: 'var(--sa-text4)', t:'Draft'}, }; const {c, t} = map[s]; return ( {t} ); }; const InvoiceRow = ({client, amt, status, date}) => (
{client}
· {date}
{amt}
); // ── Crew profile card ── const FragCrewCard = ({style}) => (
KW
Kristian Wood
VTR & DIT · Toronto, ON
{['Wavetech','SmallHD','Resolve','Silverstack','Flanders'].map(t=>( {t} ))}
Avail
This week
); // ── Calendar mini fragment (week strip) ── const FragCalendarStrip = ({style}) => { const days = [ {d:'M', n:14, kind:null}, {d:'T', n:15, kind:'shoot'}, {d:'W', n:16, kind:'shoot'}, {d:'T', n:17, kind:'shoot'}, {d:'F', n:18, kind:'wrap'}, {d:'S', n:19, kind:null}, {d:'S', n:20, kind:'hold'}, ]; const colorFor = (k) => k==='shoot' ? 'var(--sa-accent)' : k==='wrap' ? 'var(--sa-green)' : k==='hold' ? 'var(--sa-amber)' : 'transparent'; return (
April 14 – 20
4 DAYS BOOKED
{days.map((day,i)=>(
{day.d}
{day.n}
{day.kind && (
)}
))}
Honda TVC — Day 2
06:30 call · 1st AC · Pinewood
); }; // ── Finances summary ── const FragFinances = ({style}) => (
Year to date
$48,920.50
+12% vs. last year
HST Quarter
Q2 due July 31 · auto-tracked
); const Mini = ({label, v, color}) => (
{label}
{v}
); // ── Payroll Wrap ── const FragPayrollWrap = ({style}) => (
Honda TVC — Wrap
PRO
3 days · 12 crew · ACCP line numbers
{[ {n:'04', name:'1st AC', amt:'$3,852.00', state:'sent'}, {n:'05', name:'2nd AC', amt:'$2,640.00', state:'sent'}, {n:'08', name:'Gaffer', amt:'$3,420.00', state:'review'}, {n:'09', name:'Best Boy', amt:'$2,880.00', state:'review'}, ].map((r,i)=>(
{r.n}
{r.name}
{r.amt}
))}
Total payroll $32,418.50
); // ── Kit Inventory ── const FragKit = ({style}) => (
Camera Kit
14 items · $42,800 value
$520/day
{[ {n:'Alexa Mini LF Body', v:'$280/day'}, {n:'Cooke S4 mini set', v:'$180/day'}, {n:'Preston Hand Unit 4', v:'$60/day'}, ].map((it,i)=>(
{it.n}
{it.v}
))}
); // ── Notification fragment ── const FragNotif = ({style}) => (
SET ASSIST now
Anvil Pictures paid $3,840.00 · 9 days early
); Object.assign(window, { FragCalcResult, FragInvoiceList, FragCrewCard, FragCalendarStrip, FragFinances, FragPayrollWrap, FragKit, FragNotif });