@jamunlabs/gameu-shell-v1

Shell stylesheets for the gameu platform.

This package ships two CSS files that style the gameu platform's two main shell surfaces:

• src/lobby.css — TV lobby chrome (page grid, QR card, peer strip, game-tile carousel, tile state badges, TV toasts).
• src/controller.css — V2 phone-controller chrome (page-init reset, halftone body bg, gesture-pad surface, status banner, root layout).

They live together because the design is one design — same palette, same fonts, same lightning-bolt corner accents, same halftone background. A redesign of "the gameu look" almost always touches both files; keeping them in one repo dir + one publish cycle removes friction.

This package does not ship design tokens or universal primitives — those live in @jamunlabs/gameu-sdk's gameu-theme-v1.css. The token CSS file (--gameu-navy, --gameu-yellow, fonts, …) must be loaded first; this package's classes reference those custom properties and will render unstyled without them.

Usage

The TV lobby loads only lobby.css:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@jamunlabs/gameu-sdk@latest/src/gameu-theme-v1.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@jamunlabs/gameu-shell-v1@latest/src/lobby.css">

The phone controller loads only controller.css:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@jamunlabs/gameu-sdk@latest/src/gameu-theme-v1.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@jamunlabs/gameu-shell-v1@latest/src/controller.css">

Or via the exports map:

import "@jamunlabs/gameu-shell-v1/lobby";       // = src/lobby.css
import "@jamunlabs/gameu-shell-v1/controller";  // = src/controller.css

The gameu host serves both files locally for production deployments:

<link rel="stylesheet" href="/lib/gameu-theme-v1.css">
<link rel="stylesheet" href="/lib/lobby-v1.css">       <!-- TV lobby -->
<link rel="stylesheet" href="/lib/controller-v1.css">  <!-- phone controller -->

The /lib/ URLs intentionally use the -v1 major-version suffix matching the package name, so a future breaking redesign can ship at /lib/lobby-v2.css / /lib/controller-v2.css from a sibling gameu-shell-v2 package side-by-side.

Why one package?

Earlier this work was split across two packages (@jamunlabs/gameu-lobby-css-v1 and @jamunlabs/gameu-controller-css-v1 — both deprecated; do not use). They were merged because:

• The design is one design. Edits to "the gameu look" rarely touch only one surface — they touch both. Keeping the stylesheets side-by-side means a designer sees the full visual language in one repo dir.
• Two-package version coordination ("which one do I bump first?") was friction without benefit. One publish cycle, one source of truth.
• File layout still lets consumers <link> only what they need (TV-only kiosk loads only lobby.css; phone-only loads only controller.css).

Versioning

The major version is in the package name (-v1) so a future breaking redesign can ship as @jamunlabs/gameu-shell-v2 side-by- side, letting consumers migrate at their own pace. Within -v1, semver applies (patch = bug fix, minor = new classes, major rename → consider whether you actually want a new -v2 package).

Per the in-tree CI gate, any PR that touches either file in packages/gameu-shell/src/ must also bump package.json#version. This keeps jsdelivr's @latest cache flips meaningful.

Contributing

See CONTRIBUTING.md.