feat(site): add es/pt/it locale support with UI selector

- Expand runtime locale support from 2 to 5 locales (en, zh, es, pt, it) - Add locale normalization/cycling logic and button labels - Add Spanish/Portuguese/Italian UI text bundles - Update localized labels for journey/audience/kind, reading paths, command-lane hints, and engineering pillars - Rework locale rendering with fallback helper for untranslated fields - Update language toggle behavior in command palette - Add localized README files (es, pt, it) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-04 04:50:31 -05:00 · 2026-03-04 04:50:31 -05:00 · b3887d7ddf
commit b3887d7ddf
parent c3ff4997fd
6 changed files with 857 additions and 236 deletions
--- a/site/README.es.md
+++ b/site/README.es.md
@ -0,0 +1,70 @@
+# Frontend de ZeroClaw para GitHub Pages (Vite)
+
+Este es el frontend independiente para GitHub Pages.
+
+Idiomas: [English](README.md) | **Español** | [Português](README.pt.md) | [Italiano](README.it.md)
+
+## Comandos
+
+```bash
+cd site
+npm install
+npm run dev
+```
+
+Compilar para GitHub Pages:
+
+```bash
+cd site
+npm run build
+```
+
+La salida de compilación se genera en:
+
+```text
+/home/ubuntu/zeroclaw/gh-pages
+```
+
+Notas:
+
+- El directorio de salida es intencionalmente `gh-pages/` (no `out/`).
+- La base de Vite está configurada como `/zeroclaw/` para `https://zeroclaw-labs.github.io/zeroclaw/`.
+- Los enlaces de documentación en la UI apuntan a páginas renderizadas de GitHub Docs para lectura directa.
+- El navegador de documentación soporta:
+  - búsqueda por palabras clave con ranking ponderado
+  - filtros por categoría y nivel (`Core` / `Advanced`)
+  - atajos de teclado: `/` para enfocar la búsqueda y `Esc` para restablecer filtros
+- "Quick Start Paths" ofrece flujos guiados por tareas para onboarding, canales y hardening.
+- La paleta de comandos está habilitada:
+  - abrir con `Ctrl/Cmd + K`
+  - incluye acciones rápidas (ir a docs, repositorio, cambiar tema/idioma)
+  - incluye entradas de búsqueda difusa en documentación
+  - soporta navegación por teclado (`↑` / `↓` / `Enter`) con resaltado del elemento activo
+  - soporta ciclo con `Tab` / `Shift+Tab` y panel de vista previa en vivo (escritorio)
+- El sistema de tema está habilitado:
+  - `Auto` / `Dark` / `Light`
+  - preferencia persistida en `localStorage`
+- i18n está habilitado:
+  - la UI actualmente soporta `English` y `简体中文`
+  - hay traducciones adicionales de este README en `Español`, `Português` e `Italiano`
+  - la preferencia de idioma se guarda en `localStorage`
+  - el parámetro de idioma en URL (`?lang=en` / `?lang=zh`) se sincroniza para enlaces compartibles
+- El sistema responsive fue ampliado:
+  - mejores breakpoints para desktop/tablet/móvil
+  - controles adaptativos en la barra superior y paneles
+  - uso de container query para modo compacto en tarjetas de documentación
+  - section rail en desktop + quick dock móvil para navegación más rápida en páginas largas
+
+## Despliegue
+
+El repositorio incluye este workflow:
+
+```text
+.github/workflows/pages-deploy.yml
+```
+
+Comportamiento:
+
+- Se dispara en pushes a `main` cuando cambian `site/**`, `docs/**` o `README.md`.
+- El build se ejecuta en `site/` y publica artefacto desde `gh-pages/`.
+- Despliega con acciones oficiales de GitHub Pages.
--- a/site/README.it.md
+++ b/site/README.it.md
@ -0,0 +1,70 @@
+# Frontend ZeroClaw per GitHub Pages (Vite)
+
+Questo è il frontend standalone per GitHub Pages.
+
+Lingue: [English](README.md) | [Español](README.es.md) | [Português](README.pt.md) | **Italiano**
+
+## Comandi
+
+```bash
+cd site
+npm install
+npm run dev
+```
+
+Build per GitHub Pages:
+
+```bash
+cd site
+npm run build
+```
+
+L'output di build viene generato in:
+
+```text
+/home/ubuntu/zeroclaw/gh-pages
+```
+
+Note:
+
+- La directory di output è intenzionalmente `gh-pages/` (non `out/`).
+- La base di Vite è configurata su `/zeroclaw/` per `https://zeroclaw-labs.github.io/zeroclaw/`.
+- I link alla documentazione nella UI puntano alle pagine docs renderizzate su GitHub per lettura diretta.
+- Il navigatore documentazione supporta:
+  - ricerca per parole chiave con ranking pesato
+  - filtri per categoria e livello (`Core` / `Advanced`)
+  - scorciatoie tastiera: `/` per mettere a fuoco la ricerca, `Esc` per azzerare i filtri
+- "Quick Start Paths" offre flussi guidati per onboarding, canali e hardening.
+- La command palette è abilitata:
+  - apertura con `Ctrl/Cmd + K`
+  - include azioni rapide (vai a docs, repository, cambio tema/lingua)
+  - include voci di ricerca fuzzy nella documentazione
+  - supporta navigazione da tastiera (`↑` / `↓` / `Enter`) con evidenziazione elemento attivo
+  - supporta ciclo con `Tab` / `Shift+Tab` e pannello preview live (desktop)
+- Il sistema temi è abilitato:
+  - `Auto` / `Dark` / `Light`
+  - preferenza salvata in `localStorage`
+- i18n è abilitato:
+  - la UI attualmente supporta `English` e `简体中文`
+  - sono disponibili traduzioni aggiuntive di questo README in `Español`, `Português` e `Italiano`
+  - la preferenza lingua viene salvata in `localStorage`
+  - il parametro lingua URL (`?lang=en` / `?lang=zh`) viene sincronizzato per link condivisibili
+- Il sistema responsive è stato esteso:
+  - breakpoints migliorati per desktop/tablet/mobile
+  - controlli topbar e layout pannelli adattivi
+  - container query usata per modalità compatta delle doc-card
+  - section rail desktop + quick dock mobile per navigazione più rapida su pagine lunghe
+
+## Deploy
+
+Il repository include questo workflow:
+
+```text
+.github/workflows/pages-deploy.yml
+```
+
+Comportamento:
+
+- Trigger su push a `main` quando cambiano `site/**`, `docs/**` o `README.md`.
+- Il build gira in `site/` e pubblica l'artefatto da `gh-pages/`.
+- Deploy con le action ufficiali di GitHub Pages.
--- a/site/README.md
+++ b/site/README.md
@ -2,6 +2,8 @@

 This is the standalone frontend for GitHub Pages.

