feat: Deep Space design language rebrand with Constellation Vinyl logo by SimplicityGuy · Pull Request #295 · SimplicityGuy/discogsography

SimplicityGuy · 2026-04-12T02:23:12Z

Summary

Full visual rebrand of explore and dashboard services with "Deep Space + Purple" design language — dark-mode-forward UI with cyan (#00bcd4) primary and purple (#7c4dff) secondary accents
Constellation Vinyl logo generated programmatically via Python/Pillow — vinyl record with network graph nodes scattered like a star map, connected by luminous cyan/purple lines
Complete brand asset set (38 files): banner, square, icon in dark+light variants, OG image, design showcase, favicon set (16-512px PNGs + .ico + apple-touch-icon), web manifest
Theme toggle removed — single dark theme replaces the light/dark/auto toggle across both services
Space Grotesk font added for wordmark typography with "the choon network" tagline in navbars
Graph node colors harmonized with new palette (Artist #00e676, Release #ff5c8a, Label #78909c, Genre #ffd54f, Category #40c4ff)

Changes

New files

scripts/generate_brand_assets.py — Renders all logo variants, favicons, OG image, and design showcase
static/fonts/SpaceGrotesk-*.ttf — Font files for wordmark rendering
explore/static/brand/* — 19 generated brand assets
dashboard/static/brand/* — 19 generated brand assets (independent copy)
docs/superpowers/specs/2026-04-11-design-language-rebrand-design.md — Design specification
docs/superpowers/plans/2026-04-11-design-language-rebrand.md — Implementation plan

Modified files

explore/static/css/styles.css — Deep Space CSS variables, removed light theme and .dark override
explore/static/index.html — New logo, favicons, Space Grotesk font, OG meta, removed theme toggle
explore/tailwind.config.js + tailwind.input.css — Cyan/purple color tokens
dashboard/static/index.html — Same rebrand treatment
dashboard/static/admin.html — Same rebrand treatment
dashboard/static/dashboard.js — Removed initializeThemeToggle()
dashboard/static/admin.js — Removed initTheme()
dashboard/tailwind.config.js — Removed darkMode: "class"

Test plan

174 dashboard unit tests pass (non-UI)
Visual verification of explore service at localhost:8006
Visual verification of dashboard at localhost:8003
Visual verification of admin panel
Favicon appears correctly in browser tab
OG image renders when sharing links
Brand assets render correctly: open explore/static/brand/banner_dark.png

🤖 Generated with Claude Code

Complete design language spec for Deep Space + Purple rebrand covering color system, typography, logo concept (Constellation Vinyl), favicon set, component styles, harmonized graph node colors, and implementation scope across explore and dashboard services. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Add light-background logo variants, individual favicon PNGs at all sizes, OG image for social sharing, and design showcase image. Update HTML integration to include OG meta tags and granular favicon links. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

13-task plan covering brand asset generation (Pillow), CSS rebrand, Tailwind config updates, HTML logo/favicon integration, theme toggle removal, and visual verification across explore and dashboard services. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Adds scripts/generate_brand_assets.py with the full "Constellation Vinyl" renderer — vinyl icon mark with network graph star map, banners, squares, OG image (1200x630), design showcase (1600x900), favicons in all sizes, and site.webmanifest. Also adds scripts/*.py to ruff per-file-ignores for T201/S108 (CLI print output and tempfile usage). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Adds all brand assets to explore/static/brand/ and dashboard/static/brand/: icon_dark/light.png (1024x1024), banner_dark/light.png (1600x400), square_dark/light.png (1024x1024), og_image.png (1200x630), design_showcase.png (1600x900), favicon-{16,32,48,64,128,192,256,512}.png, apple-touch-icon.png (180x180), favicon.ico, and site.webmanifest. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Replaces dual light/dark theme variables with a single Deep Space dark theme using cyan (#00bcd4) primary and purple (#7c4dff) secondary accents. Removes the .dark class override block entirely. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…lette Removes darkMode class toggle from Tailwind config, adds new Deep Space color tokens (cyan-500, cyan-glow, purple-500, purple-300), and updates button/form/spinner components to use cyan primary and purple secondary. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…oggle Adds Space Grotesk font, favicon/OG meta tags, replaces CSS logo construction with icon_dark.png, updates title to use Space Grotesk with tagline, removes theme toggle button and initialization script, hardcodes dark class on html element, and sets body background color. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…ggle

codecov · 2026-04-12T02:29:10Z

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Self-contained HTML showcase for the Deep Space + Purple design language covering color palette, typography, buttons, status badges, cards, graph nodes, tabs, inputs, and all brand logo/favicon variants. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

The h1 changed from "Discogsography Infrastructure" to the branded "discogsography / the choon network" layout — use contain_text to match the new heading content. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

github-actions · 2026-04-12T02:52:19Z

E2E Coverage (webkit)

Totals
Statements:	47.64% ( 1241 / 2605 )
Lines:	47.64% ( 1241 / 2605 )

github-actions · 2026-04-12T02:52:52Z

E2E Coverage (chromium)

Totals
Statements:	47.64% ( 1241 / 2605 )
Lines:	47.64% ( 1241 / 2605 )

github-actions · 2026-04-12T02:52:57Z

E2E Coverage (firefox)

Totals
Statements:	47.64% ( 1241 / 2605 )
Lines:	47.64% ( 1241 / 2605 )

github-actions · 2026-04-12T02:54:13Z

E2E Coverage (webkit - iPhone 15)

Totals
Statements:	47.64% ( 1241 / 2605 )
Lines:	47.64% ( 1241 / 2605 )

github-actions · 2026-04-12T02:54:58Z

E2E Coverage (webkit - iPad Pro 11)

Totals
Statements:	47.64% ( 1241 / 2605 )
Lines:	47.64% ( 1241 / 2605 )

StaticFiles is mounted at `/` in dashboard and explore, so references to `/static/brand/...` resolved to a non-existent nested directory — logos and favicons were broken throughout the rebrand added in PR #295. Fixed in admin.html, index.html, and both site.webmanifest files. Account Settings pane was constrained to 42rem and centered, ignoring most of the viewport. Removed the max-width cap and wrapped cards in a responsive grid that tiles to fit available width. The 2FA setup QR code rendered as a blank white square because the client read `provisioning_uri` while the API returns `otpauth_uri`. QRCode library received `undefined` and drew an empty canvas. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

…QR (#296) StaticFiles is mounted at `/` in dashboard and explore, so references to `/static/brand/...` resolved to a non-existent nested directory — logos and favicons were broken throughout the rebrand added in PR #295. Fixed in admin.html, index.html, and both site.webmanifest files. Account Settings pane was constrained to 42rem and centered, ignoring most of the viewport. Removed the max-width cap and wrapped cards in a responsive grid that tiles to fit available width. The 2FA setup QR code rendered as a blank white square because the client read `provisioning_uri` while the API returns `otpauth_uri`. QRCode library received `undefined` and drew an empty canvas. Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

SimplicityGuy and others added 15 commits April 11, 2026 18:37

chore: add Pillow dev dependency and Space Grotesk font files

94c180d

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat: replace dashboard CSS variables with Deep Space palette

ef68c2d

feat: update dashboard index with new logo, favicons, remove theme to…

166d9bf

…ggle

feat: update dashboard admin with new logo, favicons, remove theme to…

21d3035

…ggle

feat: remove theme toggle logic from dashboard JavaScript

477545f

feat: update dashboard Tailwind config, remove dark mode toggle

b4fca71

Merge branch 'main' into worktree-design-language

2cbd446

SimplicityGuy and others added 3 commits April 11, 2026 19:39

docs: add DESIGN_SYSTEM.md design language reference

1f22744

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

SimplicityGuy merged commit 881bdd5 into main Apr 12, 2026
44 checks passed

SimplicityGuy deleted the worktree-design-language branch April 12, 2026 02:53

SimplicityGuy mentioned this pull request Apr 12, 2026

fix: broken /static/brand/ paths, narrow account settings, blank 2FA QR #296

Merged

5 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: Deep Space design language rebrand with Constellation Vinyl logo#295

feat: Deep Space design language rebrand with Constellation Vinyl logo#295
SimplicityGuy merged 18 commits intomainfrom
worktree-design-language

SimplicityGuy commented Apr 12, 2026

Uh oh!

codecov bot commented Apr 12, 2026

Uh oh!

github-actions bot commented Apr 12, 2026

Uh oh!

github-actions bot commented Apr 12, 2026

Uh oh!

github-actions bot commented Apr 12, 2026

Uh oh!

Uh oh!

github-actions bot commented Apr 12, 2026

Uh oh!

github-actions bot commented Apr 12, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

SimplicityGuy commented Apr 12, 2026

Summary

Changes

New files

Modified files

Test plan

Uh oh!

codecov bot commented Apr 12, 2026

Codecov Report

Uh oh!

github-actions bot commented Apr 12, 2026

E2E Coverage (webkit)

Uh oh!

github-actions bot commented Apr 12, 2026

E2E Coverage (chromium)

Uh oh!

github-actions bot commented Apr 12, 2026

E2E Coverage (firefox)

Uh oh!

Uh oh!

github-actions bot commented Apr 12, 2026

E2E Coverage (webkit - iPhone 15)

Uh oh!

github-actions bot commented Apr 12, 2026

E2E Coverage (webkit - iPad Pro 11)

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant