diff --git a/README.md b/README.md index 2296d01..c7e0f6e 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@
-Vocalinux +Vocalinux # Vocalinux @@ -93,21 +93,21 @@ Vocalinux in action. Settings gallery shots may lag the searchable sidebar UI fr @@ -118,29 +118,29 @@ Vocalinux in action. Settings gallery shots may lag the searchable sidebar UI fr
- Transcription in Action
+ Transcription in Action
Real-time voice-to-text transcription 		- System Tray
+ System Tray
System tray with listening indicator
- About View
+ About View
About & Updates in Settings 		- Log Viewer
+ Log Viewer
Log viewer for debugging
diff --git a/resources/screenshots/0.5.0-beta-demo.webm b/resources/screenshots/0.5.0-beta-demo.webm deleted file mode 100644 index 4c2e4ba..0000000 Binary files a/resources/screenshots/0.5.0-beta-demo.webm and /dev/null differ diff --git a/resources/screenshots/02-system-tray.png b/resources/screenshots/02-system-tray.png deleted file mode 100644 index 12dcdda..0000000 Binary files a/resources/screenshots/02-system-tray.png and /dev/null differ diff --git a/resources/screenshots/03-log-viewer.png b/resources/screenshots/03-log-viewer.png deleted file mode 100644 index 85e95c7..0000000 Binary files a/resources/screenshots/03-log-viewer.png and /dev/null differ diff --git a/resources/screenshots/05-about-view.png b/resources/screenshots/05-about-view.png deleted file mode 100644 index e2531f5..0000000 Binary files a/resources/screenshots/05-about-view.png and /dev/null differ diff --git a/resources/screenshots/about-updates/about-nightly-up-to-date.png b/resources/screenshots/about-updates/about-nightly-up-to-date.png deleted file mode 100644 index 51927f1..0000000 Binary files a/resources/screenshots/about-updates/about-nightly-up-to-date.png and /dev/null differ diff --git a/resources/screenshots/about-updates/about-nightly-update-available.png b/resources/screenshots/about-updates/about-nightly-update-available.png deleted file mode 100644 index b277cea..0000000 Binary files a/resources/screenshots/about-updates/about-nightly-update-available.png and /dev/null differ diff --git a/resources/screenshots/about-updates/about-stable-up-to-date.png b/resources/screenshots/about-updates/about-stable-up-to-date.png deleted file mode 100644 index 3da47e8..0000000 Binary files a/resources/screenshots/about-updates/about-stable-up-to-date.png and /dev/null differ diff --git a/resources/screenshots/about-updates/about-stable-update-available.png b/resources/screenshots/about-updates/about-stable-update-available.png deleted file mode 100644 index 4ecae8e..0000000 Binary files a/resources/screenshots/about-updates/about-stable-update-available.png and /dev/null differ diff --git a/resources/screenshots/about-updates/about-update-states-grid.png b/resources/screenshots/about-updates/about-update-states-grid.png deleted file mode 100644 index 04af2c3..0000000 Binary files a/resources/screenshots/about-updates/about-update-states-grid.png and /dev/null differ diff --git a/resources/screenshots/settings-advanced.png b/resources/screenshots/settings-advanced.png deleted file mode 100644 index cfee7f2..0000000 Binary files a/resources/screenshots/settings-advanced.png and /dev/null differ diff --git a/resources/screenshots/settings-audio.png b/resources/screenshots/settings-audio.png deleted file mode 100644 index 8329c85..0000000 Binary files a/resources/screenshots/settings-audio.png and /dev/null differ diff --git a/resources/screenshots/settings-general.png b/resources/screenshots/settings-general.png deleted file mode 100644 index 07d4bee..0000000 Binary files a/resources/screenshots/settings-general.png and /dev/null differ diff --git a/resources/screenshots/settings-recognition.png b/resources/screenshots/settings-recognition.png deleted file mode 100644 index 95c3038..0000000 Binary files a/resources/screenshots/settings-recognition.png and /dev/null differ diff --git a/resources/screenshots/settings-shortcuts.png b/resources/screenshots/settings-shortcuts.png deleted file mode 100644 index 7bf3eb1..0000000 Binary files a/resources/screenshots/settings-shortcuts.png and /dev/null differ diff --git a/resources/screenshots/settings-speech-engine.png b/resources/screenshots/settings-speech-engine.png deleted file mode 100644 index 2605ec0..0000000 Binary files a/resources/screenshots/settings-speech-engine.png and /dev/null differ diff --git a/web/public/screenshots/00-transcription.png b/web/public/screenshots/00-transcription.png index 9f53501..a77448b 100644 Binary files a/web/public/screenshots/00-transcription.png and b/web/public/screenshots/00-transcription.png differ diff --git a/web/public/screenshots/02-system-tray.png b/web/public/screenshots/02-system-tray.png index 12dcdda..509160b 100644 Binary files a/web/public/screenshots/02-system-tray.png and b/web/public/screenshots/02-system-tray.png differ diff --git a/web/public/screenshots/03-log-viewer.png b/web/public/screenshots/03-log-viewer.png index 85e95c7..7dde405 100644 Binary files a/web/public/screenshots/03-log-viewer.png and b/web/public/screenshots/03-log-viewer.png differ diff --git a/web/public/screenshots/05-about-view.png b/web/public/screenshots/05-about-view.png index e2531f5..f81a4b1 100644 Binary files a/web/public/screenshots/05-about-view.png and b/web/public/screenshots/05-about-view.png differ diff --git a/resources/screenshots/00-transcription.png b/web/public/screenshots/dark/00-transcription.png similarity index 100% rename from resources/screenshots/00-transcription.png rename to web/public/screenshots/dark/00-transcription.png diff --git a/web/public/screenshots/dark/02-system-tray.png b/web/public/screenshots/dark/02-system-tray.png new file mode 100644 index 0000000..31a24e3 Binary files /dev/null and b/web/public/screenshots/dark/02-system-tray.png differ diff --git a/web/public/screenshots/dark/03-log-viewer.png b/web/public/screenshots/dark/03-log-viewer.png new file mode 100644 index 0000000..9e6bee2 Binary files /dev/null and b/web/public/screenshots/dark/03-log-viewer.png differ diff --git a/web/public/screenshots/dark/05-about-view.png b/web/public/screenshots/dark/05-about-view.png new file mode 100644 index 0000000..76acc60 Binary files /dev/null and b/web/public/screenshots/dark/05-about-view.png differ diff --git a/web/public/screenshots/dark/settings-advanced.png b/web/public/screenshots/dark/settings-advanced.png new file mode 100644 index 0000000..1e935a4 Binary files /dev/null and b/web/public/screenshots/dark/settings-advanced.png differ diff --git a/web/public/screenshots/dark/settings-audio.png b/web/public/screenshots/dark/settings-audio.png new file mode 100644 index 0000000..511b15b Binary files /dev/null and b/web/public/screenshots/dark/settings-audio.png differ diff --git a/web/public/screenshots/dark/settings-general.png b/web/public/screenshots/dark/settings-general.png new file mode 100644 index 0000000..ec206bc Binary files /dev/null and b/web/public/screenshots/dark/settings-general.png differ diff --git a/web/public/screenshots/dark/settings-performance.png b/web/public/screenshots/dark/settings-performance.png new file mode 100644 index 0000000..dbb2721 Binary files /dev/null and b/web/public/screenshots/dark/settings-performance.png differ diff --git a/web/public/screenshots/dark/settings-recognition.png b/web/public/screenshots/dark/settings-recognition.png new file mode 100644 index 0000000..fbfbc59 Binary files /dev/null and b/web/public/screenshots/dark/settings-recognition.png differ diff --git a/web/public/screenshots/dark/settings-speech-engine.png b/web/public/screenshots/dark/settings-speech-engine.png new file mode 100644 index 0000000..3a42957 Binary files /dev/null and b/web/public/screenshots/dark/settings-speech-engine.png differ diff --git a/web/public/screenshots/settings-advanced.png b/web/public/screenshots/settings-advanced.png index cfee7f2..5063617 100644 Binary files a/web/public/screenshots/settings-advanced.png and b/web/public/screenshots/settings-advanced.png differ diff --git a/web/public/screenshots/settings-audio.png b/web/public/screenshots/settings-audio.png index 8329c85..9fdab47 100644 Binary files a/web/public/screenshots/settings-audio.png and b/web/public/screenshots/settings-audio.png differ diff --git a/web/public/screenshots/settings-general.png b/web/public/screenshots/settings-general.png index 07d4bee..6f77431 100644 Binary files a/web/public/screenshots/settings-general.png and b/web/public/screenshots/settings-general.png differ diff --git a/web/public/screenshots/settings-performance.png b/web/public/screenshots/settings-performance.png new file mode 100644 index 0000000..7a3b4c1 Binary files /dev/null and b/web/public/screenshots/settings-performance.png differ diff --git a/web/public/screenshots/settings-recognition.png b/web/public/screenshots/settings-recognition.png index 95c3038..5866280 100644 Binary files a/web/public/screenshots/settings-recognition.png and b/web/public/screenshots/settings-recognition.png differ diff --git a/web/public/screenshots/settings-shortcuts.png b/web/public/screenshots/settings-shortcuts.png deleted file mode 100644 index 7bf3eb1..0000000 Binary files a/web/public/screenshots/settings-shortcuts.png and /dev/null differ diff --git a/web/public/screenshots/settings-speech-engine.png b/web/public/screenshots/settings-speech-engine.png index 2605ec0..ab74f50 100644 Binary files a/web/public/screenshots/settings-speech-engine.png and b/web/public/screenshots/settings-speech-engine.png differ diff --git a/web/src/app/__tests__/screenshots-page.test.ts b/web/src/app/__tests__/screenshots-page.test.ts index 2dbc650..448f5a1 100644 --- a/web/src/app/__tests__/screenshots-page.test.ts +++ b/web/src/app/__tests__/screenshots-page.test.ts @@ -12,6 +12,7 @@ describe("Screenshots page and assets", () => { const shellPath = path.join(webRoot, "src/components/seo-subpage-shell.tsx"); const homePath = path.join(webRoot, "src/app/page.tsx"); const publicScreenshotsDir = path.join(webRoot, "public/screenshots"); + const darkScreenshotsDir = path.join(publicScreenshotsDir, "dark"); const expectedAssets = [ "00-transcription.png", @@ -21,7 +22,7 @@ describe("Screenshots page and assets", () => { "settings-speech-engine.png", "settings-recognition.png", "settings-audio.png", - "settings-shortcuts.png", + "settings-performance.png", "settings-general.png", "settings-advanced.png", ]; @@ -51,6 +52,7 @@ describe("Screenshots page and assets", () => { expect(gallerySource).toContain('role="dialog"'); expect(gallerySource).toContain("aria-modal"); expect(gallerySource).toContain("View larger"); + expect(gallerySource).toContain("ThemeScreenshotImg"); }); it("references every public screenshot asset from the page source", () => { @@ -59,7 +61,15 @@ describe("Screenshots page and assets", () => { expect(fs.existsSync(assetPath)).toBe(true); expect(fs.statSync(assetPath).size).toBeGreaterThan(1000); expect(pageSource).toContain(`/screenshots/${file}`); + + const darkPath = path.join(darkScreenshotsDir, file); + expect(fs.existsSync(darkPath)).toBe(true); + expect(fs.statSync(darkPath).size).toBeGreaterThan(1000); + expect(pageSource).toContain(`/screenshots/dark/${file}`); } + expect(fs.existsSync(path.join(publicScreenshotsDir, "settings-shortcuts.png"))).toBe( + false, + ); }); it("links to the gallery and only embeds a few product shots on home", () => { @@ -67,10 +77,11 @@ describe("Screenshots page and assets", () => { expect(homeSource).toContain('href: "/screenshots/"'); expect(homeSource).toContain('href="/screenshots/"'); expect(homeSource).toContain("/screenshots/00-transcription.png"); + expect(homeSource).toContain("/screenshots/dark/00-transcription.png"); expect(homeSource).not.toContain("/screenshots/05-about-view.png"); expect(homeSource).not.toContain("/screenshots/settings-recognition.png"); expect(homeSource).not.toContain("/screenshots/settings-audio.png"); - expect(homeSource).not.toContain("/screenshots/settings-shortcuts.png"); + expect(homeSource).not.toContain("/screenshots/settings-performance.png"); expect(homeSource).not.toContain("/screenshots/settings-advanced.png"); }); @@ -80,13 +91,17 @@ describe("Screenshots page and assets", () => { }); it("includes captioned settings and product sections", () => { - expect(pageSource).toContain("Speech Engine"); - expect(pageSource).toContain("Recognition"); + expect(pageSource).toContain("Speech Model"); + expect(pageSource).toContain("Dictation"); expect(pageSource).toContain("Audio"); - expect(pageSource).toContain("Shortcuts"); - expect(pageSource).toContain("General"); + expect(pageSource).toContain("Performance"); + expect(pageSource).toContain("Application"); expect(pageSource).toContain("Advanced"); - expect(pageSource).toContain("Transcription in action"); + expect(pageSource).toContain("Dictation in action"); expect(pageSource).toContain("About"); + expect(pageSource).toContain("update checker"); + expect(pageSource).not.toContain("Shortcuts & Hotkeys"); + expect(pageSource).not.toContain("About dialog"); + expect(pageSource).not.toContain("Settings overview"); }); }); diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx index 8e1fe45..053f4fe 100644 --- a/web/src/app/page.tsx +++ b/web/src/app/page.tsx @@ -1,7 +1,6 @@ "use client"; import React, { useState, useEffect, useCallback } from "react"; -import Image from "next/image"; import Link from "next/link"; import { Check, @@ -16,6 +15,7 @@ import { } from "lucide-react"; import { ThemeToggle } from "@/components/theme-toggle"; import { VocalinuxLogo } from "@/components/optimized-image"; +import { ThemeScreenshotImage } from "@/components/theme-screenshot"; // Always uses main/install.sh. The installer dynamically resolves the latest release tag via GitHub API const installCommands = { @@ -516,16 +516,17 @@ export default function HomePage() { aria-hidden />
-
- Live transcription overlay + Dictation into any focused app {/* - Paired layout: crop the tall settings shot to a fixed frame so it - matches a full feature rail (all six items), instead of three short - cards stranded beside a full dialog screenshot. + Paired layout: settings shot stretches with the feature rail. + object-contain keeps the full dialog visible (no side crop). */}
-
@@ -664,12 +665,13 @@ export default function HomePage() {
-
Tray status while you work diff --git a/web/src/app/screenshots/page.tsx b/web/src/app/screenshots/page.tsx index 479ae78..2ea440a 100644 --- a/web/src/app/screenshots/page.tsx +++ b/web/src/app/screenshots/page.tsx @@ -8,97 +8,104 @@ import { import { SeoSubpageShell } from "@/components/seo-subpage-shell"; import { absoluteUrl, buildPageMetadata } from "@/lib/seo"; +/** Pixel size of the captured settings/log dialog screenshots. */ +const SETTINGS_SIZE = { width: 2128, height: 1698 } as const; + const productShots: Screenshot[] = [ { src: "/screenshots/00-transcription.png", - alt: "Vocalinux real-time transcription in action", - title: "Transcription in action", - description: "Dictate into any Linux app with real-time voice-to-text.", - width: 2565, - height: 2018, + srcDark: "/screenshots/dark/00-transcription.png", + alt: "Vocalinux dictating into a text editor with the tray menu open", + title: "Dictation in action", + description: + "Voice typing into a focused app while the tray menu shows listening state.", + width: 2518, + height: 2057, }, { src: "/screenshots/02-system-tray.png", - alt: "Vocalinux system tray listening indicator", + srcDark: "/screenshots/dark/02-system-tray.png", + alt: "Vocalinux system tray menu with voice typing controls", title: "System tray", - description: "Tray icon shows idle, listening, and processing states.", - width: 565, - height: 453, - }, - { - src: "/screenshots/05-about-view.png", - alt: "Vocalinux About dialog", - title: "About", - description: "Version info, credits, and project links.", - width: 1012, - height: 854, + description: "Tray menu for start/stop, settings, logs, and about.", + width: 315, + height: 466, }, { src: "/screenshots/03-log-viewer.png", + srcDark: "/screenshots/dark/03-log-viewer.png", alt: "Vocalinux log viewer dialog", title: "Log viewer", description: "Inspect runtime logs when diagnosing dictation issues.", - width: 1904, - height: 1578, + ...SETTINGS_SIZE, }, ]; const settingsShots: Screenshot[] = [ { src: "/screenshots/settings-speech-engine.png", - alt: "Speech Engine settings tab", - title: "Speech Engine", + srcDark: "/screenshots/dark/settings-speech-engine.png", + alt: "Vocalinux Speech Model settings with sidebar navigation", + title: "Speech Model", description: "Choose whisper.cpp, Whisper, VOSK, or Remote API and pick a model.", - width: 1504, - height: 2146, + ...SETTINGS_SIZE, }, { src: "/screenshots/settings-recognition.png", - alt: "Recognition settings tab", - title: "Recognition", - description: "Language, voice commands, and recognition behavior.", - width: 1504, - height: 2146, + srcDark: "/screenshots/dark/settings-recognition.png", + alt: "Vocalinux Dictation settings page", + title: "Dictation", + description: "Shortcuts, listening controls, and dictation output options.", + ...SETTINGS_SIZE, }, { src: "/screenshots/settings-audio.png", - alt: "Audio settings tab", + srcDark: "/screenshots/dark/settings-audio.png", + alt: "Vocalinux Audio settings page", title: "Audio", description: "Input device, feedback sounds, and capture options.", - width: 1504, - height: 2146, + ...SETTINGS_SIZE, }, { - src: "/screenshots/settings-shortcuts.png", - alt: "Shortcuts and hotkeys settings tab", - title: "Shortcuts & Hotkeys", - description: "Toggle mode, push-to-talk, and custom key bindings.", - width: 1504, - height: 2146, + src: "/screenshots/settings-performance.png", + srcDark: "/screenshots/dark/settings-performance.png", + alt: "Vocalinux Performance settings page", + title: "Performance", + description: "Auto-pause, model keep-alive, and GPU device selection.", + ...SETTINGS_SIZE, }, { src: "/screenshots/settings-general.png", - alt: "General settings tab", - title: "General", - description: "Autostart, UI preferences, and everyday defaults.", - width: 1504, - height: 2146, + srcDark: "/screenshots/dark/settings-general.png", + alt: "Vocalinux Application settings page", + title: "Application", + description: "Autostart, start minimized, and everyday defaults.", + ...SETTINGS_SIZE, }, { src: "/screenshots/settings-advanced.png", - alt: "Advanced tuning and settings tab", + srcDark: "/screenshots/dark/settings-advanced.png", + alt: "Vocalinux Advanced settings with whisper.cpp decoding controls", title: "Advanced", description: "Power-user decoding controls and Remote Server options.", - width: 1504, - height: 2146, + ...SETTINGS_SIZE, + }, + { + src: "/screenshots/05-about-view.png", + srcDark: "/screenshots/dark/05-about-view.png", + alt: "Vocalinux About settings page with update checker", + title: "About", + description: + "Version info plus Stable/Nightly update checks from GitHub Releases.", + ...SETTINGS_SIZE, }, ]; export const metadata: Metadata = buildPageMetadata({ title: "Vocalinux Screenshots | Linux Voice Dictation UI", description: - "See Vocalinux in action: system tray, about dialog, log viewer, and settings pages for speech engine, recognition, audio, shortcuts, general, and advanced options.", + "See Vocalinux in action: system tray, log viewer, and settings pages for speech model, dictation, audio, performance, application, advanced options, and about/updates. Light and dark themes included.", path: "/screenshots", keywords: [ "Vocalinux screenshots", @@ -116,7 +123,7 @@ export default function ScreenshotsPage() { name: "Vocalinux Screenshots", description: "Product and settings screenshots of Vocalinux, offline voice dictation for Linux.", - dateModified: "2026-07-15", + dateModified: "2026-08-03", // refreshed after About moved into Settings sidebar author: { "@type": "Person", name: "Jatin K Malik", @@ -143,17 +150,16 @@ export default function ScreenshotsPage() {

- Settings gallery (refresh pending) + v0.15 UI

Vocalinux Screenshots

A look at offline voice dictation on Linux: tray controls, debugging - tools, and the settings dialog. Click any image to expand it and browse - the gallery. Product shots are current; some settings images still show - the older tabbed layout while the app uses a searchable sidebar in - v0.15.0+. + tools, and the searchable sidebar settings UI from v0.15. Toggle the + site theme to switch between light and dark app shots. Click any image + to expand it and browse the gallery.

@@ -179,7 +185,7 @@ export default function ScreenshotsPage() { Advanced settings guide diff --git a/web/src/components/__tests__/screenshot-gallery.test.tsx b/web/src/components/__tests__/screenshot-gallery.test.tsx index 0166e9d..fa1ae17 100644 --- a/web/src/components/__tests__/screenshot-gallery.test.tsx +++ b/web/src/components/__tests__/screenshot-gallery.test.tsx @@ -9,6 +9,7 @@ import { const productShots: Screenshot[] = [ { src: "/screenshots/00-transcription.png", + srcDark: "/screenshots/dark/00-transcription.png", alt: "Transcription alt", title: "Transcription in action", description: "Dictate into apps", @@ -17,6 +18,7 @@ const productShots: Screenshot[] = [ }, { src: "/screenshots/02-system-tray.png", + srcDark: "/screenshots/dark/02-system-tray.png", alt: "Tray alt", title: "System tray", description: "Tray states", @@ -28,6 +30,7 @@ const productShots: Screenshot[] = [ const settingsShots: Screenshot[] = [ { src: "/screenshots/settings-speech-engine.png", + srcDark: "/screenshots/dark/settings-speech-engine.png", alt: "Speech engine alt", title: "Speech Engine", description: "Pick a model", @@ -57,7 +60,16 @@ describe("ScreenshotGallery lightbox", () => { expect(dialog).toHaveAttribute("aria-modal", "true"); // Settings shot is third overall (index 2 -> 3/3) expect(within(dialog).getByText(/3 \/ 3/)).toBeInTheDocument(); - expect(within(dialog).getByAltText("Speech engine alt")).toBeInTheDocument(); + const speechImgs = within(dialog).getAllByAltText("Speech engine alt"); + expect(speechImgs.length).toBe(2); + expect(speechImgs[0]).toHaveAttribute( + "src", + "/screenshots/settings-speech-engine.png", + ); + expect(speechImgs[1]).toHaveAttribute( + "src", + "/screenshots/dark/settings-speech-engine.png", + ); expect(within(dialog).getByText("Speech Engine")).toBeInTheDocument(); }); @@ -78,19 +90,23 @@ describe("ScreenshotGallery lightbox", () => { let dialog = screen.getByRole("dialog"); expect(within(dialog).getByText(/1 \/ 3/)).toBeInTheDocument(); - expect(within(dialog).getByAltText("Transcription alt")).toBeInTheDocument(); + expect( + within(dialog).getAllByAltText("Transcription alt").length, + ).toBeGreaterThan(0); await user.click(screen.getByRole("button", { name: "Next screenshot" })); dialog = screen.getByRole("dialog"); expect(within(dialog).getByText(/2 \/ 3/)).toBeInTheDocument(); - expect(within(dialog).getByAltText("Tray alt")).toBeInTheDocument(); + expect(within(dialog).getAllByAltText("Tray alt").length).toBeGreaterThan(0); await user.click( screen.getByRole("button", { name: "Previous screenshot" }), ); dialog = screen.getByRole("dialog"); expect(within(dialog).getByText(/1 \/ 3/)).toBeInTheDocument(); - expect(within(dialog).getByAltText("Transcription alt")).toBeInTheDocument(); + expect( + within(dialog).getAllByAltText("Transcription alt").length, + ).toBeGreaterThan(0); fireEvent.keyDown(window, { key: "Escape" }); expect(screen.queryByRole("dialog")).not.toBeInTheDocument(); @@ -113,17 +129,18 @@ describe("ScreenshotGallery lightbox", () => { fireEvent.keyDown(window, { key: "ArrowRight" }); expect( - within(screen.getByRole("dialog")).getByAltText("Tray alt"), - ).toBeInTheDocument(); + within(screen.getByRole("dialog")).getAllByAltText("Tray alt").length, + ).toBeGreaterThan(0); fireEvent.keyDown(window, { key: "ArrowRight" }); expect( - within(screen.getByRole("dialog")).getByAltText("Speech engine alt"), - ).toBeInTheDocument(); + within(screen.getByRole("dialog")).getAllByAltText("Speech engine alt") + .length, + ).toBeGreaterThan(0); fireEvent.keyDown(window, { key: "ArrowLeft" }); expect( - within(screen.getByRole("dialog")).getByAltText("Tray alt"), - ).toBeInTheDocument(); + within(screen.getByRole("dialog")).getAllByAltText("Tray alt").length, + ).toBeGreaterThan(0); }); }); diff --git a/web/src/components/screenshot-gallery.tsx b/web/src/components/screenshot-gallery.tsx index 6b8cc9e..e3527f9 100644 --- a/web/src/components/screenshot-gallery.tsx +++ b/web/src/components/screenshot-gallery.tsx @@ -9,9 +9,15 @@ import { Settings, X, } from "lucide-react"; +import { + darkScreenshotPath, + ThemeScreenshotImg, +} from "@/components/theme-screenshot"; export type Screenshot = { src: string; + /** Dark-theme variant; defaults to `/screenshots/dark/`. */ + srcDark?: string; alt: string; title: string; description: string; @@ -19,6 +25,10 @@ export type Screenshot = { height: number; }; +function shotDarkSrc(shot: Screenshot): string { + return shot.srcDark ?? darkScreenshotPath(shot.src); +} + type ScreenshotGalleryProps = { productShots: Screenshot[]; settingsShots: Screenshot[]; @@ -32,23 +42,20 @@ function ScreenshotCard({ onOpen: () => void; }) { return ( -
+
- Speech Engine settings
+ Speech Engine settings
Speech Engine 		- Recognition settings
+ Recognition settings
Recognition 		- Audio settings
+ Audio settings
Audio
- Shortcuts and hotkeys
- Shortcuts & Hotkeys + Performance settings
+ Performance 		- General settings
+ General settings
General 		- Advanced tuning and settings
+ Advanced tuning and settings
Advanced