Logipoint

Landing page for Logipoint, a Rotterdam-based freight forwarder running a shared sea container service between Surabaya and Rotterdam.

The site is a self-contained static page — no build step, no backend. It's written using the Claude Design canvas format (.dc.html originally; renamed here to index.html so it deploys as a normal static site) and rendered client-side by support.js.

Structure

index.html              Page markup + template bindings (colors, copy, layout)
support.js              Client-side runtime that renders index.html
assets/
  logo.png              Site logo / favicon
  hero-video.mp4         Hero background video
  vendor/                Self-hosted React/ReactDOM (see below)
design-source/          Original reference material from the design process
                         (testimonials PDF, reference images/video) — not
                         served by the site, kept for reference only.

How it works

index.html embeds the page template plus a <script data-dc-script> block defining a Component class (state, i18n copy for NL/EN/ID, the live batch tracker/countdown logic, dark mode, etc). support.js boots React, parses the template, and renders/re-renders the page as state changes — no other JavaScript framework or bundler is involved.

React and ReactDOM 18.3.1 are vendored locally under assets/vendor/ so the page renders even if the visitor can't reach unpkg.com (blocked networks, CDN outages, offline demos). support.js tries the local copy first and falls back to the CDN automatically if assets/vendor/ is ever missing.

Running locally

Any static file server works, e.g.:

python3 -m http.server 8080

then open http://localhost:8080/index.html.

Deploying

Since this is a plain static site, it can be hosted as-is on GitHub Pages, Netlify, Vercel, or any static host — just point it at the repository root.

GitHub Pages

1. Repo Settings → Pages → Source → set to GitHub Actions.
2. The included workflow (.github/workflows/deploy-pages.yml) publishes index.html, support.js, and assets/ on every push to main.

Content notes

• Dates, the batch countdown/tracker, and the hero status badge are computed live from the visitor's clock against fixed shipment milestones defined in index.html — no manual updates needed as time passes. When a new batch is scheduled, update the dates in _computeHeroStatus and _computeTracker.
• Contact happens via WhatsApp links (wa.me/...); there is no contact form or backend.