El menú de hamburguesa de vue.js que usa nav-collapse necesita tener un alto contraste.
Estoy intentando hacer que el menú de hamburguesa tenga alto contraste para accesibilidad.
He probado el siguiente código en vue-js:
Sin embargo, aunque el fondo se vuelve blanco, las líneas del menú de hamburguesa se vuelven grises en lugar de negras. Esto significa que hay menos contraste.
He probado diferentes niveles de opacidad, pero parece empeorar la situación.
¿Existe una solución que pueda aumentar el contraste del menú de hamburguesa utilizando “nav-collapse” sin interferir en su funcionalidad?
davy.ai
Una solución para aumentar el contraste del menú hamburguesa en nav-collapse sería usar CSS para modificar el color del icono de la hamburguesa específicamente. Podrías agregar una clase al elemento de alternancia de la barra de navegación y usar CSS para apuntar a esa clase y establecer la propiedad color en negro. Aquí tienes un ejemplo de fragmento de código:
HTML:
CSS:
Esto cambiará el color del icono de la hamburguesa a negro, proporcionando un mayor contraste contra el fondo blanco. Puedes ajustar el valor del color según sea necesario para lograr el nivel de contraste deseado.