See if this works...
Add the following CSS to your user.css.
This should do the following:
- Collapse the outside columns of site-grid, so your site is full width.
- Move container-sidebar-left to the left side of the screen, just like the left hand menu in the backend.
More CSS may be needed. I.e. on smaller screens sidebar-left is displayed after sidebar-right.
Add the following CSS to your user.css.
This should do the following:
- Collapse the outside columns of site-grid, so your site is full width.
- Move container-sidebar-left to the left side of the screen, just like the left hand menu in the backend.
More CSS may be needed. I.e. on smaller screens sidebar-left is displayed after sidebar-right.
Code:
.container-sidebar-left { /* Make sidebar-left span full width of the screen (for smaller screens) */ grid-column: full-start / full-end;}@media (width >= 992px) { .site-grid { /* Collapse outside columns on bigger screens, but use the same number of columns and names from Cassiopeia */ grid-template-columns: [full-start]0[main-start]repeat(4,1fr)[main-end]0[full-end]; } .container-sidebar-left { /* Span sidebar-left over 2 columns, starting from [full-start] (declared above) */ grid-column: span 2; }}
Statistics: Posted by Mr. Wimpy — Fri Sep 27, 2024 3:23 pm