From 0e144b90fe8a9a6688763b565de11c4898ec283d Mon Sep 17 00:00:00 2001 From: bharvey88 <8107750+bharvey88@users.noreply.github.com> Date: Fri, 10 Jul 2026 12:59:13 -0500 Subject: [PATCH 1/2] Header/hero polish and fix the hidden theme toggle MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Fix the theme toggle: it was permanently hidden because theme.js set visibility='' (which clears the inline value and falls back to the CSS `visibility: hidden`) instead of 'visible'. Shipped broken in the dark-mode PR and never caught; add a test that the toggle is visible. - Nav: add a Forum link; point Discord at discord.apolloautomation.com. - Remove the footer blurb. - Hero: reword to the first-flash framing (devices update over Wi-Fi/OTA after setup, so the installer is for the first flash, not routine updates). - Hub card images: object-fit cover so cast-1 and msr-1 fill the card square like the square product shots (no effect on the already-square images). 🤖 Generated with [Claude Code](https://claude.com/claude-code) --- css/style.css | 2 +- index.html | 7 ++----- js/theme.js | 6 ++++-- js/views/hub.js | 3 +-- tests/installer.spec.js | 7 +++++++ 5 files changed, 15 insertions(+), 10 deletions(-) diff --git a/css/style.css b/css/style.css index 1879945..0a74571 100644 --- a/css/style.css +++ b/css/style.css @@ -73,7 +73,7 @@ main { max-width: 1080px; margin: 0 auto; padding: 32px 24px 64px; } padding: 14px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; } .device-card:hover { border-color: var(--blue); box-shadow: 0 4px 14px -8px rgba(65,122,171,.5); } -.device-card img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 6px; background: var(--img-bg); } +.device-card img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; background: var(--img-bg); } .device-card h3 { margin: 10px 0 2px; font-size: 1rem; } .device-card p { margin: 0; color: var(--dim); font-size: .82rem; } .device-card .go { color: var(--blue); font-weight: 600; font-size: .85rem; margin-top: 8px; display: inline-block; } diff --git a/index.html b/index.html index 40b9d65..36ec8ae 100644 --- a/index.html +++ b/index.html @@ -27,15 +27,12 @@

Loading devices…

- diff --git a/js/theme.js b/js/theme.js index c56e10a..356a8f8 100644 --- a/js/theme.js +++ b/js/theme.js @@ -57,7 +57,9 @@ export function initThemeToggle() { setPref(next); }); - // Initialise button state (makes it visible) + // Initialise button state and reveal it (CSS hides it until JS wires it up). + // Must be an explicit 'visible' — '' only clears the inline value and would + // fall back to the .theme-btn { visibility: hidden } rule, leaving it hidden. updateBtn(storedPref()); - btn.style.visibility = ''; + btn.style.visibility = 'visible'; } diff --git a/js/views/hub.js b/js/views/hub.js index 7b07e85..f3a4ae9 100644 --- a/js/views/hub.js +++ b/js/views/hub.js @@ -4,8 +4,7 @@ export function renderHub(el, registry) { el.innerHTML = `

Flash your Apollo device from the browser

-

Plug your device into USB, pick it below, and you'll be up and running in about two minutes. - Installing needs Chrome, Edge, or Firefox — other browsers get manual instructions.

+

Plug in your device via USB, choose your device below, and you'll be running the latest firmware in minutes!

