diff --git a/config/custom.css b/config/custom.css index 13f9efd..8c0224a 100755 --- a/config/custom.css +++ b/config/custom.css @@ -1,17 +1,13 @@ -/* custom.css (drop-in replacement) */ +/* custom.css */ -/* ----------------------------- */ -/* Base background behavior */ -/* ----------------------------- */ +/* Base background behavior */ body { background-size: cover !important; background-position: center center !important; background-attachment: fixed !important; } -/* ----------------------------- */ -/* Per-tab backgrounds */ -/* ----------------------------- */ +/* Per-tab backgrounds */ body.tab-glance { background-image: url("/images/bg-glance.jpg") !important; } @@ -35,13 +31,26 @@ body.tab-nucking-futz { /* ----------------------------- */ /* Readability / tone-down layer */ /* ----------------------------- */ + +/* Let more background show through (was 0.55) */ #page-wrapper { background-color: rgba(0, 0, 0, 0.40); } +/* Soft blur + desaturate background only +body::before { + content: ""; + position: fixed; + inset: 0; + backdrop-filter: blur(6px) saturate(0.8); + z-index: -1; +} +*/ + +/* Make service cards and widgets pop (but more transparent than before) */ .service-card, .widget { - background: rgba(20, 20, 20, 0.70) !important; + background: rgba(20, 20, 20, 0.70) !important; /* was 0.85 */ backdrop-filter: blur(2px); border-radius: 10px; } @@ -49,13 +58,16 @@ body.tab-nucking-futz { /* ----------------------------- */ /* PNCHarris: narrow centered column */ /* ----------------------------- */ + +/* Constrain the real content container */ body.tab-pncharris main { - max-width: 900px; + max-width: 900px; /* adjust: 760px narrower, 1100px wider */ margin: 0 auto !important; padding-left: 16px; padding-right: 16px; } +/* Some builds wrap groups/sections full-width; constrain them too */ body.tab-pncharris section, body.tab-pncharris .group { max-width: 900px; @@ -63,75 +75,9 @@ body.tab-pncharris .group { margin-right: auto !important; } +/* If cards are being forced to stretch, relax that on PNCHarris */ body.tab-pncharris .service-card, body.tab-pncharris .widget { width: auto !important; max-width: 100% !important; } - -/* ========================================================= */ -/* GLANCE TAB: make ONLY the glance iframe fill the page */ -/* ========================================================= */ - -/* Full width on Glance tab */ -body.tab-glance main { - max-width: none !important; - margin: 0 !important; - padding-left: 12px !important; - padding-right: 12px !important; -} - -/* Single-column layout on Glance tab */ -body.tab-glance .service-grid, -body.tab-glance .services { - grid-template-columns: 1fr !important; -} - -/* Adjust this number if you want more/less height */ -body.tab-glance { - --glance-vh: calc(100vh - 170px); -} - -/* Make the card containing the Glance iframe tall and clean */ -body.tab-glance .service-card:has(iframe[name="glance"]), -body.tab-glance .service-card:has(iframe[src*="home.netgrimoire.com"]) { - grid-column: 1 / -1 !important; - height: var(--glance-vh) !important; - min-height: var(--glance-vh) !important; - overflow: hidden !important; - padding: 0 !important; - border-radius: 12px !important; - position: relative !important; /* required for absolute iframe fill */ -} - -/* Some Homepage themes add an inner wrapper; make it fill the card */ -body.tab-glance .service-card:has(iframe[name="glance"]) .service-card-content, -body.tab-glance .service-card:has(iframe[src*="home.netgrimoire.com"]) .service-card-content, -body.tab-glance .service-card:has(iframe[name="glance"]) .widget, -body.tab-glance .service-card:has(iframe[src*="home.netgrimoire.com"]) .widget { - height: 100% !important; - min-height: 100% !important; - padding: 0 !important; - background: transparent !important; /* don’t paint over the iframe */ -} - -/* Fill the entire card with the iframe */ -body.tab-glance iframe[name="glance"], -body.tab-glance iframe[src*="home.netgrimoire.com"] { - position: absolute !important; - inset: 0 !important; - width: 100% !important; - height: 100% !important; - border: 0 !important; - display: block !important; - background: transparent !important; -} - -/* Fallback if :has() isn’t supported */ -@supports not selector(.service-card:has(iframe)) { - body.tab-glance iframe[name="glance"], - body.tab-glance iframe[src*="home.netgrimoire.com"] { - width: 100% !important; - height: var(--glance-vh) !important; - } -}