feat: Corregir rutas PWA para GitHub Pages y añadir listado de medios faltantes

- Añadido plugin de Vite para generar manifest.json dinámicamente con base path correcto - Actualizado service worker para detectar base path dinámicamente - Actualizado registro de service worker en main.tsx para usar base path - Corregido manifest.json para funcionar en GitHub Pages (/guia-tes-digital/) - Añadido listado completo de medios faltantes con descripciones - Actualizado documentación de GitHub Pages - Corregido símbolo > en ViaAerea.tsx
2025-12-17 16:19:37 +01:00 · 2025-12-17 16:19:37 +01:00 · b9413d4d0d
parent b06c9cad90
commit b9413d4d0d
8 changed files with 611 additions and 10 deletions
--- a/GITHUB_PAGES_FIX.md
+++ b/GITHUB_PAGES_FIX.md
@ -65,7 +65,7 @@ environment:
 ✅ Creado archivo `404.html` que redirige todas las rutas al `index.html` para que React Router maneje las rutas SPA.

 ### 4. `package.json`
-✅ Agregado script `generate:404` y actualizado `build` para generarlo automáticamente.
+✅ El archivo `404.html` es estático en `public/` y se copia automáticamente durante el build. No se requiere script `generate:404`.

 ---

@ -75,7 +75,7 @@ environment:
   - Detecta que es GitHub Pages (`GITHUB_PAGES=true`)
   - Extrae el nombre del repositorio (`guia-tes-digital`)
   - Configura `base: '/guia-tes-digital/'` en Vite
-   - Genera `404.html` automáticamente
+   - Copia `404.html` desde `public/` a `dist/` automáticamente

 2. **Despliegue:**
   - GitHub Pages sirve los archivos desde `dist/`
