This commit is contained in:
traveler 2025-12-30 08:59:17 -06:00
parent 48ee6d6e3e
commit ce8e73615a

View file

@ -35,13 +35,10 @@ body.tab-nucking-futz {
/* ----------------------------- */ /* ----------------------------- */
/* Readability / tone-down layer */ /* Readability / tone-down layer */
/* ----------------------------- */ /* ----------------------------- */
/* Let more background show through */
#page-wrapper { #page-wrapper {
background-color: rgba(0, 0, 0, 0.40); background-color: rgba(0, 0, 0, 0.40);
} }
/* Make service cards and widgets pop (slightly transparent) */
.service-card, .service-card,
.widget { .widget {
background: rgba(20, 20, 20, 0.70) !important; background: rgba(20, 20, 20, 0.70) !important;
@ -52,8 +49,6 @@ body.tab-nucking-futz {
/* ----------------------------- */ /* ----------------------------- */
/* PNCHarris: narrow centered column */ /* PNCHarris: narrow centered column */
/* ----------------------------- */ /* ----------------------------- */
/* Constrain the real content container */
body.tab-pncharris main { body.tab-pncharris main {
max-width: 900px; max-width: 900px;
margin: 0 auto !important; margin: 0 auto !important;
@ -61,7 +56,6 @@ body.tab-pncharris main {
padding-right: 16px; padding-right: 16px;
} }
/* Constrain sections/groups too */
body.tab-pncharris section, body.tab-pncharris section,
body.tab-pncharris .group { body.tab-pncharris .group {
max-width: 900px; max-width: 900px;
@ -69,19 +63,17 @@ body.tab-pncharris .group {
margin-right: auto !important; margin-right: auto !important;
} }
/* Relax stretching on PNCHarris */
body.tab-pncharris .service-card, body.tab-pncharris .service-card,
body.tab-pncharris .widget { body.tab-pncharris .widget {
width: auto !important; width: auto !important;
max-width: 100% !important; max-width: 100% !important;
} }
/* ----------------------------- */ /* ========================================================= */
/* GLANCE TAB: make the "glance" iframe fill most of the page */ /* GLANCE TAB: make the Glance iframe fill most of the page */
/* Targets ONLY iframe widget with name="glance" */ /* ========================================================= */
/* ----------------------------- */
/* Use full width on Glance tab */ /* Give the tab full width */
body.tab-glance main { body.tab-glance main {
max-width: none !important; max-width: none !important;
margin: 0 !important; margin: 0 !important;
@ -89,34 +81,74 @@ body.tab-glance main {
padding-right: 12px !important; padding-right: 12px !important;
} }
/* Force a single wide column on Glance tab */ /* Force single column layout on Glance tab */
body.tab-glance .service-grid, body.tab-glance .service-grid,
body.tab-glance .services { body.tab-glance .services {
grid-template-columns: 1fr !important; grid-template-columns: 1fr !important;
} }
/* Prefer modern selector to expand only the card containing the glance iframe */ /* Helper: compute "available" height under the header/nav.
body.tab-glance .service-card:has(iframe[name="glance"]) { If your header is taller/shorter, tweak 170px to 140220px. */
body.tab-glance {
--glance-vh: calc(100vh - 170px);
}
/* Expand ANY card on the Glance tab that contains our Glance iframe */
body.tab-glance .service-card:has(iframe[name="glance"]),
body.tab-glance .service-card:has(iframe[src*="home.netgrimoire.com"]),
body.tab-glance .widget:has(iframe[name="glance"]),
body.tab-glance .widget:has(iframe[src*="home.netgrimoire.com"]) {
grid-column: 1 / -1 !important; grid-column: 1 / -1 !important;
max-width: 100% !important; max-width: 100% !important;
height: calc(100vh - 160px) !important; /* adjust (140-200px) if needed */
overflow: hidden !important; /* The important part: make the container tall */
height: var(--glance-vh) !important;
min-height: var(--glance-vh) !important;
/* Remove padding that can reduce the iframe size */
padding: 0 !important; padding: 0 !important;
overflow: hidden !important;
border-radius: 12px !important; border-radius: 12px !important;
} }
/* Make the glance iframe fill its container */ /* Some Homepage themes wrap widget contents; force them tall too */
body.tab-glance iframe[name="glance"] { body.tab-glance .service-card:has(iframe[src*="home.netgrimoire.com"]) > *,
body.tab-glance .service-card:has(iframe[name="glance"]) > *,
body.tab-glance .widget:has(iframe[src*="home.netgrimoire.com"]) > *,
body.tab-glance .widget:has(iframe[name="glance"]) > * {
height: 100% !important;
min-height: 100% !important;
}
/* Make the iframe itself fill its container */
body.tab-glance iframe[name="glance"],
body.tab-glance iframe[src*="home.netgrimoire.com"] {
width: 100% !important; width: 100% !important;
height: 100% !important; height: 100% !important;
min-height: var(--glance-vh) !important;
border: 0 !important; border: 0 !important;
display: block !important; display: block !important;
} }
/* Fallback for older browsers/builds that don't support :has() /* Fallback for builds/browsers without :has() support:
(Still only targets iframe[name="glance"]) */ Still target by iframe src and force height directly. */
@supports not selector(.service-card:has(iframe)) { @supports not selector(.service-card:has(iframe)) {
body.tab-glance iframe[src*="home.netgrimoire.com"],
body.tab-glance iframe[name="glance"] { body.tab-glance iframe[name="glance"] {
height: calc(100vh - 160px) !important; /* adjust (140-200px) if needed */ width: 100% !important;
height: var(--glance-vh) !important;
min-height: var(--glance-vh) !important;
border: 0 !important;
display: block !important;
}
/* Also loosen common wrapper constraints */
body.tab-glance .service-card,
body.tab-glance .widget {
height: var(--glance-vh) !important;
min-height: var(--glance-vh) !important;
overflow: hidden !important;
padding: 0 !important;
} }
} }