# Deploying the design system + prototype (Cloudflare Pages)

The whole project is **static files — no build step**. Cloudflare Pages (or any
static host) can serve it as-is. Everything the pages need is either local
(fonts, shared CSS/JS partials) or loaded from public CDNs over https
(React/Babel from unpkg, Bootstrap Icons from jsDelivr).

## What to upload

Deploy the **project root** (paths like `preview/_buttons.css`,
`colors_and_type.css`, `fonts/…` must resolve exactly as in the repo).

Exclude working/agent artifacts — they are not referenced by any page:

```
.scratch/  scraps/  screenshots/  backups/  uploads/  tools/  notes/
_ds_bundle.js  _ds_manifest.json  _adherence.oxlintrc.json
CLAUDE.md  SKILL.md
```

(Leaving them in breaks nothing; excluding them just keeps the upload small
and private.)

## How

Either drag-and-drop the folder in the Cloudflare dashboard (Workers & Pages →
Create → Pages → Upload assets), or:

```sh
npx wrangler pages deploy . --project-name=oos-digital-library
```

No framework preset, no build command, output directory = `/`.

## Entry points

- `/` → `index.html` — small hub linking the three surfaces
- `/downloads/` — single-file offline exports (prototype + dataset preview),
  linked from the hub's "Ke stažení" section; include the folder in the upload
- `/preview/playground.html` — the design-system playground (all 47 sections + Tools)
- `/ui_kits/cos-library/index.html` — the interactive prototype
- `/ui_kits/cos-library/data-preview.html` — dataset preview / QA surface

## Environment auto-sense (already wired)

The playground detects whether it is served from Claude Design by looking for
`/projects/<id>/` in its own URL:

- **In Claude Design** — source links / Tools cards / the modal button deep-link
  into the Claude Design editor (`Ctrl/⌘+Click` contract).
- **Anywhere else (Pages)** — the same affordances fall back to opening the raw
  file in a new tab, and the modal button relabels itself "Open in new tab".
  Nothing else changes; no flags to set.

## Notes

- All state (theme, favourites, tweaks, playback governor) is `localStorage` —
  per-browser, no backend.
- The Czechia Sans fonts in `fonts/` are part of the gov.cz identity; keep the
  deployment internal/colleague-facing accordingly.
- The prototype's hash-based routing (`#/katalog/3?q=…`) needs no server
  rewrites — everything is a single static HTML file per surface.