Add web editor and updated badger website - #22
Open
crnicholson wants to merge 4 commits into
Open
Conversation
There was a problem hiding this comment.
🟡 Changes recommended
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
This PR expands the Badger website with in-browser badge editing tools (USB/disk + Web Bluetooth), adds a feature-gated apps catalog/detail experience, and continues the “dark hacker” UI refresh across shared components, pages, and content. It also vendors a large set of Impeccable automation scripts/config under .github/.
Changes:
- Add
/editand/edit/bluetootheditor entrypoints plus/contacts, including a legacy redirect page. - Add feature flags and new apps catalog routes, plus GitHub tree fetching utilities used for app counts / installable app discovery.
- Refresh shared UI building blocks (surface/card/button/hero/footer) and simplify a number of hack/app MDX descriptions and headings.
File summaries
| File | Description |
|---|---|
| src/pages/hack/[slug].astro | Adjust hack detail page hero styling for the updated dark UI. |
| src/pages/get-started.astro | Simplify “Get Started” task model and redesign task cards/steps layout. |
| src/pages/edit/contacts.astro | Add client-side redirect from legacy /edit/contacts to /contacts. |
| src/pages/edit/bluetooth.astro | Add Bluetooth editor page wrapper (Layout + tools + React editor). |
| src/pages/edit.astro | Add main editor page wrapper (Layout + tools + badge manager). |
| src/pages/contacts.astro | Add contacts editor page wrapper (Layout + React editor). |
| src/pages/apps/[...catalog].astro | Add feature-gated apps catalog page and sections for built-in/loadable apps. |
| src/pages/app/[slug].astro | Update app detail page styling and add feature-flag-aware back navigation. |
| src/lib/github-app-catalog.ts | Add GitHub tree parsing + fetch helper for installable app folders. |
| src/lib/badge-bluetooth.ts | Add framing utilities for BLE messaging + notification decoding helpers. |
| src/layouts/Layout.astro | Remove Astro ViewTransitions usage from the base layout. |
| src/content/hacks/snake-install.mdx | Simplify hack description and remove redundant H1 intro block. |
| src/content/hacks/octocanvas-wallpaper.mdx | Simplify hack description and remove redundant H1 intro block. |
| src/content/hacks/menu-pagination.mdx | Simplify hack description and rename “What Changed” → “Implementation”. |
| src/content/hacks/gallery-import-image.mdx | Simplify hack description and rename “What the App Looks For” → “Files”. |
| src/content/hacks/commits-game.mdx | Simplify hack description and rename section to “Implementation”. |
| src/content/hacks/battery-percentage.mdx | Simplify hack description and remove redundant H1 intro block. |
| src/content/hacks/badge-custom-username.mdx | Simplify hack description and rename “What the Badge Checks” → “Validation”. |
| src/content/apps/snake.mdx | Simplify app description and remove redundant H1 intro block. |
| src/content/apps/monaquest.mdx | Heavily condense app page copy; add controls/files/source sections. |
| src/content/apps/commits.mdx | Simplify app description and remove redundant H1 intro block. |
| src/content/apps/badge.mdx | Heavily condense app page copy; tighten config + files + source sections. |
| src/config/features.ts | Add feature flags for app catalog/detail links and serial connection mode. |
| src/components/ui/card.tsx | Switch Card styling to shared surface classes; adjust header/title/desc styles. |
| src/components/ui/button.tsx | Update button base/variants/sizes to match refreshed styling. |
| src/components/outlined-button.tsx | Add “subtle” variant and update border/hover behavior. |
| src/components/listing-hero.astro | Redesign hero layout; remove eyebrow support; simplify actions rendering. |
| src/components/hack-list-item.tsx | Update list item styling to use surface patterns. |
| src/components/hack-card.tsx | Update hack card styling to use surface patterns and simplify footer content. |
| src/components/github-repo-badge.tsx | Add localStorage caching + refine rendering/layout and display repo string. |
| src/components/Footer.astro | Redesign footer content structure; add feature-flag-aware apps link. |
| src/components/editor-tools.astro | Add editor-mode navigation (USB/disk vs Bluetooth). |
| src/components/contribute-card.tsx | Remove ContributeCard component. |
| src/components/app-count.tsx | Add client component to fetch and display installable app count with fallback. |
| src/components/app-card.tsx | Feature-flag app detail navigation; update visuals to surface styling. |
| .github/skills/impeccable/scripts/surface-brief.mjs | Add CLI for reading/writing/listing surface briefs. |
| .github/skills/impeccable/scripts/live/source-search.mjs | Add shared project source search walker for live mode. |
| .github/skills/impeccable/scripts/live/source-lock.mjs | Add file-level locking to protect concurrent live-mode writes. |
| .github/skills/impeccable/scripts/live/poll-lanes.mjs | Add event prioritization helpers for live poll selection. |
| .github/skills/impeccable/scripts/live/manual-edits-buffer.mjs | Add durable buffer helpers for pending manual edits. |
| .github/skills/impeccable/scripts/live/frameworks/vite-generic.mjs | Add Vite framework registry entry for live injection. |
| .github/skills/impeccable/scripts/live/frameworks/tanstack-start.mjs | Add TanStack Start framework registry entry for live injection. |
| .github/skills/impeccable/scripts/live/frameworks/sveltekit.mjs | Add SvelteKit framework registry entry for live injection. |
| .github/skills/impeccable/scripts/live/frameworks/static-html.mjs | Add static HTML fallback framework registry entry. |
| .github/skills/impeccable/scripts/live/frameworks/script-src.mjs | Centralize live script src URL construction. |
| .github/skills/impeccable/scripts/live/frameworks/nextjs.mjs | Add Next.js framework registry entry for live injection. |
| .github/skills/impeccable/scripts/live/frameworks/detect-utils.mjs | Add shared detection utilities for framework registry entries. |
| .github/skills/impeccable/scripts/live/frameworks/astro.mjs | Add Astro framework registry entry with Astro-specific injection details. |
| .github/skills/impeccable/scripts/live/completion.mjs | Add completion typing helpers for accept/discard flows. |
| .github/skills/impeccable/scripts/live/browser-script-parts.mjs | Add helpers to assemble multi-part browser-side live scripts. |
| .github/skills/impeccable/scripts/live/accept-verify.mjs | Add scanner to detect live-mode leftovers after accept/carbonize. |
| .github/skills/impeccable/scripts/live-target.mjs | Add live target resolution helper (cwd/targetPath/projectRoot). |
| .github/skills/impeccable/scripts/live-status.mjs | Add CLI to print durable live-session recovery status. |
| .github/skills/impeccable/scripts/live-discard-manual-edits.mjs | Add CLI to discard pending manual edits from the buffer. |
| .github/skills/impeccable/scripts/live-complete.mjs | Add canonical durable completion acknowledgement CLI for live sessions. |
| .github/skills/impeccable/scripts/live-browser-session.js | Add browser-side session persistence helpers for live mode. |
| .github/skills/impeccable/scripts/live-browser-dom.js | Add browser-side DOM helper utilities for live overlay. |
| .github/skills/impeccable/scripts/lib/template-extensions.mjs | Add unified “template extension” resolution for live wrap/accept. |
| .github/skills/impeccable/scripts/lib/target-slug.mjs | Add stable slug derivation for file/URL targets. |
| .github/skills/impeccable/scripts/lib/target-args.mjs | Add CLI arg parsing for --target path handling. |
| .github/skills/impeccable/scripts/lib/provider.mjs | Add provider constants (command prefix/id) for build-time replacement. |
| .github/skills/impeccable/scripts/lib/is-generated.mjs | Add generated-file detection (gitignore + header scan). |
| .github/skills/impeccable/scripts/lib/impeccable-paths.mjs | Add central path helpers for Impeccable dirs, live sessions, server info, etc. |
| .github/skills/impeccable/scripts/lib/artifact-schema.mjs | Add artifact schema versioning + product stamp read/write helpers. |
| .github/skills/impeccable/scripts/hook.mjs | Add hook entrypoint for PostToolUse/Stop design checks. |
| .github/skills/impeccable/scripts/detector/shared/page.mjs | Add helper to detect “full page” HTML content. |
| .github/skills/impeccable/scripts/detector/shared/fonts.mjs | Add Google Fonts family extraction helpers. |
| .github/skills/impeccable/scripts/detector/shared/constants.mjs | Add shared constants (safe tags, font sets, WCAG thresholds, etc.). |
| .github/skills/impeccable/scripts/detector/profile/profiler.mjs | Add profiling utilities for detector phases/rules. |
| .github/skills/impeccable/scripts/detector/findings.mjs | Add finding construction helper bound to antipattern registry. |
| .github/skills/impeccable/scripts/detector/detect-antipatterns.mjs | Add detector CLI façade + exports for engines/registry. |
| .github/skills/impeccable/scripts/detect.mjs | Add detector entry script that resolves bundled detector path. |
| .github/skills/impeccable/reference/typeset.md | Add typography guidance reference for Impeccable flows. |
| .github/skills/impeccable/reference/shape.md | Add “shape” (discovery/briefing) reference guidance. |
| .github/skills/impeccable/reference/routing.md | Add no-argument routing guidance for /impeccable. |
| .github/skills/impeccable/reference/quieter.md | Add guidance for reducing visual intensity. |
| .github/skills/impeccable/reference/polish.md | Add guidance for polishing and verification. |
| .github/skills/impeccable/reference/operate.md | Add Operate-mode UI depth guidance. |
| .github/skills/impeccable/reference/layout.md | Add layout assessment + mechanical scan guidance. |
| .github/skills/impeccable/reference/ios.md | Add iOS platform guidance reference. |
| .github/skills/impeccable/reference/extract.md | Add extraction/consolidation guidance reference. |
| .github/skills/impeccable/reference/doctor.md | Add Impeccable artifact drift repair guidance reference. |
| .github/skills/impeccable/reference/distill.md | Add simplification guidance reference. |
| .github/skills/impeccable/reference/delight.md | Add delight guidance reference. |
| .github/skills/impeccable/reference/degraded/manual-edit-applier.md | Add degraded-mode manual edit applier reference. |
| .github/skills/impeccable/reference/degraded/documenter.md | Add degraded-mode design system documenter reference. |
| .github/skills/impeccable/reference/craft.md | Add deprecated craft alias reference. |
| .github/skills/impeccable/reference/craft-floor.md | Add craft-floor checklist reference. |
| .github/skills/impeccable/reference/colorize.md | Add color strategy guidance reference. |
| .github/skills/impeccable/reference/clarify.md | Add copy clarity guidance reference. |
| .github/skills/impeccable/reference/bolder.md | Add amplification guidance reference. |
| .github/skills/impeccable/reference/animate.md | Add motion/animation guidance reference. |
| .github/skills/impeccable/reference/android.md | Add Android platform guidance reference. |
| .github/skills/impeccable/reference/adapt.native.md | Add native adaptation guidance reference. |
| .github/hooks/impeccable.json | Add GitHub hook configuration to run Impeccable hook scripts. |
| .github/agents/impeccable-manual-edit-applier.agent.md | Add agent definition for applying live manual edit batches. |
| .github/agents/impeccable-finish-reviewer.agent.md | Add agent definition for finish review against direction/comp/quality bar. |
| .github/agents/impeccable-documenter.agent.md | Add agent definition for writing DESIGN.md from shipped artifacts. |
Review details
- Files reviewed: 75/202 changed files
- Comments generated: 5
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
|
|
||
| return ( | ||
| <a | ||
| href={href} | ||
| className={`inline-flex items-center gap-2.5 px-5 py-3 h-12 rounded-lg font-mono text-base uppercase tracking-[0.12em] bg-transparent hover:bg-primary/5 transition-all duration-150 ${className}`} | ||
| className={`inline-flex items-center font-mono uppercase tracking-[0.12em] transition-all duration-150 ${subtle ? 'h-10 gap-2 rounded-md bg-primary/5 px-4 py-2 text-xs text-primary hover:bg-primary/10' : 'h-12 gap-2.5 rounded-lg bg-transparent px-5 py-3 text-base hover:bg-primary/5'} ${className}`} |
Comment on lines
29
to
32
| <div | ||
| className="group p-5 rounded-lg border border-border/40 hover:border-primary/60 hover:shadow-[0_0_20px_rgba(95,237,131,0.2)] transition-all duration-200 cursor-pointer bg-card/30" | ||
| className="surface surface-hover group cursor-pointer p-5" | ||
| onClick={handleClick} | ||
| > |
Comment on lines
33
to
36
| <Card | ||
| className="group overflow-hidden transition-all duration-200 cursor-pointer border-border/40 hover:border-primary/60 hover:shadow-[0_0_30px_rgba(95,237,131,0.3)]" | ||
| className="surface surface-hover group cursor-pointer overflow-hidden" | ||
| onClick={handleCardClick} | ||
| > |
| <span>{action.label}</span> | ||
| </a> | ||
| </Button> | ||
| <a href={action.href} target={action.external ? '_blank' : undefined} rel={action.external ? 'noreferrer noopener' : undefined} class="inline-flex h-11 items-center gap-2 rounded-md bg-primary px-5 font-mono text-sm text-primary-foreground transition-colors hover:bg-primary/85"> |
Comment on lines
+59
to
62
| <div | ||
| className={`surface flex items-start gap-4 p-4 ${APP_DETAIL_LINKS_ENABLED ? 'surface-hover group cursor-pointer' : ''}`} | ||
| onClick={APP_DETAIL_LINKS_ENABLED ? handleCardClick : undefined} | ||
| > |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.