Tenemos el sidebar configurado en nuestro sitio, que es en su mayoría privado con un poco de contenido público.
Estamos muy interesados en que la barra lateral solo esté activa cuando el usuario haya iniciado sesión (es decir, que no se muestre a anon).
He probado este CSS:
// ocultar la barra lateral de los usuarios que no han iniciado sesión (desordena el diseño, desafortunadamente)
.anon {
.sidebar-wrapper, .header-sidebar-toggle {
display: none;
}
}
Esto efectivamente oculta la barra lateral, pero el diseño de la barra lateral permanece (y no se ve bien). ¿Hay una mejor manera?
Sé que podríamos cambiar a la nueva vista de menú desplegable en la cabecera (en navigation_menu) y ordenarlo de esa manera, pero realmente nos gustaría tener la barra lateral visible para nuestros usuarios conectados (sin hacer clic) si es posible.
Con esto puedes ocultar la barra lateral para anónimos.
Común / CSS
html.anon {
// Ocultar la barra lateral estrecha de escritorio
// versión móvil de la barra lateral que también se activa en el escritorio con un ancho inferior a 1000px
.d-header .hamburger-panel {
display: none;
}
// Ocultar la capa del encabezado cuando se abre el menú
.header-cloak {
display: none !important;
}
}
Escritorio / CSS
html.anon {
// Si la barra lateral está abierta, usa el estilo cerrado
body.has-sidebar-page {
#main-outlet-wrapper {
grid-template-columns: 0 minmax(0, 1fr);
gap: 0;
padding-left: 10px;
}
.wrap {
max-width: var(--d-max-width);
}
}
// Ocultar el botón de hamburguesa
.header-sidebar-toggle {
display: none;
}
}
Móvil / CSS
html.anon {
// Ocultar el botón de hamburguesa
.d-header-icons {
.header-dropdown-toggle {
&.hamburger-dropdown {
display: none;
}
}
}
}
