El video muestra la interfaz del frontend de la tienda ("Tu tienda de confianza reborXstore") durante el proceso de validación de un ID correcto. El usuario introduce un ID válido ("1983371647") y hace clic en verificar. El sistema responde exitosamente mostrando únicamente el producto que ese jugador tiene disponible para comprar (un pase de nivel).
A continuación, el usuario cambia de pestaña para mostrar una página web de referencia. En esta otra página, se observa que tras validar una cuenta, los pases que el usuario no puede comprar no desaparecen de la pantalla; en su lugar, se mantienen visibles pero con un estilo visual apagado (oscurecidos) y con un texto que dice "No Disponible". El usuario vuelve a su página original para recalcar que no quiere que su sistema elimine visualmente las tarjetas de los productos inactivos, sino que aplique ese mismo efecto de oscurecimiento.
El objetivo de este video es solicitar un cambio específico en el Renderizado Condicional (UI) posterior a la validación exitosa de un ID.
Actualmente, el sistema está programado para ocultar o eliminar del DOM aquellas tarjetas de productos (pases de nivel) que el usuario no es elegible para comprar. El requerimiento exacto es modificar este comportamiento para que todos los paquetes se mantengan visibles siempre en la cuadrícula.
La lógica visual a aplicar mediante CSS/HTML tras recibir la respuesta de la API debe ser:
