CBarreraB
commented
8 months ago En esta iteración, se han realizado ajustes y mejoras en la estructura y diseño del sitio web, centrándose en la sección de la barra de navegación y la experiencia del usuario en diferentes dispositivos.
Por ahora tendremos las secciones:
Tienda (https://shop.actualizatucarro.com/) - Como comprar - Blog - Nosotros
Los Botones :
Carroito de compras (https://shop.actualizatucarro.com/) - Ayuda (formulario de contacto) - Modo de visualización
Vista Desktop:
Centrado del modulo central
Ajuste de la altura de la barra de navegación para una mejor visualización en dispositivos de escritorio y tablet.
Implementación del efecto hover en los botones para que sea como el de los titulos que cambie a rojo cuando pases sobre ellos.
Agregado de un enlace en el logo que dirige al usuario al inicio (home) del sitio.
En la version Tablet seran los mismos puntos
La altura de la Navbar y la la distibucion homojenea de su contenido.
El navbar se divide en tres secciones: la Lateral Izquierda, el Módulo Central y la Lateral Derecha.
En la sección Lateral Izquierda:
Encontramos un menú lateral que proporciona acceso a todas las vistas de la página. Cuando se visualiza en dispositivos móviles, se agregan categorías y marcas adicionales a este menú.
El logotipo de la NavBar está compuesto por dos imágenes, una para la versión móvil y otra para desktop.
En el Módulo Central:
Esta limpio y minimalista.
En el Módulo Lateral Derecho:
Contiene un icono que proporciona acceso al formulario de contacto, acceder al carrito de compras (que estara conectado al eShop tendra un link al eshop (https://shop.actualizatucarro.com/) el cual se abrira en una nueva ventana). así como un botón para alternar entre el modo noche y día.
Este módulo siempre se adapta al lado derecho de la pantalla.
El fondo del navbar tiene un efecto llamado "Blur", que se aplica para crear un fondo difuminado mientras la barra permanece fija y visible en todo momento.
La barra de navegación se ajusta automáticamente al ancho de la pantalla, colocando los módulos en sus lados respectivos y manteniendo el módulo central siempre en el medio de la pantalla.
Los iconos estan en la carpeta public/icons