boost/website-v2
2
0
Fork 0
mirror of https://github.com/boostorg/website-v2.git synced 2026-01-19 04:42:17 +00:00
Code Issues Projects Releases Wiki Activity

Fix docs iframe height blocking article navigation (#1997)

Browse Source
This commit is contained in:
Julio C. Estrada
2025-11-12 09:54:15 -05:00
committed by GitHub
parent c980879935
commit d21b5710ef
2 changed files with 75 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
frontend/styles.css
View File

@@ -116,17 +116,60 @@
}
}
:root {
--header-height: 41px;
--version-alert-height: 0px;
}
html:has(#docsiframe):has(.version_alert) {
overflow-y: auto;
}
html:has(#docsiframe) .header-menu-bar.topnavbar {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
}
html:has(#docsiframe) .bg-white:has(.version_alert),
html:has(#docsiframe) .version_alert {
position: fixed;
top: var(--header-height, 41px);
left: 0;
right: 0;
z-index: 999;
width: 100%;
}
html:has(#docsiframe):has(.version_alert) {
--version-alert-height: 32px;
}
html:has(#docsiframe) body {
padding-top: calc(var(--header-height, 41px) + var(--version-alert-height, 0px));
}
#docsiframe {
@apply w-full mx-0 my-auto overflow-hidden p-0;
height: calc(100vh - 2.6rem)
@apply w-full mx-0 my-auto overflow-hidden p-0 mt-[1px];
height: calc(100vh - var(--header-height, 41px) - var(--version-alert-height, 0px)); /* Fallback for older browsers*/
height: calc(100svh - var(--header-height, 41px) - var(--version-alert-height, 0px));
max-height: calc(100svh - var(--header-height, 41px) - var(--version-alert-height, 0px));
}
.version_alert {
@apply py-2 px-3 mt-2 mb-3 text-center rounded-sm bg-yellow-200/70
@apply py-2 px-3 mt-2 mb-3 text-center rounded-sm bg-yellow-200/70;
}
html:has(#docsiframe) .version_alert {
@apply py-1 px-3 mt-0 text-center rounded-sm bg-yellow-200/70;
}
.version_alert p {
@apply p-0 m-0 text-center;
}
.version_alert a {
@apply font-semibold underline dark:text-white text-charcoal
@apply font-semibold underline dark:text-white text-charcoal;
}

29
templates/docsiframe.html
View File

@@ -11,7 +11,7 @@
{% block content %}
{# alert for non-current Boost versions #}
<div class="bg-white dark:text-white text-slate dark:bg-charcoal dark:bg-neutral-700 py-1">
<div class="bg-white dark:text-white text-slate dark:bg-charcoal dark:bg-neutral-700">
{% include "libraries/includes/version_alert.html" %}
</div>
<iframe
@@ -25,6 +25,33 @@
id="docsiframe"
></iframe>
<script>
function updateVersionAlertHeight() {
const alert = document.querySelector('.version_alert');
if (alert && document.getElementById('docsiframe')) {
document.documentElement.style.setProperty('--version-alert-height', Math.ceil(alert.getBoundingClientRect().height) + 'px');
}
}
(function() {
const alert = document.querySelector('.version_alert');
if (!alert) return;
let rafId = null;
const update = () => {
if (rafId) cancelAnimationFrame(rafId);
rafId = requestAnimationFrame(() => {
updateVersionAlertHeight();
rafId = null;
});
};
requestAnimationFrame(updateVersionAlertHeight);
window.addEventListener('resize', update);
if (window.ResizeObserver) {
new ResizeObserver(update).observe(alert);
}
})();
function iframeCustomizations(iframe) {
let iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
{#resizeIframe(iframe);#}