@classic-homes/slides 0.5.4 → 0.5.6

package/dist/{chunk-WTC2VV5C.js → chunk-36736WP4.js}

@@ -195,7 +195,9 @@ function tokensCss(palette) {
 --font-display:"Spectral",Georgia,"Times New Roman",serif;
 --font-body:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 --font-mono:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Menlo,Consolas,monospace;
---maxw:1120px}`;
+--slide-pad-x:clamp(24px,4vw,96px);--slide-pad-y:clamp(28px,4vh,56px);
+/* Grow with the screen, reserving height for titles and footers on wide, short windows. */
+--maxw:calc(200vh - 176px)}`;
 }
 function fontsCss() {
   const face = (family, style, weight, key) => `@font-face{font-family:'${family}';font-style:${style};font-weight:${weight};font-display:swap;src:url(data:font/woff2;base64,${FONTS[key]}) format('woff2')}`;
@@ -923,11 +925,13 @@ var cards = defineLayout({
     ])
   ],
   render: (s, ctx) => ({
-    html: `${eyebrow(s.eyebrow, s.eyebrowSub)}${heading(s.title)}${lead(s.lead)}<div class="cardgrid cards--${s.style}"${s.build ? " data-build" : ""} style="--cols:${s.columns}">${s.cards.map(
-      (c) => `<div class="card b-item">${c.image ? img(c.image, ctx, "card-img") : ""}${s.style === "banner" ? `<div class="card-band">${inline(c.tag ?? c.title)}</div><div class="card-b">${c.tag ? `<h3>${inline(c.title)}</h3>` : ""}${c.body ? `<p>${inline(c.body)}</p>` : ""}</div>` : `<div class="card-b">${c.tag ? `<span class="tag">${inline(c.tag)}</span>` : ""}<h3>${inline(
+    html: `${eyebrow(s.eyebrow, s.eyebrowSub)}${heading(s.title)}${lead(s.lead)}<div class="cardgrid cards--${s.style}"${s.build ? " data-build" : ""} style="--cols:${s.columns}">${s.cards.map((c) => {
+      const hasCopy = Boolean(c.tag?.trim() || c.title.trim() || c.body?.trim());
+      const copy = c.image && !hasCopy ? "" : s.style === "banner" ? `<div class="card-band">${inline(c.tag ?? c.title)}</div><div class="card-b">${c.tag ? `<h3>${inline(c.title)}</h3>` : ""}${c.body ? `<p>${inline(c.body)}</p>` : ""}</div>` : `<div class="card-b">${c.tag ? `<span class="tag">${inline(c.tag)}</span>` : ""}<h3>${inline(
         c.title
-      )}</h3>${c.body ? `<p>${inline(c.body)}</p>` : ""}</div>`}</div>`
-    ).join("")}</div>${footnote(s.footnote)}`
+      )}</h3>${c.body ? `<p>${inline(c.body)}</p>` : ""}</div>`;
+      return `<div class="card b-item">${c.image ? img(c.image, ctx, "card-img") : ""}${copy}</div>`;
+    }).join("")}</div>${footnote(s.footnote)}`
   })
 });
 var stats = defineLayout({
@@ -2844,7 +2848,7 @@ img{display:block;max-width:100%}
 .deck{height:100vh;overflow-y:scroll;scroll-snap-type:y mandatory;scroll-behavior:smooth}
 @media (prefers-reduced-motion:reduce){.deck{scroll-behavior:auto}}
 .slide{height:100vh;scroll-snap-align:start;scroll-snap-stop:always;position:relative;display:flex;flex-direction:column;justify-content:center;
-  padding:clamp(24px,5.5vh,76px) clamp(28px,8vw,116px);overflow:hidden;
+  --slide-pad-left:var(--slide-pad-x);padding:var(--slide-pad-y) var(--slide-pad-x) var(--slide-pad-y) var(--slide-pad-left);overflow:hidden;
   background:linear-gradient(var(--grid) 1px,transparent 1px) 0 0/100% 46px,linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/46px 100%,var(--paper)}
 .slide__inner{width:100%;max-width:var(--maxw);margin:0 auto;position:relative}
 .slide::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--red)}
@@ -3092,7 +3096,7 @@ img.natural,.media img.natural,.photo-grid img.natural{width:auto;max-width:min(
 .slide.solid .roadmap.mini .rn{background:transparent;border-color:rgba(255,255,255,.55);color:rgba(255,255,255,.85)}
 .slide.solid .roadmap.mini .rstep::before{background:rgba(255,255,255,.3)}
 .slide.solid .roadmap.mini .rstep.active .rn{background:#fff;border-color:#fff;color:var(--red)}
-.slide.has-step{padding-left:clamp(92px,10vw,168px)}
+.slide.has-step{--slide-pad-left:calc(clamp(60px,6.5vw,100px) + var(--slide-pad-x))}
 .slide.has-step::before{display:none}
 .steprail{position:absolute;left:0;top:0;bottom:0;width:clamp(60px,6.5vw,100px);background:var(--red);display:flex;flex-direction:column;align-items:center;z-index:3}
 .slide[data-track="build"] .steprail{background:var(--teal-fill)}
@@ -3157,8 +3161,7 @@ var DECK_CSS_EXTRA = String.raw`
 .slide.has-bg.solid .lead{color:#fff}
 
 /* ---------- footer, hidden ---------- */
-.slide-foot{position:absolute;left:clamp(28px,8vw,116px);right:clamp(28px,8vw,116px);bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--ink-faint);pointer-events:none}
-.slide.has-step .slide-foot{left:clamp(92px,10vw,168px)}
+.slide-foot{position:absolute;left:var(--slide-pad-left);right:var(--slide-pad-x);max-width:var(--maxw);margin:0 auto;bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--ink-faint);pointer-events:none}
 .slide-foot .foot-l{display:flex;align-items:center;gap:16px}
 .slide-foot .foot-l>span+span::before{content:"·";margin-right:16px}
 .slide-foot .foot-logo .logo{font-size:12px}
@@ -3960,4 +3963,4 @@ export {
   inlineDeckImages,
   externalizeDeckImages
 };
-//# sourceMappingURL=chunk-WTC2VV5C.js.map
+//# sourceMappingURL=chunk-36736WP4.js.map