page-sidebar
code:app.css
.page-column {
display: grid;
align-items: flex-start;
flex-wrap: nowrap;
justify-content: center;
gap: 10px;
grid-template-columns: 46px minmax(200px, 960px) min-content;
grid-template-areas: "spacer page menu";
margin-top: 16px
}
@media(767px < width) {
.page-column:has(.page-sidebar) {
grid-template-columns: minmax(200px, 3fr) minmax(170px, 1fr) min-content;
grid-template-areas: "page sidebar menu"
}
.page-column {
grid-template-columns: minmax(200px, 960px) min-content;
grid-template-areas: "page menu"
}
}
@media(max-width: 767px) {
.page-column {
display: flex
}
}