# Cloudflare Pages — staging dashboard steps (AFC-345)

> Scope: staging preview only. Do NOT touch the apex site `bluespace.ng`
> or any production system. No Cloudflare credentials are needed for, or
> included in, this task.

## Fixed names (use exactly these)

- Pages project name: `afc-youth-summit-staging`
- Production branch: `main` (every push to `main` auto-deploys to the custom domain)
- Custom domain: `staging.bluespace.ng`
- Source: this repo, branch `main`, root directory, no build command
  (plain static site: `index.html` + `styles.css`)

## Before you attach the domain — check the current 502

`staging.bluespace.ng` returns HTTP 502 today. That means something else
already claims or answers for that hostname. Before attaching the domain
in Pages:

1. In the Cloudflare dashboard, open the `bluespace.ng` zone.
2. Check **DNS → Records** for any record named `staging`
   (A, AAAA, or CNAME) and note where it points.
3. Check **Workers / Pages / Tunnels** (and any Redirect Rules) for
   anything already bound to `staging.bluespace.ng`.
4. Only proceed when you know what currently answers the hostname, or
   have removed/repointed it deliberately. Do not attach the custom
   domain over an unknown existing binding.

## Exact dashboard steps (board user does these)

1. Log in to the Cloudflare dashboard (the account that holds `bluespace.ng`).
2. Go to **Workers & Pages → Create → Pages → Connect to Git**.
3. Select the repository for this preview and the **production branch `main`**.
4. Configure the build:
   - Project name: `afc-youth-summit-staging`
   - Framework preset: **None**
   - Build command: *(leave empty)*
   - Build output directory: `/` (root)
   - Root directory: `/` (repo root)
5. Select **Save and Deploy**. Wait for the first deployment to succeed;
   Cloudflare gives it a `*.pages.dev` URL.
6. Open the new Pages project → **Custom domains → Set up a custom domain**.
7. Enter exactly `staging.bluespace.ng` and select **Continue / Activate**.
8. Cloudflare adds the DNS record automatically (CNAME to the Pages
   project) because it controls the `bluespace.ng` zone. Confirm the
   record appears under **DNS → Records**.
9. Wait for TLS to issue. The custom domain row should show **Active**
   with a valid certificate. Open `https://staging.bluespace.ng/` and
   confirm the staging banner and event title render.
10. Confirm auto-deploy: **Settings → Builds & deployments → Production
    branch** must read `main`. Push any later change to `main` and check
    that the custom domain updates without further dashboard steps.

## If TLS or the domain stays pending

- Re-check the pre-step above: another record or binding for `staging`
  is the most likely cause (today's 502 points there).
- Do not change anything on the apex `bluespace.ng` site itself.
- Escalate to the CTO (MediaTech) with a screenshot of the Custom
  domains row and the DNS record for `staging`.