feat: JS Cebu design system v0.1

.github/workflows/ci.yml

@@ -0,0 +1,21 @@
+name: CI
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      # The pnpm version comes from "packageManager" in package.json.
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: pnpm
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm test
+      - run: pnpm build

.gitignore

@@ -1,3 +1,9 @@
 .superpowers/
 .DS_Store
 node_modules/
+
+# website
+apps/website/public/brand/
+apps/website/dist/
+apps/website/.astro/
+apps/website/.wrangler/

.impeccable.md

@@ -0,0 +1,39 @@
+# Design Context: jscebu.org
+
+Distilled from the approved specs:
+- `docs/superpowers/specs/2026-10-27-jscebu-design-system-design.md`
+- `docs/superpowers/specs/2026-10-28-jscebu-site-v1-design.md`
+
+The brand rules themselves live in `packages/brand` and at https://www.jscebu.org/brand.md. This file covers who the site is for and how it should feel.
+
+## Audience
+
+- **Developers in Cebu:** students, juniors and working devs who come to meetups, workshops and Hacktoberfest Cebu.
+- **Volunteers, co-leads and partner communities:** they make things for JS Cebu.
+- **AI agents:** they make on-brand graphics and pages, given only the brand link.
+
+## Use cases
+
+- Find the next event. For now that means Cebby and Facebook.
+- See that the community is real and active: real photos, real projects.
+- Find where to join.
+- Get the logos and brand rules.
+
+## Personality
+
+- **The website uses the Terminal personality:** ink background, a faint grid, yellow light.
+- **The two signatures carry recognition:** the block cursor at the end of the primary headline, and the logo as a tilted die-cut sticker.
+- **Voice:**
+  - English first, friendly and direct, like a fellow developer.
+  - Bisaya only lightly, and only approved phrases.
+- **Photos:** real and never filtered.
+- **No hexagon motifs** beyond the logo itself.
+
+## Motion
+
+Added 2026-10-28, because Dorell said "a little bit of animations. right now, it's zero".
+
+- **A little, and purposeful.** Motion follows the brand's two signatures: text arriving like terminal output, and the sticker being slapped on.
+- **Easing and timing:** decelerating curves (ease-out-expo or quart), never bounce. Entrances run 400–700ms; feedback runs 100–250ms. Animate only transform and opacity.
+- **One hero moment per page,** plus quiet reveals as sections scroll in and small hover and press feedback on things you can click.
+- **Under `prefers-reduced-motion: reduce`, nothing moves,** and the cursor doesn't blink. Content never depends on JavaScript to become visible.

.nvmrc

@@ -0,0 +1 @@
+24

CONTRIBUTING.md

@@ -0,0 +1,57 @@
+# Contributing
+
+Thanks for helping JavaScript Cebu.
+
+## How changes ship
+
+Every change, from a person or an AI agent, follows the same path:
+
+1. **Intent.** Open an issue, or start a conversation, that says what should change and why.
+2. **Plan.** Larger changes get a written spec and plan under `docs/superpowers/` before anyone writes code.
+3. **Approval.** A JS Cebu lead approves the plan.
+4. **Implementation.** Build it on a branch and open a pull request.
+5. **Review.**
+   - CI runs `pnpm install --frozen-lockfile && pnpm test && pnpm build` on every pull request.
+   - A reviewer reads the whole branch.
+6. **Merge.** Merging to `main` deploys www.jscebu.org.
+
+## Deploys
+
+**Merging to `main` is the deploy.** Cloudflare Workers Builds builds `main` and deploys the `jscebu-org` Worker with these settings:
+
+| Setting | Value |
+|---|---|
+| Root directory | repo root |
+| Build command | `pnpm install --frozen-lockfile && pnpm test && pnpm --filter website build` |
+| Deploy command | `pnpm --filter website exec wrangler deploy` |
+| Other branches | `pnpm --filter website exec wrangler versions upload` (a preview URL per branch) |
+
+Node comes from `.nvmrc` and pnpm from `packageManager` in `package.json`. A failing test or post-build check stops the deploy.
+
+Don't run `wrangler deploy` by hand.
+
+Be careful with `routes` in `apps/website/wrangler.jsonc`. www.jscebu.org is attached there as a Custom Domain. Deploys from CI replace any existing DNS record for a Custom Domain they list, so add or change a domain only through a reviewed pull request.
+
+## Brand changes are releases
+
+`packages/brand` is the JS Cebu design system. A change to a color, font, rule, logo or template is a **versioned release** (for example v0.1 → v0.2), not a drive-by edit:
+
+1. Bump `version` in `packages/brand/src/brand.ts`.
+2. Add a `changelog` entry describing the change.
+3. A JS Cebu lead approves it before merge.
+
+Bisaya copy appears only after a lead approves the phrase, which means its `status` is `approved`.
+
+## Before you open a PR
+
+```sh
+pnpm install
+pnpm test
+pnpm build
+```
+
+All tests and checks must pass. CI runs the same commands.
+
+## Never commit secrets
+
+This repository is public. Never commit tokens, API keys, form responses or personal data. Deploy credentials live in Cloudflare and GitHub.

