fix grid column spacing mobile

This commit is contained in:
isUnknown 2025-02-21 12:43:48 +01:00
parent 28fc768228
commit 18db74998d
3 changed files with 18 additions and 10 deletions

View file

@ -20,8 +20,12 @@
transform: translateY(-1px);
}
[data-template="home"] .title-wrapper button.open-nav {
display: inline-block !important;
}
@media screen and (max-width: 640px) {
.open-nav {
#main-footer .open-nav {
box-sizing: border-box;
bottom: 0;
display: flex;
@ -60,10 +64,6 @@
display: none !important;
}
[data-template="home"] button.open-nav {
display: inline-block !important;
}
.open-nav-wrapper {
padding: 0;
border: none;

View file

@ -25,6 +25,12 @@ body.full-width #main-content {
margin-left: inherit;
}
@media screen and (max-width: 640px) {
.grid .column:not(:last-child) {
margin-bottom: calc(2 * var(--unit--vertical));
}
}
@media screen and (min-width: 640px) {
[data-template="grid"] main #main-content {
margin-left: calc(0px - calc(4 * var(--unit--horizontal)));

View file

@ -127,7 +127,7 @@ function subscribe(event) {
const panelNav = document.querySelector(".panel");
const navOverlay = document.querySelector("#nav-overlay");
const openNavBtn = document.querySelector("button.open-nav");
const openNavBtns = document.querySelectorAll("button.open-nav");
const closeNavBtn = document.querySelector(".panel-close");
function closeNav() {
panelNav.classList.remove("panel--visible");
@ -193,11 +193,13 @@ document.addEventListener("DOMContentLoaded", () => {
});
});
openNavBtns.forEach((openNavBtn) => {
openNavBtn.addEventListener("click", () => {
panelNav.classList.add("panel--visible");
navOverlay.classList.add("nav-overlay--visible");
document.body.classList.add("no-scroll");
});
});
closeNavBtn.addEventListener("click", () => {
closeNav();