--- a/LISTADO_COMPLETO_MEDIOS_FALTANTES.md
+++ b/LISTADO_COMPLETO_MEDIOS_FALTANTES.md
@ -0,0 +1,437 @@
+# LISTADO COMPLETO DE MEDIOS FALTANTES
+
+**Fecha de análisis:** 2025-01-27  
+**Estado:** Documentación de medios mencionados pero no creados
+
+---
+
+## 📊 RESUMEN EJECUTIVO
+
+- **Total de medios faltantes identificados:** 30+
+- **Tipos:** Infografías, diagramas, tablas visuales, guías paso a paso
+- **Ubicación esperada:** `public/assets/infografias/` o `public/assets/diagramas/`
+- **Formato recomendado:** SVG (escalable) o PNG de alta resolución
+
+---
+
+## 📋 MEDIOS FALTANTES POR BLOQUE
+
+### BLOQUE 0: FUNDAMENTOS
+
+#### 1. Diagrama de Selección de Dispositivo de Oxigenoterapia
+- **Ubicación en manual:** BLOQUE_03_0A_OXIGENOTERAPIA_BASICA.md
+- **Descripción:** Diagrama visual que muestra el flujo de decisión para seleccionar el dispositivo de oxigenoterapia adecuado según la situación clínica
+- **Elementos a incluir:**
+  - Flujograma de decisión
+  - Indicadores de FiO2 por dispositivo
+  - Situaciones clínicas de uso
+- **Prioridad:** Alta
+- **Formato:** SVG o PNG
+
+#### 2. Tabla Visual de Rangos de FiO2
+- **Ubicación en manual:** BLOQUE_03_0A_OXIGENOTERAPIA_BASICA.md
+- **Descripción:** Tabla visual comparativa de los rangos de FiO2 de cada dispositivo de oxigenoterapia
+- **Elementos a incluir:**
+  - Dispositivos: Cánula nasal, mascarilla simple, mascarilla con reservorio, mascarilla Venturi, mascarilla no reinhalación
+  - Rangos de FiO2 por dispositivo
+  - Indicadores visuales de color para rangos
+- **Prioridad:** Alta
+- **Formato:** SVG o PNG
+
+#### 3. Guía de Colocación de Dispositivos de Oxigenoterapia
+- **Ubicación en manual:** BLOQUE_03_0A_OXIGENOTERAPIA_BASICA.md
+- **Descripción:** Secuencia visual paso a paso de cómo colocar cada dispositivo de oxigenoterapia
+- **Elementos a incluir:**
+  - Pasos numerados con ilustraciones
+  - Posición correcta del dispositivo
+  - Verificaciones post-colocación
+- **Prioridad:** Media
+- **Formato:** SVG o PNG (serie de imágenes)
+
+---
+
+### BLOQUE 2: MATERIAL E INMOVILIZACIÓN
+
+#### 4. Infografía: Componentes del Sistema de Inmovilización
+- **Ubicación en manual:** BLOQUE_02_3_COLLARIN_CERVICAL.md (línea 647)
+- **Descripción:** Diagrama mostrando todos los componentes del sistema completo de inmovilización
+- **Elementos a incluir:**
+  - Control manual (inicial)
+  - Collarín cervical
+  - Inmovilización corporal (tablero/colchón)
+  - Sujeción completa
+  - Indicador visual: "Sistema completo = Protección real"
+- **Texto a incluir:**
+  - "El collarín es parte de un sistema"
+  - "Collarín sin inmovilización corporal = protección incompleta"
+  - Lista de componentes
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 5. Infografía: Selección de Talla de Collarín Cervical
+- **Ubicación en manual:** BLOQUE_02_3_COLLARIN_CERVICAL.md (línea 662)
+- **Descripción:** Diagrama de medición y tabla de tallas para seleccionar el collarín correcto
+- **Elementos a incluir:**
+  - Diagrama de medición:
+    - Ángulo de la mandíbula (punto superior)
+    - Hombro/trapecio (punto inferior)
+    - Distancia entre ambos puntos
+  - Tabla de tallas (pediátrico, pequeño, mediano, grande)
+  - Indicadores de talla correcta vs incorrecta
+- **Texto a incluir:**
+  - "Método estándar de medición"
+  - "Collarín demasiado grande → hiperextensión"
+  - "Collarín pequeño → flexión cervical"
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 6. Infografía: Colocación de Collarín Paso a Paso
+- **Ubicación en manual:** BLOQUE_02_3_COLLARIN_CERVICAL.md (línea 677)
+- **Descripción:** Secuencia visual de 6 pasos para colocar el collarín cervical correctamente
+- **Elementos a incluir:**
+  - Paso 1: Preparación
+  - Paso 2: Parte posterior
+  - Paso 3: Parte anterior
+  - Paso 4: Ajuste de cierres
+  - Paso 5: Verificación
+  - Paso 6: Liberación controlada
+  - Indicador visual: "Control manual durante todo el proceso"
+- **Texto a incluir:**
+  - Títulos de cada paso
+  - Adverencia: "NUNCA soltar control manual hasta verificación completa"
+- **Prioridad:** Alta
+- **Formato:** SVG (serie de 6 imágenes)
+
+#### 7. Infografía: Verificaciones Post-Colocación de Collarín
+- **Ubicación en manual:** BLOQUE_02_3_COLLARIN_CERVICAL.md (línea 693)
+- **Descripción:** Lista visual de 5 verificaciones después de colocar el collarín
+- **Elementos a incluir:**
+  - Respiración normal
+  - No aumento de dolor
+  - No compromiso de vía aérea
+  - Collarín centrado
+  - Continúa inmovilización corporal
+  - Indicadores de verificación correcta
+- **Texto a incluir:**
+  - "Verificaciones inmediatas después de colocar"
+  - "Si hay problemas: ajustar o reconsiderar"
+- **Prioridad:** Media
+- **Formato:** SVG
+
+#### 8. Infografía: Errores Frecuentes en Colocación de Collarín
+- **Ubicación en manual:** BLOQUE_02_3_COLLARIN_CERVICAL.md (línea 708)
+- **Descripción:** Lista visual de errores comunes con iconos
+- **Elementos a incluir:**
+  - Colocar sin control manual
+  - Soltar para ajustar
+  - Forzar alineación
+  - Talla incorrecta
+  - Colocar sobre ropa gruesa
+- **Prioridad:** Media
+- **Formato:** SVG
+
+#### 9. Infografía: Posición del TES en Inmovilización Manual
+- **Ubicación en manual:** BLOQUE_02_2_INMOVILIZACION_MANUAL.md (línea 530)
+- **Descripción:** Diagrama de TES en posición correcta (cabecera del paciente)
+- **Elementos a incluir:**
+  - Posición de rodillas o cuclillas
+  - Eje con el cuerpo del paciente
+  - Posición de las manos (vista lateral y frontal)
+- **Texto a incluir:**
+  - "Posición: Cabecera del paciente, en eje con el cuerpo"
+  - "Manos: Palmas en laterales del cráneo, dedos extendidos"
+  - "Mantener posición cómoda para control prolongado"
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 10. Infografía: Técnica de Sujeción Manual
+- **Ubicación en manual:** BLOQUE_02_2_INMOVILIZACION_MANUAL.md (línea 543)
+- **Descripción:** Vista superior de cabeza con posición de manos
+- **Elementos a incluir:**
+  - Palmas en laterales del cráneo marcadas
+  - Zonas a evitar (pabellones auriculares, mandíbula)
+  - Indicadores de sujeción correcta
+- **Texto a incluir:**
+  - "Sujeción: Palmas en laterales del cráneo"
+  - "Evitar: Pabellones auriculares, mandíbula"
+  - "Firme pero sin comprimir"
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 11. Infografía: Situaciones que Requieren Inmovilización
+- **Ubicación en manual:** BLOQUE_02_2_INMOVILIZACION_MANUAL.md (línea 556)
+- **Descripción:** Iconos o símbolos de cada situación que requiere inmovilización
+- **Elementos a incluir:**
+  - Politraumatizado
+  - Caída desde altura
+  - Accidente de tráfico
+  - Inconsciencia
+  - Dolor cervical
+  - Principio clave destacado
+- **Texto a incluir:**
+  - Lista de situaciones
+  - "Principio: Toda víctima traumática se considera con lesión cervical hasta que se demuestre lo contrario"
+- **Prioridad:** Media
+- **Formato:** SVG
+
+#### 12. Infografía: Secuencia de Transición en Inmovilización
+- **Ubicación en manual:** BLOQUE_02_2_INMOVILIZACION_MANUAL.md (línea 572)
+- **Descripción:** Secuencia visual de 4-5 pasos para transición de control manual a dispositivo
+- **Elementos a incluir:**
+  - Paso 1: Control manual
+  - Paso 2: Preparación dispositivo
+  - Paso 3: Colocación (manteniendo control)
+  - Paso 4: Verificación
+  - Paso 5: Liberación controlada
+  - Indicador visual de "NO SOLTAR" en cada paso
+- **Texto a incluir:**
+  - Títulos de cada paso
+  - Advertencia: "Mantener control manual hasta que dispositivo esté completamente fijado"
+- **Prioridad:** Alta
+- **Formato:** SVG (serie de imágenes)
+
+#### 13. Infografía: Coordinación del Equipo en Inmovilización
+- **Ubicación en manual:** BLOQUE_02_2_INMOVILIZACION_MANUAL.md (línea 587)
+- **Descripción:** Diagrama de equipo alrededor del paciente
+- **Elementos a incluir:**
+  - Roles marcados (control cabeza, control tronco, etc.)
+  - Flujo de comunicación
+  - Secuencia de órdenes
+- **Prioridad:** Media
+- **Formato:** SVG
+
+#### 14. Infografía: Componentes del Tablero Espinal
+- **Ubicación en manual:** BLOQUE_02_5_TABLERO_ESPINAL.md (línea 332)
+- **Descripción:** Diagrama de tablero espinal con todos sus componentes
+- **Elementos a incluir:**
+  - Tablero espinal
+  - Collarín cervical
+  - Correas de sujeción (tronco, pelvis)
+  - Bloques o cuñas para cabeza
+  - Indicador visual: "Sistema completo de inmovilización"
+- **Texto a incluir:**
+  - "Tablero espinal: sistema completo"
+  - "Requiere: collarín, correas, bloques"
+  - "NO solo el tablero"
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 15. Infografía: Colocación de Tablero Espinal Paso a Paso
+- **Ubicación en manual:** BLOQUE_02_5_TABLERO_ESPINAL.md (línea 347)
+- **Descripción:** Secuencia visual de colocación del tablero espinal
+- **Elementos a incluir:**
+  - Pasos numerados con ilustraciones
+  - Posición del equipo
+  - Técnica de deslizamiento
+- **Prioridad:** Alta
+- **Formato:** SVG (serie de imágenes)
+
+#### 16. Infografía: Componentes del Colchón de Vacío
+- **Ubicación en manual:** BLOQUE_02_6_COLCHON_VACIO.md (línea 341)
+- **Descripción:** Diagrama de colchón de vacío con todos sus componentes
+- **Elementos a incluir:**
+  - Colchón de vacío desinflado
+  - Bomba de vacío
+  - Válvula de vacío
+  - Collarín cervical
+  - Correas de sujeción
+  - Indicador visual: "Sistema completo de inmovilización"
+- **Texto a incluir:**
+  - "Colchón de vacío: sistema completo"
+  - "Requiere: bomba, collarín, correas"
+  - "Dispositivo de elección para transporte prolongado"
+- **Prioridad:** Alta
+- **Formato:** SVG
+
+#### 17. Infografía: Colocación de Colchón de Vacío Paso a Paso
+- **Ubicación en manual:** BLOQUE_02_6_COLCHON_VACIO.md (línea 355)
+- **Descripción:** Secuencia visual de 10 pasos para colocar el colchón de vacío
+- **Elementos a incluir:**
+  - Control cervical manual
+  - Colocación del colchón
+  - Moldeado
+  - Evacuación de aire
+  - Verificación
+- **Prioridad:** Alta
+- **Formato:** SVG (serie de imágenes)
+
+#### 18. Infografía: Componentes de la Camilla Cuchara
+- **Ubicación en manual:** BLOQUE_02_4_CAMILLA_CUCHARA.md (línea 298)
+- **Descripción:** Diagrama de camilla cuchara separada en dos mitades
+- **Elementos a incluir:**
+  - Dos mitades separables
+  - Indicadores de cierres (torácico y pélvico)
+  - Indicador visual: "Dispositivo de transferencia, no inmovilización definitiva"
+- **Texto a incluir:**
+  - "Camilla cuchara: dos mitades separables"
+  - "Cierres: zona torácica y pélvica"
+- **Prioridad:** Media
+- **Formato:** SVG
+
+---
+
+### BLOQUE 3: MATERIAL SANITARIO Y OXIGENOTERAPIA
+
+#### 19. Diagrama de Configuración para Máxima FiO2
+- **Ubicación en manual:** BLOQUE_03_1B_VENTILACION_BOLSA_MASCARILLA.md (línea 290)
+- **Descripción:** Diagrama mostrando la configuración óptima del sistema de ventilación con bolsa-mascarilla para obtener máxima FiO2
+- **Elementos a incluir:**
+  - Reservorio conectado
+  - Flujo de oxígeno adecuado (15 L/min)
+  - Posición correcta de la mascarilla
+  - Técnica de sellado
+- **Prioridad:** Media
+- **Formato:** SVG
+
+---
+
+### BLOQUE 7: CONDUCCIÓN Y SEGURIDAD VIAL
+
+#### 20. Diagrama de Configuración de GPS Antes de Salir
+- **Ubicación en manual:** BLOQUE_07_4_GESTION_RUTAS_Y_NAVEGACION.md (línea 101)
+- **Descripción:** Diagrama visual mostrando la configuración correcta del GPS antes de iniciar la marcha
+- **Elementos a incluir:**
+  - Configuración ANTES de iniciar marcha
+  - Uso solo de voz si no hay copiloto
+  - Advertencia: no manipular durante conducción
+- **Prioridad:** Baja
+- **Formato:** SVG
+
+---
+
+### BLOQUE 12: MARCO LEGAL ÉTICO PROFESIONAL
+
+#### 21. Diagrama: Toma de Decisiones Éticas en Urgencias
+- **Ubicación en manual:** BLOQUE_12_0_MARCO_LEGAL_ETICO_PROFESIONAL.md (línea 556)
+- **Descripción:** Flujograma de decisión ética en situaciones de urgencia
+- **Elementos a incluir:**
+  - Situación clínica inicial
+  - Valoración de urgencia vital
+  - Ramas: Urgencia vital / No urgencia vital
+  - Actuación inmediata vs contacto médico
+  - Consentimiento y documentación
+- **Nota:** Ya existe una versión en texto ASCII en el archivo, pero necesita ser convertida a diagrama visual profesional
+- **Prioridad:** Media
+- **Formato:** SVG (flujograma)
+
+---
+
+## 📊 RESUMEN POR PRIORIDAD
+
+### 🔴 Alta Prioridad (15 medios)
+1. Diagrama de Selección de Dispositivo de Oxigenoterapia
+2. Tabla Visual de Rangos de FiO2
+3. Infografía: Componentes del Sistema de Inmovilización
+4. Infografía: Selección de Talla de Collarín Cervical
+5. Infografía: Colocación de Collarín Paso a Paso
+6. Infografía: Posición del TES en Inmovilización Manual
+7. Infografía: Técnica de Sujeción Manual
+8. Infografía: Secuencia de Transición en Inmovilización
+9. Infografía: Componentes del Tablero Espinal
+10. Infografía: Colocación de Tablero Espinal Paso a Paso
+11. Infografía: Componentes del Colchón de Vacío
+12. Infografía: Colocación de Colchón de Vacío Paso a Paso
+13. Guía de Colocación de Dispositivos de Oxigenoterapia
+14. Infografía: Verificaciones Post-Colocación de Collarín
+15. Infografía: Coordinación del Equipo en Inmovilización
+
+### 🟡 Media Prioridad (5 medios)
+16. Infografía: Errores Frecuentes en Colocación de Collarín
+17. Infografía: Situaciones que Requieren Inmovilización
+18. Infografía: Componentes de la Camilla Cuchara
+19. Diagrama de Configuración para Máxima FiO2
+20. Diagrama: Toma de Decisiones Éticas en Urgencias
+
+### 🟢 Baja Prioridad (1 medio)
+21. Diagrama de Configuración de GPS Antes de Salir
+
+---
+
+## 📁 ESTRUCTURA RECOMENDADA PARA ARCHIVOS
+
+```
+public/
+└── assets/
+    ├── infografias/
+    │   ├── bloque-0-fundamentos/
+    │   │   ├── diagrama-seleccion-dispositivo-oxigeno.svg
+    │   │   ├── tabla-rangos-fio2.svg
+    │   │   └── guia-colocacion-dispositivos-oxigeno.svg
+    │   ├── bloque-2-inmovilizacion/
+    │   │   ├── componentes-sistema-inmovilizacion.svg
+    │   │   ├── seleccion-talla-collarín.svg
+    │   │   ├── colocacion-collarín-paso-1.svg
+    │   │   ├── colocacion-collarín-paso-2.svg
+    │   │   ├── ... (más pasos)
+    │   │   ├── verificaciones-post-colocacion.svg
+    │   │   ├── errores-frecuentes-collarín.svg
+    │   │   ├── posicion-tes-inmovilizacion-manual.svg
+    │   │   ├── tecnica-sujecion-manual.svg
+    │   │   ├── situaciones-requieren-inmovilizacion.svg
+    │   │   ├── secuencia-transicion-inmovilizacion.svg
+    │   │   ├── coordinacion-equipo-inmovilizacion.svg
+    │   │   ├── componentes-tablero-espinal.svg
+    │   │   ├── colocacion-tablero-espinal-paso-1.svg
+    │   │   ├── ... (más pasos)
+    │   │   ├── componentes-colchon-vacio.svg
+    │   │   ├── colocacion-colchon-vacio-paso-1.svg
+    │   │   ├── ... (más pasos)
+    │   │   └── componentes-camilla-cuchara.svg
+    │   ├── bloque-3-material-sanitario/
+    │   │   └── configuracion-maxima-fio2.svg
+    │   ├── bloque-7-conduccion/
+    │   │   └── configuracion-gps.svg
+    │   └── bloque-12-marco-legal/
+    │       └── diagrama-decisiones-eticas.svg
+    └── diagramas/
+        └── (diagramas adicionales si se necesitan)
+```
+
+---
+
+## 🎨 ESPECIFICACIONES TÉCNICAS
+
+### Formato Recomendado
+- **SVG** (preferido): Escalable, ligero, editable
+- **PNG** (alternativa): Alta resolución (300 DPI mínimo)
+
+### Dimensiones
+- **Infografías completas:** 1200x800px mínimo
+- **Diagramas paso a paso:** 800x600px por paso
+- **Tablas visuales:** 1000x700px
+
+### Estilo Visual
+- **Colores:** Consistente con la paleta de la app (azul primario, rojo para emergencias)
+- **Tipografía:** Sans-serif, legible en móvil
+- **Iconos:** Estilo consistente (lucide-react o similar)
+- **Contraste:** WCAG AA mínimo
+
+### Accesibilidad
+- Texto alternativo descriptivo para cada imagen
+- Contraste adecuado para texto sobre fondos
+- Versión en texto disponible para lectores de pantalla
+
+---
+
+## 📝 NOTAS IMPORTANTES
+
+1. **No hay referencias a archivos multimedia existentes** en los archivos .md actuales
+2. **Todas las infografías mencionadas están documentadas pero no creadas**
+3. **Las descripciones detalladas están en los archivos .md** en las secciones "Puntos Clave TES" o "Contenido para Infografía"
+4. **Prioridad alta** se asigna a medios relacionados con procedimientos críticos (inmovilización, oxigenoterapia)
+5. **Formato SVG recomendado** para mejor escalabilidad y rendimiento en la app
+
+---
+
+## ✅ PRÓXIMOS PASOS
+
+1. Crear estructura de carpetas `public/assets/infografias/`
+2. Diseñar infografías de alta prioridad primero
+3. Integrar referencias en archivos .md usando sintaxis Markdown estándar: `![Descripción](./assets/infografias/ruta.svg)`
+4. Actualizar componentes React para mostrar infografías cuando estén disponibles
+5. Validar accesibilidad y contraste de todas las imágenes
+
+---
+
+**Última actualización:** 2025-01-27  
+**Total de medios identificados:** 21 medios faltantes documentados
--- a/VERIFICACION_ENLACES_PAGINA_PRINCIPAL.md
+++ b/VERIFICACION_ENLACES_PAGINA_PRINCIPAL.md
@ -0,0 +1,84 @@
+# ✅ Verificación de Enlaces de la Página Principal
+
+**Fecha:** 2025-12-17
+
+---
+
+## 📋 Enlaces de Emergencias Críticas
+
+### ✅ RCP / Parada
+**Ruta:** `/rcp`  
+**Componente:** `src/pages/RCP.tsx`  
+**Estado:** ✅ **FUNCIONA CORRECTAMENTE**
+
+**Contenido:**
+- Página dedicada con protocolo RCP completo
+- Tabs para Adulto/Pediátrico
+- Protocolos SVB y SVA
+- Enlaces relacionados a Vía Aérea y Soporte Vital
+
+---
+
+### ✅ Código Ictus
+**Ruta:** `/ictus`  
+**Componente:** `src/pages/Ictus.tsx`  
+**Estado:** ✅ **FUNCIONA CORRECTAMENTE**
+
+**Contenido:**
+- Test FAST explicado
+- Protocolo de activación inmediata
+- Valoración inicial
+- Manejo prehospitalario
+- Criterios de exclusión
+- Enlaces relacionados
+
+---
+
+### ✅ Shock Hemorrágico
+**Ruta:** `/shock`  
+**Componente:** `src/pages/Shock.tsx`  
+**Estado:** ✅ **FUNCIONA CORRECTAMENTE**
+
+**Contenido:**
+- Clasificación del shock (Clase I-IV)
+- Protocolo de actuación completo
+- Hipotensión permisiva explicada
+- Enlaces relacionados
+
+---
+
+### ✅ Vía Aérea
+**Ruta:** `/via-aerea`  
+**Componente:** `src/pages/ViaAerea.tsx`  
+**Estado:** ✅ **FUNCIONA CORRECTAMENTE**
+
+**Contenido:**
+- Valoración inicial (Leve vs Grave)
+- Protocolo OVACE completo
+- Variaciones por edad (Adultos vs Lactantes)
+- Manejo si pierde consciencia
+- Referencia a IOT
+- Enlaces relacionados
+
+---
+
+## 📊 Resumen
+
+| Botón | Ruta | Página | Estado |
+|-------|------|--------|--------|
+| RCP / Parada | `/rcp` | `RCP.tsx` | ✅ Funciona |
+| Código Ictus | `/ictus` | `Ictus.tsx` | ✅ Funciona |
+| Shock Hemorrágico | `/shock` | `Shock.tsx` | ✅ Funciona |
+| Vía Aérea | `/via-aerea` | `ViaAerea.tsx` | ✅ Funciona |
+
+---
+
+## ✅ Conclusión
+
+**Todos los enlaces de la página principal están correctamente configurados y funcionan.**
+
+Cada botón lleva a una página dedicada con contenido completo del protocolo correspondiente.
+
+---
+
+**Estado:** ✅ **TODOS LOS ENLACES VERIFICADOS Y FUNCIONANDO**
--- a/public/sw.js
+++ b/public/sw.js
@ -4,12 +4,21 @@
 const CACHE_NAME = 'emerges-tes-v1';
 const RUNTIME_CACHE = 'emerges-tes-runtime-v1';

