Cuando el componente temático header submenus está activo, los iconos en la parte inferior de la barra lateral desaparecen de la pantalla.
¿Probablemente hay algún tipo de cálculo CSS que va en la dirección equivocada?
4 Me gusta
Los encabezados personalizados no se incluyen en el cálculo en absoluto, esto se puede reproducir añadiendo cualquier contenido a la sección header de un tema.
El cálculo que utilizamos para la barra lateral y el chat tiene en cuenta la altura del encabezado de Discourse y establece --header-offset como una variable al calcular algunas alturas.
Incluir encabezados personalizados podría ser un poco complicado porque el contenido del encabezado personalizado no se fija al desplazarse de forma predeterminada como lo hace el encabezado de Discourse… así que si lo incluimos en el cálculo de forma predeterminada, una vez que te desplazas y el encabezado personalizado desaparece, la altura es incorrecta.
Así que, por ejemplo, si aumento manualmente --header-offset en la altura de mi encabezado personalizado (es aproximadamente 60px por defecto), obtienes un espacio encima de la barra lateral al desplazarte:
Añadimos una clase .docked al body una vez que un encabezado personalizado se desplaza fuera de la vista, por lo que es posible usar esto… lo cual es mejor, pero hay una transición notable ya que la altura de la barra lateral se ajusta entre estados… esto se debe a que .docked está activado o desactivado.
Si quieres un encabezado fijo, esto es un poco más fácil de solucionar… porque puedes aumentar --header-offset en la altura del encabezado personalizado, y luego establecer el valor top de .d-header-wrap como la altura del encabezado personalizado:
Una solución que se me ocurre para mejorar el caso del encabezado no fijo es:
- Comprobar la altura del encabezado personalizado.
- Incluir la altura del encabezado personalizado en
--header-offset. - De-incrementar la altura del encabezado personalizado utilizada en el cálculo de
--header-offsetbasándose en la posición de desplazamiento. Esto ajustará la altura de la barra lateral de forma más gradual de lo que la clase.dockedpuede hacer.
Podría llevar algo de experimentación para hacerlo bien…
5 Me gusta
Eso es muy útil, gracias @awesomerobot
(movido a UX)
4 Me gusta
Esto se ha implementado aquí (muchas gracias a @david):
Esto debería resolver problemas con la barra lateral, el chat y otros problemas con el contenido del encabezado personalizado.
4 Me gusta