+Languages: **English** | [Español](README.es.md) | [Português](README.pt.md) | [Italiano](README.it.md)
+
 ## Commands

 ```bash
@ -43,7 +45,8 @@ Notes:
  - `Auto` / `Dark` / `Light`
  - preference persisted in `localStorage`
 - i18n is enabled:
-  - UI supports `English` and `简体中文`
+  - UI currently supports `English` and `简体中文`
+  - Additional README translations are available in `Español`, `Português`, and `Italiano`
  - language preference persisted in `localStorage`
  - URL language parameter (`?lang=en` / `?lang=zh`) is synchronized for shareable links
 - Responsive system is deepened:
--- a/site/README.pt.md
+++ b/site/README.pt.md
@ -0,0 +1,70 @@
+# Frontend do ZeroClaw para GitHub Pages (Vite)
+
+Este é o frontend independente para GitHub Pages.
+
+Idiomas: [English](README.md) | [Español](README.es.md) | **Português** | [Italiano](README.it.md)
+
+## Comandos
+
+```bash
+cd site
+npm install
+npm run dev
+```
+
+Build para GitHub Pages:
+
+```bash
+cd site
+npm run build
+```
+
+A saída do build é gerada em:
+
+```text
+/home/ubuntu/zeroclaw/gh-pages
+```
+
+Notas:
+
+- O diretório de saída é intencionalmente `gh-pages/` (não `out/`).
+- A base do Vite está configurada para `/zeroclaw/` em `https://zeroclaw-labs.github.io/zeroclaw/`.
+- Os links de documentação na UI apontam para páginas renderizadas do GitHub Docs para leitura direta.
+- O navegador de documentação suporta:
+  - busca por palavras-chave com ranking ponderado
+  - filtros por categoria e nível (`Core` / `Advanced`)
+  - atalhos de teclado: `/` para focar a busca e `Esc` para limpar filtros
+- "Quick Start Paths" fornece fluxos por tarefa para onboarding, canais e hardening.
+- A paleta de comandos está habilitada:
+  - abrir com `Ctrl/Cmd + K`
+  - inclui ações rápidas (ir para docs, repositório, trocar tema/idioma)
+  - inclui entradas de busca fuzzy para documentação
+  - suporta navegação por teclado (`↑` / `↓` / `Enter`) com destaque do item ativo
+  - suporta navegação com `Tab` / `Shift+Tab` e painel de preview ao vivo (desktop)
+- O sistema de tema está habilitado:
+  - `Auto` / `Dark` / `Light`
+  - preferência persistida em `localStorage`
+- i18n está habilitado:
+  - a UI atualmente suporta `English` e `简体中文`
+  - traduções adicionais deste README estão disponíveis em `Español`, `Português` e `Italiano`
+  - a preferência de idioma é persistida em `localStorage`
+  - o parâmetro de idioma na URL (`?lang=en` / `?lang=zh`) é sincronizado para links compartilháveis
+- O sistema responsivo foi aprofundado:
+  - breakpoints melhorados para desktop/tablet/mobile
+  - controles adaptativos na topbar e layouts de painéis
+  - uso de container query para modo compacto dos cards de docs
+  - section rail no desktop + quick dock no mobile para navegação mais rápida em páginas longas
+
+## Deploy
+
+O repositório inclui este workflow:
+
+```text
+.github/workflows/pages-deploy.yml
+```
+
+Comportamento:
+
+- Dispara em pushes para `main` quando `site/**`, `docs/**` ou `README.md` mudam.
+- O build roda em `site/` e publica o artefato a partir de `gh-pages/`.
+- Faz deploy usando as actions oficiais do GitHub Pages.
--- a/site/src/App.tsx
+++ b/site/src/App.tsx
--- a/site/src/styles.css
+++ b/site/src/styles.css
@ -1315,7 +1315,13 @@ main {

  .controls {
    width: 100%;
-    justify-content: space-between;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+    gap: 0.42rem;
+  }
+
+  .palette-trigger {
+    margin-left: auto;
  }
 }

@ -1328,6 +1334,12 @@ main {
    padding-top: 1rem;
  }

+  .segmented button {
+    padding: 0.24rem 0.46rem;
+    font-size: 0.68rem;
+    letter-spacing: 0.04em;
+  }
+
  .hero-inner,
  .docs-shell {
    padding: 0.86rem;