Files

T

Jatin K MalikandGitHub 25ceec017d web: restyle vocalinux.com to the Voca family workbench (#728 )

* web: restyle vocalinux.com to the Voca family workbench

Bring the Linux marketing site onto the same paper, ink, and teal language
as VocaHQ, VocaMac, VocaPhone, and VocaGateway. Drop the site-wide dark
mode so the canvas stays paper-only, matching the other product sites.

* web: loop the home ribbon without a gap or jump

The ticker used a stretched full-width track, so a -50% slide left an empty
right edge before snapping back. Two equal groups, each wider than the
viewport, scroll by exactly one group width.

* web: match vocahq.com ribbon speed and teal band

The looped ticker was covering six item cycles in 32s, so it raced.
It now spends 28s per cycle like vocahq.com, uses the same dark-teal
band, and pauses when the tab is hidden.

* web: drive the hero panel clock from the visitor's local time

Replace the static 11:24 mock with a 24-hour HH:MM clock in the client
timezone, updated on the minute.

* web: add official platform marks on the family cards

Use the .github brand platform SVGs (Linux, Apple, Android, Windows)
plus the HQ server mark for VocaGateway, matching vocahq.com's product row.

* web: restore a Light/Dark flip on the screenshots page

The captured GTK shots exist in both appearances. A page-local switch
defaults to prefers-color-scheme and stores a tab override. The rest of
the site stays paper-only.

* web: make the homepage CTA say Install, not Get

The button already jumps to the one-line installer. Name that action,
note that there is no account, and keep the same copy in the closer
and the mobile menu.

* web: style install commands as GTK terminals

Command boxes use a headerbar with copy, a centered title, and
window controls on the right. The prompt is user@linux:~$, not
Mac traffic-light chrome.

* web: stop repeating the engine list in the hero

The proof line, the notes window, and the tray terminal all said
the same whisper.cpp / Whisper / VOSK / Remote API line. Engines
stay on the window chips. Proof is now desktop and license facts.
The terminal shows launching into the tray.

* web: reflow copy, color prompts, and add install paths

Drop pretty/balance wrapping so titles and ledes follow the
shell width. Color the user@linux prompt. Hero terminal now
says audio stays on this machine. Ribbon adds project words.
AppImage and source-build sit under the install command.

* web: put X, Discord, and GitHub by the footer mark

Official family social marks sit next to the Vocalinux logo.
Footer columns are Product, Install, Guides, and Project.
The bottom line is Part of VocaHQ, without X11 or whisper.cpp.

* web: add hello@vocahq.com to the footer social row

The official mail mark sits with X, Discord, and GitHub and opens
the family hello@vocahq.com address.

* web: use the circular mark in the header and footer

Header and footer now use the official teal circle lockup instead
of the square app icon.

* web: ship a circular favicon and a family OG card

Favicons use the teal circle lockup. The Open Graph image is redone
in the paper workbench language with the current homepage line.

* web: set the hero to Dictate locally / In any app

Shorter couplet in the VocaHQ display size, with a matching
lede and Open Graph card.

* web: gray the hero terminal note as a comment

The second line was reading as part of the vocalinux command.
It is now a dim # comment under the prompt.

2026-08-22 18:12:08 -07:00

3.4 KiB

Raw Blame History

Vocalinux Website

This is the official website for Vocalinux, a voice-to-text application for Linux systems. The website is built with Next.js and can be deployed as a static site to GitHub Pages.

🚀 Quick Start

Development

npm install
npm run dev

Building for Production

npm install
npm run build

The static files will be generated in the out/ directory.

📦 Deployment to GitHub Pages

Automatic Deployment (Recommended)

Push your changes to the main or master branch
GitHub Actions will automatically build and deploy your site to the gh-pages branch
Custom Domain: The site is configured for vocalinux.com
The site will be available at https://vocalinux.com

Manual Deployment

If you prefer to deploy manually:

Build the static site:
```
cd web
npm install
npm run deploy
```
The build includes:
- Static HTML, CSS, and JavaScript files in out/
- .nojekyll file for GitHub Pages compatibility
- CNAME file pointing to vocalinux.com

Local Testing

To test the built site locally:

cd web/out
python3 -m http.server 3000

Then visit http://localhost:3000 in your browser.

🛠️ Build Scripts

npm run dev - Start development server
npm run build - Build static site for production
npm run deploy - Build and prepare for GitHub Pages (adds .nojekyll and CNAME)
npm run lint - Run ESLint
npm run typecheck - Run TypeScript type checking

📁 Project Structure

web/
├── src/
│   ├── app/
│   │   ├── layout.tsx          # Root layout
│   │   └── page.tsx            # Homepage
│   ├── components/
│   │   ├── site-chrome.tsx
│   │   └── ui/                 # Reusable UI components
│   ├── hooks/
│   └── lib/
├── public/                     # Static assets
├── out/                        # Generated static files (after build)
└── package.json

🎨 Features

Responsive Design - Works on desktop and mobile
Family workbench UI - Warm paper, system type, same language as VocaHQ
Modern UI - Built with Tailwind CSS
SEO Optimized - Proper meta tags and structure
Fast Loading - Optimized static generation

🔧 Configuration

Custom Domain

If you want to use a custom domain:

Update the deploy script in package.json to include your domain:

"deploy": "next build && touch out/.nojekyll && echo 'yourdomain.com' > out/CNAME"

Configure your domain's DNS to point to GitHub Pages

Base Path

If deploying to a subdirectory, update next.config.js:

const config = {
  basePath: '/your-subdirectory',
  // ... other config
}

🐛 Troubleshooting

Build Issues

"Module not found": Run npm install to ensure all dependencies are installed
TypeScript errors: Run npm run typecheck to see detailed type errors
ESLint errors: Run npm run lint:fix to automatically fix common issues

Deployment Issues

404 on GitHub Pages: Ensure .nojekyll file exists in the out/ directory
Assets not loading: Check that basePath is correctly configured in next.config.js
Blank page: Check browser console for JavaScript errors

📝 License

This project is licensed under the same license as the main Vocalinux project.

3.4 KiB Raw Blame History