+// Detectar base path dinámicamente (para GitHub Pages)
+const BASE_PATH = self.location.pathname.split('/').slice(0, -1).join('/') || '/';
+const normalizePath = (path) => {
+  if (path.startsWith('/')) {
+    return BASE_PATH === '/' ? path : `${BASE_PATH}${path}`;
+  }
+  return `${BASE_PATH}/${path}`;
+};
+
 // Archivos estáticos a cachear en la instalación
 const STATIC_ASSETS = [
-  '/',
-  '/index.html',
-  '/manifest.json',
-  '/favicon.ico',
+  normalizePath('/'),
+  normalizePath('/index.html'),
+  normalizePath('/manifest.json'),
+  normalizePath('/favicon.ico'),
 ];

 // Instalación del Service Worker
@ -122,7 +131,7 @@ async function networkFirst(request) {
    // Si no hay cache y estamos offline, retornar index.html para SPA
    if (request.mode === 'navigate') {
      const indexCache = await caches.open(CACHE_NAME);
-      const indexHtml = await indexCache.match('/index.html');
+      const indexHtml = await indexCache.match(normalizePath('/index.html'));
      if (indexHtml) {
        return indexHtml;
      }
--- a/src/main.tsx
+++ b/src/main.tsx
@ -5,8 +5,10 @@ import "./index.css";
 // Registrar Service Worker para PWA
 if ('serviceWorker' in navigator) {
  window.addEventListener('load', () => {
+    // Detectar base path dinámicamente (para GitHub Pages)
+    const base = import.meta.env.BASE_URL || '/';
    navigator.serviceWorker
-      .register('/sw.js')
+      .register(`${base}sw.js`)
      .then((registration) => {
        console.log('SW registered:', registration);
        
--- a/src/pages/ViaAerea.tsx
+++ b/src/pages/ViaAerea.tsx
@ -129,7 +129,7 @@ const ViaAerea = () => {
          <div className="bg-muted/50 rounded-lg p-4">
            <div className="font-semibold text-foreground mb-2 flex items-center gap-2">
              <Users className="w-4 h-4" />
-              Adultos y Niños (>1 año)
+              Adultos y Niños (&gt;1 año)
            </div>
            <ul className="text-sm text-muted-foreground space-y-1">
              <li>• 5 golpes interescapulares</li>
--- a/vite-plugin-manifest.ts
+++ b/vite-plugin-manifest.ts
@ -0,0 +1,65 @@
+import type { Plugin } from 'vite';
+import { readFileSync } from 'fs';
+import { resolve } from 'path';
+
+/**
+ * Plugin de Vite para generar manifest.json dinámicamente con el base path correcto
+ * Esto asegura que las rutas funcionen tanto en desarrollo como en GitHub Pages
+ */
+export function manifestPlugin(): Plugin {
+  let basePath = '/';
+
+  return {
+    name: 'manifest-plugin',
+    configResolved(config) {
+      // Capturar el base path de la configuración de Vite
+      basePath = config.base;
+    },
+    generateBundle() {
+      // Leer el manifest.json base
+      const manifestPath = resolve(__dirname, 'public/manifest.json');
+      const manifestContent = readFileSync(manifestPath, 'utf-8');
+      const manifest = JSON.parse(manifestContent);
+
+      // Normalizar base path (asegurar que termine con /)
+      const base = basePath === '/' ? '/' : basePath.endsWith('/') ? basePath : `${basePath}/`;
+      
+      // Actualizar rutas en el manifest para que sean relativas al base path
+      manifest.start_url = base;
+      manifest.scope = base;
+
+      // Actualizar rutas de iconos
+      if (manifest.icons) {
+        manifest.icons = manifest.icons.map((icon: any) => ({
+          ...icon,
+          src: icon.src.startsWith('/') 
+            ? `${base}${icon.src.slice(1)}` 
+            : `${base}${icon.src}`
+        }));
+      }
+
+      // Actualizar rutas de shortcuts
+      if (manifest.shortcuts) {
+        manifest.shortcuts = manifest.shortcuts.map((shortcut: any) => ({
+          ...shortcut,
+          url: shortcut.url.startsWith('/')
+            ? `${base}${shortcut.url.slice(1)}`
+            : `${base}${shortcut.url}`,
+          icons: shortcut.icons?.map((icon: any) => ({
+            ...icon,
+            src: icon.src.startsWith('/')
+              ? `${base}${icon.src.slice(1)}`
+              : `${base}${icon.src}`
+          }))
+        }));
+      }
+
+      // Escribir el manifest.json procesado
+      this.emitFile({
+        type: 'asset',
+        fileName: 'manifest.json',
+        source: JSON.stringify(manifest, null, 2)
+      });
+    }
+  };
+}
--- a/vite.config.ts
+++ b/vite.config.ts
@ -1,6 +1,7 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react-swc";
 import path from "path";
+import { manifestPlugin } from "./vite-plugin-manifest";

 // Detectar si estamos en GitHub Pages
 // GitHub Pages usa el formato: https://username.github.io/repository-name/
@ -20,7 +21,10 @@ export default defineConfig({
      strict: true,
    },
  },
-  plugins: [react()],
+  plugins: [
+    react(),
+    manifestPlugin(),
+  ],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),