maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adjust menu popup behavior contextually (#20718)

Browse source
This commit is contained in:
Ben Halpern 2024-03-01 17:27:50 -05:00 • committed by GitHub
parent f2968baadb
commit 0140a7631c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
app/assets/stylesheets/billboards.scss
View file

@ -58,16 +58,13 @@
animation: popoverEnter 0.5s;
box-shadow: 0 0 100px 60px rgba(0, 0, 0, 0.2) !important;
max-height: calc(100vh - var(--header-height));
overflow-y: auto;
.text-styles {
padding-top: var(--su-4);
padding-bottom: var(--su-4);
font-size: calc(0.8em + 0.58vw);
max-width: calc(var(--site-width) - var(--su-8));
}
.sponsorship-dropdown {
top: auto;
bottom: var(--su-8);
overflow-y: auto;
max-height: calc(100vh - var(--header-height) - var(--su-8));
}
@media (min-width: $breakpoint-xl) {
.crayons-sponsorship__header,
@ -80,6 +77,13 @@
}
}
.popover-billboard--menuopenupwards {
.sponsorship-dropdown {
top: auto;
bottom: var(--su-8);
}
}
.hide-popover-billboard .popover-billboard {
display: none;
}

6
app/javascript/utilities/billboardInteractivity.jsx
View file

@ -21,6 +21,12 @@ export function setupBillboardInteractivity() {
sponsorshipDropdownButton.dataset.initialized = 'true';
}
const popoverParent = sponsorshipDropdownButton.closest('.popover-billboard');
if (popoverParent &&
sponsorshipDropdownButton.getBoundingClientRect().top > window.innerHeight / 2) {
popoverParent.classList.add('popover-billboard--menuopenupwards');
}
});
}
const sponsorshipCloseButtons = document.querySelectorAll(