Files
localesp/openspec/changes/pasarela-proponer-local/specs/boton-flotante-proponer-local/spec.md
T
edgar.friendly 003b1e209f
deploy-branch / deploy (push) Failing after 6s
deploy-branch / teardown (push) Skipped
feat(propuesta): pasarela paso a paso con autodetección de ubicación y FAB
- Campo universal de ubicación (Google Maps/Waze/OSM/coordenadas/dirección)
  sobre proveedores extensibles (src/utils/ubicacion) con resolver e inferencia
  inversa Nominatim (nombre/provincia pre-rellenados, alias cooficiales)
- FAB flotante abajo a la derecha que abre la pasarela en un modal accesible
  (Escape, foco contenido, responsive); sin descripción ni puntuación;
  avisos de duplicado y filtro de palabras dentro del modal
- Aviso PWA reposicionado: tarjeta abajo a la izquierda en móvil,
  botón compacto arriba a la izquierda en PC (no tapa el FAB)
- Suite de pruebas: 88 unitarias/componente (vitest + RTL, offline) y
  10 de integración (supertest + SQLite :memory: y Nominatim real opt-in)
- CI: workflow de Gitea Actions con npm test + build en push/PR e
  integración manual
2026-08-16 01:35:02 +02:00

2.0 KiB

Botón flotante para proponer locales

ADDED Requirements

Requirement: Botón flotante fijo en la esquina inferior derecha

El sistema SHALL mostrar un botón de acción flotante (FAB) fijado en la esquina inferior derecha de la ventana, siempre visible sobre el contenido, tanto en PC como en móvil.

Scenario: Visible en escritorio

  • WHEN la página se carga en una pantalla de escritorio
  • THEN el botón flotante aparece fijado en la esquina inferior derecha, por encima del resto del contenido

Scenario: Visible en móvil

  • WHEN la página se carga o se hace scroll en un dispositivo móvil
  • THEN el botón flotante permanece fijo y accesible en la esquina inferior derecha, sin quedar oculto por el contenido ni interferir con la barra inferior existente

Scenario: Reemplazo del botón de cabecera

  • WHEN la página se carga
  • THEN ya no existe el botón "Proponer local" en la cabecera y el único punto de entrada para proponer un local es el botón flotante

Requirement: Tooltip explicativo al pasar el ratón

El botón flotante SHALL mostrar un tooltip al pasar el ratón por encima (hover) y al recibir foco por teclado, explicando que sirve para añadir un nuevo local.

Scenario: Tooltip en hover

  • WHEN el usuario pasa el ratón por encima del botón flotante
  • THEN aparece un tooltip con un texto explicativo del tipo "Añade un nuevo local al directorio"

Scenario: Tooltip accesible sin ratón

  • WHEN el botón flotante recibe el foco por teclado o se consulta con un lector de pantalla
  • THEN el botón expone su propósito mediante aria-label, de modo que la función sea accesible sin depender del hover

Requirement: El botón abre la pasarela en un modal

El botón flotante SHALL abrir, al pulsarlo, la pasarela de propuesta de local en un modal por encima de la página.

Scenario: Apertura de la pasarela

  • WHEN el usuario pulsa el botón flotante
  • THEN se abre un modal con la pasarela de propuesta, comenzando por la primera pantalla (Ubicación)