Skip to content

Restyle aai init starter templates with the AssemblyAI brand system#52

Merged
alexkroman merged 8 commits into
mainfrom
feat/init-template-restyle
Jun 10, 2026
Merged

Restyle aai init starter templates with the AssemblyAI brand system#52
alexkroman merged 8 commits into
mainfrom
feat/init-template-restyle

Conversation

@alexkroman

Copy link
Copy Markdown
Collaborator

Restyles the three aai init starter apps with the AssemblyAI brand system and fixes a tab-radius detail. Split out of the in-progress aai api branch so it can ship on its own.

Changes

  • feat(init): restyle starter templates with the AssemblyAI brand system — refreshed HTML/CSS (and minor JS) for audio-transcription, live-captions, and voice-agent templates.
  • fix(init): use CTA radius on transcript tabs, not pill radius — corrects the transcript tab corner radius to the CTA token.

Scope

Touches only aai_cli/init/templates/** (HTML/CSS/JS for the three starters). No Python/runtime changes.

Verification

  • prettier --check "aai_cli/init/templates/**/*.{js,css}" — clean
  • pytest tests/test_init_template_contract.py — 42 passed

🤖 Generated with Claude Code

alexkroman-assembly and others added 4 commits June 9, 2026 17:01
Apply the AssemblyAI marketing design system to all three init
templates (audio-transcription, live-captions, voice-agent):

- Tokens: cobolt accent, warm black/white/neutral scales, 4px CTA /
  12px panel radii, brand spacing — replacing the grayscale oklch set.
- Type: Oceanic Text headings, UN 11ST body, Modern Gothic Mono
  eyebrows/CTAs/labels, hotlinked from assemblyai.com (CORS-open) with
  system fallbacks behind them.
- Chrome: AssemblyAI wordmark, mono eyebrow chip, slim footer.
- Components: cobolt CTAs, pill status/tabs (blush for errors, solid
  cobolt for done), black-500 active record/connect state, mono
  color-coded speaker/turn labels.
- Hierarchy: 48px serif title → 18px lead → 28px focal captions →
  24px card headings → 16px body → 12px mono labels.
- Copy: subtitles rewritten in the launch-blog voice (concrete opener,
  second person, em-dash asides), keeping the one-time-token note.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The audio-transcription template's filter tabs used the full pill radius,
which the brand design system reserves for tags/badges and explicitly
bars from CTA-like elements. Switch to --radius-cta (4px) so the tabs
match the documented button radius.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The pre-commit job installed deps with `pip install -e . --group dev`, so its
pytest hook ran against the newest PyPI releases instead of uv.lock. A newer
assemblyai (0.64.9 vs the locked 0.64.4) adds a SpeechModel value
(`u3-rt-pro-beta-1`), which changes `aai stream --help` and breaks the
byte-exact help snapshot — even though the locked check.sh jobs pass.

Run the hook via `uv run --frozen python -m pytest` and bootstrap uv +
`uv sync --frozen` in the CI job (same uv-from-PyPI pattern the check.sh job
already uses), so every test path resolves the lockfile versions.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Map the AssemblyAI marketing design system onto the CLI color scheme:

- Primary accent moves from the old blue (#2545D3) to Cobolt 400 (#614fd2),
  the terminal-legible mid step between the web primary (Cobolt 500) and the
  dark-mode primary (Cobolt 300); secondary accent (agent label, links) becomes
  the lighter Cobolt 300 (#887bdd).
- Errors use the design system's semantic red (#F04438).
- Typer's help palette (short switch, type metavar, usage line) is brought into
  the Cobolt family: flags/command names in bold Cobolt, metavar in lighter
  Cobolt, and the "Usage:" label/arg spec dropped to muted warm gray (#777673)
  so boilerplate recedes instead of shouting in yellow.

Speaker palette, success green, and warn yellow are left as-is: the brand has
no categorical multi-hue scale, and those status colors have no brand analog.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@alexkroman alexkroman force-pushed the feat/init-template-restyle branch from 7ded0e7 to 84858b6 Compare June 10, 2026 01:17
alexkroman-assembly and others added 4 commits June 9, 2026 18:23
Match check.sh's marker filter (`-m "not e2e and not install_script"`). The
install_script tests build a wheel and run install.sh / pip --user; under the
locked .venv the user-site install can't import aai_cli (ModuleNotFoundError).
They have dedicated "package install — real" CI jobs, so the quick pre-commit
gate shouldn't run them.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The two color-status tests asserted exact ANSI escapes, but Rich reads ambient
color env (NO_COLOR/COLORTERM/...) at render time. That global state leaked
across test collection, so a truecolor console could downsample to 16-color (or
vice versa) depending on what ran first — each test passed alone but they
interfered in the full suite. Pass _environ={} so the color depth is fixed by
color_system alone, and assert the resulting deterministic truecolor bytes.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Add two hermeticity guards beyond order-randomization:

- pytest-socket (--disable-socket) blocks real network in the unit suite, so
  an unmocked SDK/HTTP call fails loudly instead of silently hitting the API.
  The loopback-binding tests (OAuth callback server, find_free_port) opt back
  in with @pytest.mark.allow_hosts(["127.0.0.1"]) — never enable_socket, which
  would also unblock external hosts.
- An autouse pin_timezone fixture pins TZ to a fixed non-UTC zone so time
  rendering is deterministic across machines; time-machine is added for tests
  that need to freeze "now". The CLI is UTC-normalized, so this surfaced no
  failures — it guards against future naive-local-clock regressions.

e2e/install suites drive the CLI as a subprocess, so the in-process socket
patch never touches them. Full gate green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The suite-wide --disable-socket broke the `install`/`install_script` tests:
they probe PyPI in-process (urlopen https://pypi.org/simple/) to decide
whether to run or skip, which pytest-socket now denies — failing the
pre-commit pytest hook and the "package install — real" jobs.

Add a pytest_collection_modifyitems hook that auto-applies enable_socket to
any test marked e2e/install/install_script. Those markers already mean "this
suite needs the real network", so the carve-out is central and future-proof;
loopback-only unit tests keep the tighter allow_hosts(["127.0.0.1"]).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@alexkroman alexkroman merged commit 752146a into main Jun 10, 2026
11 checks passed
@alexkroman alexkroman deleted the feat/init-template-restyle branch June 10, 2026 02:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants