1. Get rid of the left sidebar as well and use the whole width: #left-sidebar-container {display:none) .subgrid-container {max-width:unset} div.grid-container{display:block}
2. Instead of getting rid of the side bars, hide them off-screen and display them on hover: #right-sidebar-container { position:fixed; z-index:10; top:60px; right:-300px; display:block!important; } #right-sidebar-container:hover {right:0;} #left-sidebar-container { position:fixed; z-index:10; top:60px; left:-330px; display:block!important; } #left-sidebar-container:hover {left:0;} The visible area for hovering is so thin because if it's bigger it covers the prev/next buttons of the lightbox and I couldn't figure out how to move them; span[slot="prevButton"] wouldn't work.
Awesome update! :) Obligatory may I suggest... :D
1. Get rid of the left sidebar as well and use the whole width:
#left-sidebar-container {display:none)
.subgrid-container {max-width:unset}
div.grid-container{display:block}
2. Instead of getting rid of the side bars, hide them off-screen and display them on hover:
#right-sidebar-container {
position:fixed;
z-index:10;
top:60px;
right:-300px;
display:block!important;
}
#right-sidebar-container:hover {right:0;}
#left-sidebar-container {
position:fixed;
z-index:10;
top:60px;
left:-330px;
display:block!important;
}
#left-sidebar-container:hover {left:0;}
The visible area for hovering is so thin because if it's bigger it covers the prev/next buttons of the lightbox and I couldn't figure out how to move them; span[slot="prevButton"] wouldn't work.