diff --git a/tests/installer.spec.js b/tests/installer.spec.js index b182e3a..50f976e 100644 --- a/tests/installer.spec.js +++ b/tests/installer.spec.js @@ -11,6 +11,13 @@ test('hub renders a card for every registry device', async ({ page }) => { } }); +test('theme toggle is revealed once the script wires it up', async ({ page }) => { + await page.goto('/'); + // CSS hides .theme-btn until theme.js sets an explicit visibility; a regression + // to `visibility = ''` would fall back to the hidden rule and fail this. + await expect(page.locator('#theme-toggle')).toBeVisible(); +}); + test('category filter shows exactly the cards in that category', async ({ page }) => { await page.goto('/'); // Pick a category deterministically (most-populated, alphabetical tiebreak) From dda0b304cdfd6acedc28e70765e4dcac8f313e03 Mon Sep 17 00:00:00 2001 From: bharvey88 <8107750+bharvey88@users.noreply.github.com> Date: Fri, 10 Jul 2026 13:23:21 -0500 Subject: [PATCH 2/2] Use the Apollo dog mascot as the theme toggle icon MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Duplicates the wiki's annotation-marker technique: paint the full-colour dog PNG directly (no CSS mask/tint) instead of the emoji. On the dark header the dog's dark outline blends in, so give it the same white backing it already has on the white light-mode header. The button keeps cycling system/dark/light, with the state carried by aria-label/title. 🤖 Generated with [Claude Code](https://claude.com/claude-code) --- assets/brand/apollo-dog.png | Bin 0 -> 15995 bytes css/style.css | 11 ++++++++--- index.html | 2 +- js/theme.js | 3 +-- 4 files changed, 10 insertions(+), 6 deletions(-) create mode 100644 assets/brand/apollo-dog.png diff --git a/assets/brand/apollo-dog.png b/assets/brand/apollo-dog.png new file mode 100644 index 0000000000000000000000000000000000000000..7735bc637b777a869c5e3d8be356082b96f140cc GIT binary patch literal 15995 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 M;tFDQB8EZ#2LS(_HUIzs literal 0 HcmV?d00001 diff --git a/css/style.css b/css/style.css index 0a74571..a8d652e 100644 --- a/css/style.css +++ b/css/style.css @@ -50,10 +50,15 @@ summary:focus-visible { .site-header nav { display: flex; gap: 18px; align-items: center; } .site-header nav a { color: var(--dim); text-decoration: none; } .theme-btn { - background: none; border: none; cursor: pointer; color: var(--dim); - font-size: 1rem; padding: 0; line-height: 1; visibility: hidden; + width: 26px; height: 26px; border: none; padding: 0; cursor: pointer; + /* Apollo dog mascot, painted full-colour (not tinted) like the wiki annotation marker. */ + background: url("../assets/brand/apollo-dog.png") center / contain no-repeat; + visibility: hidden; /* revealed by theme.js once wired up */ } -.theme-btn:hover { color: var(--ink); } +.theme-btn:hover { opacity: .75; } +/* On the dark header the dog's dark outline vanishes; give it the same white + backing it already has on the (white) light-mode header so it stays legible. */ +[data-theme="dark"] .theme-btn { background-color: #fff; border-radius: 6px; } main { max-width: 1080px; margin: 0 auto; padding: 32px 24px 64px; } .site-footer { text-align: center; color: var(--dim); font-size: .85rem; padding: 24px; border-top: 1px solid var(--line); } .loading { color: var(--dim); } diff --git a/index.html b/index.html index 36ec8ae..42bfe40 100644 --- a/index.html +++ b/index.html @@ -29,7 +29,7 @@ Shop Discord Forum - +

Loading devices…

diff --git a/js/theme.js b/js/theme.js index 356a8f8..8260130 100644 --- a/js/theme.js +++ b/js/theme.js @@ -1,6 +1,5 @@ // js/theme.js — theme toggle: System / Dark / Light (cycles on click) const THEMES = ['system', 'dark', 'light']; -const ICONS = { system: '⬤', dark: '🌙', light: '☀' }; const LABELS = { system: 'System theme', dark: 'Dark theme', light: 'Light theme' }; const NEXT_LABEL = { system: 'Switch to dark theme', @@ -35,7 +34,7 @@ export function initThemeToggle() { const mq = matchMedia('(prefers-color-scheme: dark)'); function updateBtn(pref) { - btn.textContent = ICONS[pref]; + // The icon is the Apollo dog (a CSS background); only the labels track state. btn.setAttribute('aria-label', LABELS[pref]); btn.title = NEXT_LABEL[pref]; }