LICENSE

@@ -0,0 +1,24 @@
+MIT License
+
+Copyright (c) 2026 JavaScript Cebu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+The MIT license covers code only. The JavaScript Cebu name, logos and brand
+assets are not open-licensed; see packages/brand/LICENSE.

README.md

@@ -0,0 +1,34 @@
+# jscebu.org
+
+The website and design system of [JavaScript Cebu](https://www.jscebu.org), live at <https://www.jscebu.org>.
+
+| Path | What it is |
+|---|---|
+| `packages/brand` | The JS Cebu design system: brand data, the generators for `tokens.css`, `brand.md` and `llms.txt`, logos, templates and an HTML checker for the brand's MUST rules |
+| `apps/website` | The Astro site: `/`, `/projects`, `/about`, `/links` and `/brand`. It deploys as the Cloudflare Worker `jscebu-org`, which serves www.jscebu.org |
+
+- Brand guidelines: <https://www.jscebu.org/brand/>
+- For AI agents: <https://www.jscebu.org/brand.md>
+- Design specs: [design system](docs/superpowers/specs/2026-10-27-jscebu-design-system-design.md) · [site v1](docs/superpowers/specs/2026-10-28-jscebu-site-v1-design.md)
+
+## How changes ship
+
+1. Intent
+2. Plan
+3. Approval
+4. Implementation
+5. Review
+6. Merge
+
+**Merging to `main` deploys to production automatically** through Cloudflare Workers Builds. See [CONTRIBUTING.md](CONTRIBUTING.md).
+
+## Develop
+
+```sh
+pnpm install
+pnpm test
+pnpm build                      # builds the site and runs the post-build checks
+pnpm --filter website dev       # local preview
+```
+
+Code is MIT-licensed ([LICENSE](LICENSE)). The JS Cebu name and logos are not; see [packages/brand/LICENSE](packages/brand/LICENSE).

apps/website/astro.config.mjs

@@ -0,0 +1,10 @@
+// @ts-check
+import { defineConfig } from 'astro/config';
+
+export default defineConfig({
+  site: 'https://www.jscebu.org',
+  output: 'static',
+  // Astro 7 defaults to 'jsx' whitespace handling, which can drop the space
+  // before the cursor's word wrapper. Plain collapsing keeps it.
+  compressHTML: true,
+});

apps/website/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "website",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "sync": "tsx scripts/sync-brand.ts",
+    "dev": "pnpm sync && astro dev",
+    "build": "pnpm sync && astro build && tsx scripts/check-dist.ts",
+    "preview": "astro preview",
+    "test": "vitest run"
+  },
+  "devDependencies": {
+    "linkedom": "~0.18.14",
+    "tsx": "^4.23.15",
+    "vitest": "^5.0.5",
+    "wrangler": "^4.153.0",
+    "yaml": "^2.9.1"
+  },
+  "dependencies": {
+    "@fontsource-variable/archivo": "^5.3.0",
+    "@fontsource-variable/inter-tight": "^5.3.0",
+    "@fontsource-variable/jetbrains-mono": "^5.3.0",
+    "@fontsource-variable/space-grotesk": "^5.3.0",
+    "@jscebu/brand": "workspace:*",
+    "astro": "~7.4.2"
+  }
+}

apps/website/public/_headers

@@ -0,0 +1,8 @@
+/brand.md
+  Content-Type: text/markdown; charset=utf-8
+  Access-Control-Allow-Origin: *
+/llms.txt
+  Content-Type: text/plain; charset=utf-8
+  Access-Control-Allow-Origin: *
+/brand/*
+  Access-Control-Allow-Origin: *

apps/website/public/_redirects

@@ -0,0 +1,13 @@
+# Old Notion-era jscebu.org URLs (spec: docs/superpowers/specs/2026-10-28-jscebu-site-v1-design.md §5).
+# Targets end in / because folders are served at /name/; a bare /name would redirect twice.
+/mission-vision /about/ 301
+/members /about/#organizers 301
+/iniatives /about/ 301
+/initiatives /about/ 301
+/official-links /links/ 301
+/community-projects /projects/ 301
+# Temporary: /events becomes a real page once events come from Cebby.
+/events /#events 302
+/promotional-materials /brand/ 301
+/annual-hacktoberfest https://hacktoberfest.jscebu.org/ 301
+/volunteers-training-workshop /about/ 301