pandorga 1.3.6 → 1.3.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c6a4f2b9d6301de61dc8a70de9ea3e47838f8896ac2b87f0cd77e07665c0030d
-  data.tar.gz: 41c8cefdadd4e2b58d2cf424f587bcb70c98531b870f04a8bfdef7ee0420a33c
+  metadata.gz: ea6a5c5a2e3a25b789f30f4ade187c45f3167de07673934e29ee608923e4b1a9
+  data.tar.gz: 211bcfc642bd1b0f1c587fca41a225f264d2121bb914bc469d66c6e82fb58337
 SHA512:
-  metadata.gz: 26e0bbd8c1f915e22a81e34f365e70e7302cd983701730ecdef31bb11a3892a78fad827651cd364276a7cd87b74566b5dd9f60ff208cd9ad9b90bb3df764f7c0
-  data.tar.gz: 3a4c0e1a3641a3558c02867e832424e12f2bcbf20d8d9db0675387f314ed550d780cd870930cc03ecdc8fb5e75898de6d79698ac78fc636b4ab2e9c243e8827e
+  metadata.gz: 87f3c7a0881d7a68b901be98353bebc45419482c25334bd721eaaa989bc25ceeb362d36bb3dcdff6f380c3a1b7c359e3679e4b78d6b1b1b84fb1ff2c7b1a8575
+  data.tar.gz: 25e0640b55107ff5c5f3c948547c3d91662a70b36e8bf40d717e6a7ca6af0056ac53114de574fb0db1c577cfea41b6602ac45c397234e9a2bfbc724973cbf301

data/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [1.3.7] — 2026-10-06
+
+### Added
+
+- Home projects band specimen bench: project specimen, rack card, and tape
+  blocks, with inventory rows and glyph/initial fallbacks when an icon is
+  missing
+
+### Fixed
+
+- Specimen stays half-width and 16:9; title always sits below the plate with
+  roomier copy and links; drafting tape removed from the home layout
+
 ## [1.3.6] — 2026-10-05
 
 ### Fixed

data/DESIGN.md

@@ -935,11 +935,20 @@ Letter-spacing in use, by frequency: `0.1em` (12), `0.08em` (10), `0.12em` (7),
   writing, rascunhos, systems, ideas graph. The featured band carries a 6rem ×
   3px `primary` rule at its top-left corner as a structural mark. The three
   writing cards take `primary` / `secondary` / `tertiary` 2px top rules in
-  rotation. The systems band is a specimen + inventory bench from 900px —
-  a 40% / 60% split: 16:9 specimen card beside a panel inventory rail whose
-  height matches the full specimen card, with equal-flex rows (thumb 16:9
-  left, meta right); list click updates the specimen, specimen click opens
-  the project. Below 768px the hero portrait runs to the screen edge, pulled
+  rotation. The systems band is a specimen bench. The specimen is a
+  fixed-height system card (2px `primary` top rule; strip with folio, label,
+  start year and status; a 16:9 plate, the poster with an icon badge or the
+  icon plate, the name's initial standing in for a missing icon; the title
+  always below the plate; a tagline clamped to the
+  height the plate leaves; tags, outbound links and an emphasis "Open
+  project" cue). From 900px it takes 50% of the band, beside a 34%
+  `panelContrast` filing rack of equal-flex project cards (16:9 thumb, code
+  line, title, tagline; the selected card steps to `surfaceHigh` with a 3px
+  `primary` inset rule), the rest left blank. Rack click swaps the specimen
+  in place; specimen click opens the project. Below 900px the rack is an
+  icon strip above the specimen, one equal column per project (up to six)
+  so it spans the band. Contract: `PLT-AC-13`–`17` in
+  `templates/portfolio/README.md`. Below 768px the hero portrait runs to the screen edge, pulled
   out of the band's gutter by exactly `--gutter-mobile` on each side and losing
   its side hairlines, which at the edge would read as a frame cut off.
 * **Writing index.** Masthead over a hairline, then a `panelContrast` filter

data/_includes/content-runtime/43-blocks.html

@@ -324,9 +324,15 @@
       ].join('');
     }
 
-    /* Compact inventory row for the home portfolio bench.
-     * Desktop: index + thumb + title + project icon. Mobile strip uses the
-     * thumb/initial only. Selectable rows update the specimen. */
+    function twoDigits(value) {
+      var label = String(Number(value));
+      return label.length < 2 ? '0' + label : label;
+    }
+
+    /* Rack card for the home portfolio bench.
+     * Desktop: thumb (or icon, or initial) beside a code line, title and
+     * tagline. The mobile strip shows the project glyph only. Selectable rows
+     * update the specimen. */
     function renderProjectInventoryRow(item, options) {
       options = options || {};
       var f = blockFields(item);
@@ -352,22 +358,28 @@
 
       var media = renderPosterMedia(fm.thumbnail, name);
       var initial = String(name || '?').charAt(0).toUpperCase();
-      if (!media) {
+      if (!media && fm.icon) {
+        media = '<div class="home-project-inventory-mark" aria-hidden="true">' +
+          '<span class="material-symbols-outlined">' + escapeHtml(fm.icon) + '</span></div>';
+      } else if (!media) {
         media = '<div class="home-project-inventory-mark home-project-inventory-mark--initial" aria-hidden="true">' +
           escapeHtml(initial) + '</div>';
       }
 
-      var html = '';
-      if (index != null && index !== '') {
-        var label = String(Number(index));
-        if (label.length < 2) label = '0' + label;
-        html += '<span class="home-project-inventory-index" aria-hidden="true">' +
-          escapeHtml(label) + '</span>';
-      }
-      if (media) {
-        html += '<div class="home-project-inventory-media">' + media + '</div>';
-      }
+      var html = '<div class="home-project-inventory-media">' + media + '</div>';
       html += '<div class="home-project-inventory-body">';
+
+      var code = renderMetaStrip([
+        index != null && index !== ''
+          ? '<span class="code-technical home-project-inventory-index">' + escapeHtml(twoDigits(index)) + '</span>'
+          : '',
+        fm.label ? escapeHtml(fm.label) : ''
+      ]);
+      var status = fm.status ? '<span class="ledger-status">' + escapeHtml(fm.status) + '</span>' : '';
+      if (code || status) {
+        html += '<div class="home-project-inventory-code">' + code + status + '</div>';
+      }
+
       if (selectable) {
         html += '<h3 class="home-project-inventory-title card-title">' +
           escapeHtml(name) + '</h3>';
@@ -376,6 +388,9 @@
           '<a class="ledger-card-stretch" href="' + escapeAttr(href) + '">' +
           escapeHtml(name) + '</a></h3>';
       }
+      if (fm.tagline) {
+        html += '<p class="home-project-inventory-copy font-body">' + escapeHtml(fm.tagline) + '</p>';
+      }
       html += '</div>';
       if (fm.icon) {
         html += '<span class="home-project-inventory-glyph material-symbols-outlined" aria-hidden="true">' +
@@ -441,12 +456,85 @@
       // Outbound links only. `.ledger-card-foot` draws a rule above itself, so
       // an empty one rules off nothing; renderLedgerRow and renderArchiveCard
       // guard it the same way.
+      var links = renderProjectLinks(fm, options);
+      if (links) {
+        html += '<div class="ledger-card-foot ledger-card-links">' + links + '</div>';
+      }
+
+      card.innerHTML = html;
+      return card;
+    }
+
+    function renderProjectLinks(fm, options) {
       var links = [];
       if (fm.github) links.push(renderCtaLink(fm.github, options.repoLabel || 'Repository', { icon: 'code' }));
       if (fm.article_url) links.push(renderCtaLink(fm.article_url, options.articleLabel || 'Article', { icon: 'article' }));
       if (fm.external_url) links.push(renderCtaLink(fm.external_url, options.externalLabel || 'Visit', { icon: 'public' }));
-      if (links.length) {
-        html += '<div class="ledger-card-foot ledger-card-links">' + links.join('') + '</div>';
+      return links.join('');
+    }
+
+    /* Home specimen — the featured project on the portfolio bench. A system
+     * card whose strip carries folio, label, start year and status, with the
+     * title below a 16:9 plate: the thumbnail (icon badge on it) or else the
+     * icon plate. `openLabel` adds a visual "open" cue; it is not a second
+     * link, the stretched title is. */
+    function renderProjectSpecimen(item, options) {
+      options = options || {};
+      var f = blockFields(item);
+      var fm = f.fm;
+      var href = options.href || '#';
+      var name = fm.project || f.title;
+
+      var card = document.createElement('article');
+      card.className = 'ledger-system-card home-project-specimen group';
+
+      var year = String(fm.start_date || '').match(/^\d{4}/);
+      var meta = renderMetaStrip([
+        options.folio ? '<span class="code-technical home-specimen-folio">#' + escapeHtml(twoDigits(options.folio)) + '</span>' : '',
+        fm.label ? escapeHtml(fm.label) : '',
+        year ? '<span>' + escapeHtml(year[0]) + '</span>' : ''
+      ]);
+      var status = fm.status ? '<span class="ledger-status">' + escapeHtml(fm.status) + '</span>' : '';
+
+      var html = '';
+      if (meta || status) {
+        html += '<div class="home-specimen-strip">' + meta + status + '</div>';
+      }
+
+      // The name's initial stands in for a missing icon, so every project
+      // carries the same badge and plate elements.
+      var mark = fm.icon
+        ? { cls: 'material-symbols-outlined', text: fm.icon }
+        : { cls: 'is-initial', text: String(name || '').charAt(0).toUpperCase() };
+      var poster = renderPosterMedia(fm.thumbnail, name);
+      html += '<div class="home-specimen-figure">';
+      if (poster) {
+        html += poster + '<span class="home-specimen-badge ' + mark.cls + '" aria-hidden="true">' +
+          escapeHtml(mark.text) + '</span>';
+      } else {
+        html += '<div class="projects-plate projects-plate--mark" aria-hidden="true">' +
+          '<span class="' + mark.cls + ' projects-plate-glyph">' + escapeHtml(mark.text) + '</span></div>';
+      }
+      html += '<h3 class="card-title ledger-card-title home-specimen-title"><a class="ledger-card-stretch" href="' +
+        escapeAttr(href) + '">' + escapeHtml(name) + '</a></h3>';
+      html += '</div>';
+
+      var summary = fm.tagline || f.preview;
+      if (summary) {
+        html += '<p class="ledger-card-copy font-body">' + escapeHtml(summary) + '</p>';
+      }
+
+      html += renderTagChips(f.tags, { hrefFor: options.tagHref });
+
+      var links = renderProjectLinks(fm, options);
+      var open = options.openLabel
+        ? '<span class="ledger-cta ledger-cta--emphasis home-specimen-open" aria-hidden="true"><span>' +
+          escapeHtml(options.openLabel) +
+          '</span><span class="material-symbols-outlined ledger-cta-arrow">chevron_right</span></span>'
+        : '';
+      if (links || open) {
+        html += '<div class="ledger-card-foot home-specimen-foot">' +
+          (links ? '<div class="ledger-card-links">' + links + '</div>' : '') + open + '</div>';
       }
 
       card.innerHTML = html;

data/_includes/content-runtime/90-bootstrap.html

@@ -64,6 +64,7 @@
       renderArchiveCard: renderArchiveCard,
       renderSystemCard: renderSystemCard,
       renderProjectInventoryRow: renderProjectInventoryRow,
+      renderProjectSpecimen: renderProjectSpecimen,
       renderPosterMedia: renderPosterMedia,
       ensureBibliographyIndex: ensureBibliographyIndex,
       bibField: bibField,

data/_includes/home/band-listing.html

@@ -46,7 +46,7 @@
       data-home-list
       data-tag-base="{{ _path }}"
     >
-      <div data-home-specimen></div>
+      <div class="home-project-specimen-slot" data-home-specimen></div>
       <div class="home-project-inventory" data-home-inventory aria-label="Project inventory"></div>
     </div>
     {%- else -%}

data/_layouts/home.html

@@ -234,32 +234,47 @@ layout: shell
           eligible: function () { return true; }
         });
         var selectedSlug = (featuredPick && featuredPick.slug) || portfolio[0].slug;
-        var iconSlots = 6;
+        var iconSlots = Math.min(portfolio.length, 6);
 
         function entryBySlug(slug) {
           return portfolio.filter(function (entry) { return entry.slug === slug; })[0] || portfolio[0];
         }
 
+        function positionOf(slug) {
+          for (var i = 0; i < portfolio.length; i += 1) {
+            if (portfolio[i].slug === slug) return i;
+          }
+          return 0;
+        }
+
+        /* Specimen and inventory sizes are CSS-fixed (no ResizeObserver), so
+           swapping projects never moves the band. */
         function paintSpecimen(entry) {
           specimenSlot.innerHTML = '';
-          /* No card-level drafting corners / edge tick — markers live on the
-             poster plate only, so they do not overlap the image. Meta strip
-             is suppressed; tags take that slot below the plate. Specimen and
-             inventory sizes are CSS-fixed (no ResizeObserver). */
-          specimenSlot.appendChild(runtime.renderSystemCard(asItem(entry), {
+          specimenSlot.appendChild(runtime.renderProjectSpecimen(asItem(entry), {
             href: entry.url || runtime.projectUrl(entry.slug),
             tagHref: systemTagHref,
-            className: 'home-project-specimen',
-            glyphFallback: true,
-            metaParts: []
+            folio: positionOf(entry.slug) + 1,
+            openLabel: 'Open project'
           }));
         }
 
+        function select(slug) {
+          if (selectedSlug === slug) return;
+          selectedSlug = slug;
+          paintSpecimen(entryBySlug(slug));
+          Array.prototype.forEach.call(inventorySlot.children, function (node) {
+            var isSelected = node.getAttribute('data-slug') === selectedSlug;
+            node.classList.toggle('is-selected', isSelected);
+            node.setAttribute('aria-pressed', isSelected ? 'true' : 'false');
+          });
+        }
+
         function paintInventory() {
           inventorySlot.hidden = false;
           inventorySlot.innerHTML = '';
-          /* Always reserve six mobile columns so one project does not stretch
-             a single giant button across the band. */
+          /* One mobile column per project, up to six a row, so the strip
+             always spans the band. */
           inventorySlot.style.setProperty('--home-project-icon-count', String(iconSlots));
           portfolio.forEach(function (entry, i) {
             var row = runtime.renderProjectInventoryRow(asItem(entry), {
@@ -267,21 +282,11 @@ layout: shell
               selected: entry.slug === selectedSlug,
               index: i + 1
             });
-            function select() {
-              if (selectedSlug === entry.slug) return;
-              selectedSlug = entry.slug;
-              paintSpecimen(entry);
-              Array.prototype.forEach.call(inventorySlot.children, function (node) {
-                var isSelected = node.getAttribute('data-slug') === selectedSlug;
-                node.classList.toggle('is-selected', isSelected);
-                node.setAttribute('aria-pressed', isSelected ? 'true' : 'false');
-              });
-            }
-            row.addEventListener('click', select);
+            row.addEventListener('click', function () { select(entry.slug); });
             row.addEventListener('keydown', function (event) {
               if (event.key === 'Enter' || event.key === ' ') {
                 event.preventDefault();
-                select();
+                select(entry.slug);
               }
             });
             inventorySlot.appendChild(row);

data/assets/css/ledger/home.css

@@ -943,10 +943,13 @@ html[data-theme="light"] .home-hero-plate {
   }
 }
 
-/* ── Engineering artifacts: specimen + index folio ──
-   Fixed specimen chrome (16:9 plate + reserved body). Mobile icon strip
-   always reserves six equal slots at a fixed button height. Desktop inventory
-   sits in a panel container matched to the specimen height via CSS, not JS. */
+/* ── Engineering artifacts: specimen bench ──
+   A specimen card beside a filing rack of project cards. The specimen has a
+   fixed height, so swapping projects never resizes the band. Every plate is
+   16:9, the ratio the thumbnails are drawn at, with the title below it; the
+   tagline takes the height left. From 900px the specimen is half the band and the rack a
+   narrower column beside it, the rest left blank. Below 900px the rack is
+   an icon strip above the specimen, one column per project. */
 .home-projects-bench {
   --home-specimen-height: 32rem;
   --home-icon-btn-size: 2.75rem;
@@ -957,55 +960,115 @@ html[data-theme="light"] .home-hero-plate {
   gap: var(--space-md);
 }
 
+.home-project-inventory {
+  order: -1;
+}
+
 .home-project-specimen {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  gap: var(--space-md);
-  padding: var(--space-md);
-  padding-bottom: var(--space-lg);
-  max-width: none;
-  width: 100%;
   height: var(--home-specimen-height);
   overflow: hidden;
-  border: 0;
-  background: var(--color-panel-contrast);
+  gap: var(--space-sm);
+  padding: var(--space-md);
   box-sizing: border-box;
 }
 
-:root:not([data-theme="dark"]) .home-project-specimen,
-html[data-theme="light"] .home-project-specimen,
-[data-theme="dark"] .home-project-specimen {
-  border: 0;
+/* The triad top rule (`.ledger-card--edge-primary`), restated at a weight
+   that beats the light-paper hairline reset on `.ledger-system-card`. */
+:root .home-projects-bench .home-project-specimen,
+:root .home-projects-bench .home-project-specimen:hover {
+  border-top: 2px solid var(--color-primary);
+}
+
+.home-band--contrast .home-project-specimen {
+  background: var(--color-surface-card-contrast);
+}
+
+.home-band--contrast .home-project-specimen:hover {
+  background: var(--color-surface-high-contrast);
 }
 
-.home-project-specimen>.ledger-poster,
-.home-project-specimen>.projects-plate {
+.home-specimen-strip,
+.home-project-inventory-code {
+  display: flex;
   flex: 0 0 auto;
-  width: auto;
-  margin: calc(var(--space-md) * -1) calc(var(--space-md) * -1) 0;
-  aspect-ratio: 16 / 9;
-  max-height: calc(var(--home-specimen-height) * 0.5);
-  position: relative;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-sm);
+  min-width: 0;
+}
+
+.home-specimen-strip .ledger-meta,
+.home-project-inventory-code .ledger-meta {
+  min-width: 0;
+  flex-wrap: nowrap;
   overflow: hidden;
+  white-space: nowrap;
 }
 
-.home-project-specimen>.ledger-poster img,
-.home-project-specimen>.ledger-poster video {
+.home-specimen-folio,
+.home-project-inventory-index {
+  color: var(--color-primary);
+}
+
+.home-specimen-strip>.ledger-status,
+.home-project-inventory-code>.ledger-status {
+  flex: 0 0 auto;
+  font-family: var(--font-label);
+  font-size: var(--type-micro);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  line-height: 1.4;
+  padding: 0.1rem 0.45rem;
+  background: color-mix(in srgb, var(--color-secondary) 14%, transparent);
+}
+
+/* The figure holds the plate and, always below it, the title. The badge
+   shares the poster's grid cell; when the image fails, renderPosterMedia
+   removes it and the badge hides with it. */
+.home-specimen-figure {
+  flex: 0 0 auto;
+  display: grid;
+  gap: var(--space-md);
+}
+
+.home-specimen-figure>.ledger-poster,
+.home-specimen-figure>.projects-plate {
+  grid-area: 1 / 1;
   width: 100%;
-  height: 100%;
-  object-fit: cover;
+  aspect-ratio: 16 / 9;
+}
+
+.home-specimen-figure>.projects-plate {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--color-surface-high);
+  color: var(--color-primary);
+}
+
+.home-specimen-figure .projects-plate-glyph {
+  font-size: 3rem;
+}
+
+.home-specimen-figure .is-initial {
+  font-family: var(--font-content-title);
+  font-weight: var(--weight-title);
+  line-height: 1;
+}
+
+.home-specimen-figure:has(> .ledger-poster)>.home-specimen-badge.is-initial {
+  font-size: var(--type-subtitle);
 }
 
 /* Glyph plates have no .ledger-poster::after — mirror the image corners. */
-.home-project-specimen>.projects-plate::after {
+.home-specimen-figure>.projects-plate::after {
   content: "";
   --frame-corner-size: 0.7rem;
   --frame-corner-thickness: 1px;
   position: absolute;
   inset: 0.3rem;
   pointer-events: none;
-  z-index: 2;
   background:
     linear-gradient(var(--color-primary), var(--color-primary)) top left / var(--frame-corner-size) var(--frame-corner-thickness) no-repeat,
     linear-gradient(var(--color-primary), var(--color-primary)) top left / var(--frame-corner-thickness) var(--frame-corner-size) no-repeat,
@@ -1017,82 +1080,111 @@ html[data-theme="light"] .home-project-specimen,
     linear-gradient(var(--color-primary), var(--color-primary)) bottom right / var(--frame-corner-thickness) var(--frame-corner-size) no-repeat;
 }
 
-.home-project-specimen .projects-plate--mark {
-  display: flex;
+.home-specimen-figure>.home-specimen-badge {
+  display: none;
+}
+
+.home-specimen-figure:has(> .ledger-poster)>.home-specimen-badge {
+  grid-area: 1 / 1;
+  justify-self: end;
+  align-self: start;
+  z-index: 3;
+  display: inline-flex;
   align-items: center;
   justify-content: center;
-  background: var(--color-surface-high);
+  width: 2.25rem;
+  height: 2.25rem;
+  margin: var(--space-sm);
+  font-size: 1.25rem;
+  background: var(--color-surface-card);
   color: var(--color-primary);
 }
 
-.home-project-specimen .projects-plate-glyph {
-  font-size: 3rem;
-}
-
-.home-project-specimen .ledger-meta {
-  display: none;
-}
-
-.home-project-specimen .ledger-card-title,
-.home-project-specimen .ledger-card-title a {
-  flex: 0 0 auto;
-  font-family: var(--font-content-title);
+.home-project-specimen .home-specimen-title {
+  margin: 0;
   font-size: var(--type-card-lg);
-  font-weight: var(--weight-title);
-  font-synthesis: none;
   line-height: 1.2;
-  color: var(--color-on-surface);
-  min-height: calc(1.2em * 1);
-  margin: var(--space-sm) 0 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.home-project-specimen:hover .ledger-card-title a,
-.home-project-specimen:focus-within .ledger-card-title a {
-  color: var(--color-primary);
-}
-
+/* The tagline takes whatever height the plate leaves, clipped at a whole
+   line by the clamp; the chips and the foot keep to the bottom edge. */
 .home-project-specimen .ledger-card-copy {
-  flex: 0 0 auto;
-  font-family: var(--font-body);
+  flex: 0 1 auto;
+  min-height: 0;
   font-size: var(--type-body);
-  font-weight: var(--weight-body);
   line-height: var(--leading-body);
   color: var(--color-on-surface-variant);
   display: -webkit-box;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  line-clamp: 3;
+  -webkit-line-clamp: var(--home-specimen-copy-lines, 4);
+  line-clamp: var(--home-specimen-copy-lines, 4);
   overflow: hidden;
-  min-height: calc(var(--type-body) * var(--leading-body) * 3);
-  margin: 0;
 }
 
 .home-project-specimen .ledger-chip-row {
-  display: flex;
-  flex-wrap: wrap;
+  flex: 0 0 auto;
+  flex-wrap: nowrap;
+  overflow: hidden;
   gap: var(--space-xs);
-  margin: 0;
+  margin: auto 0 0;
+}
+
+.home-specimen-foot {
+  flex: 0 0 auto;
+  flex-wrap: nowrap;
+  gap: var(--space-md);
   margin-top: auto;
+  padding-top: var(--space-md);
+}
+
+.home-project-specimen .ledger-chip-row~.home-specimen-foot {
+  margin-top: var(--space-xs);
+}
+
+.home-specimen-foot .ledger-card-links {
+  position: relative;
+  z-index: 1;
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--space-sm) var(--space-lg);
+  padding-top: 0;
+  border-top: 0;
+}
+
+.home-specimen-open {
+  margin-left: auto;
   flex: 0 0 auto;
-  max-height: none;
-  overflow: visible;
 }
 
-.home-project-specimen .ledger-card-links {
-  display: none;
+.home-project-specimen:hover .home-specimen-open {
+  color: var(--color-on-primary, var(--color-surface));
+  border-color: var(--color-link-hover);
+  background: var(--color-primary);
 }
 
-/* Mobile: six equal icon slots, fixed button height (empty slots stay empty). */
+.home-project-specimen:hover .home-specimen-open .ledger-cta-arrow {
+  transform: translateX(4px);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .home-project-specimen:hover .home-specimen-open .ledger-cta-arrow {
+    transform: none;
+  }
+}
+
+/* Mobile: one equal column per project (the script sets the count, up to
+   six), so the strip spans the band; fixed button height. */
 .home-project-inventory {
   display: grid;
   grid-template-columns: repeat(var(--home-project-icon-count, 6), minmax(0, 1fr));
   gap: var(--space-xs);
   min-width: 0;
   min-height: 0;
-  height: auto !important;
   overflow: visible;
   background: transparent;
   border: 0;
@@ -1104,22 +1196,16 @@ html[data-theme="light"] .home-project-specimen,
   display: flex;
   align-items: center;
   justify-content: center;
-  flex: none;
-  width: auto;
   min-width: 0;
   height: var(--home-icon-btn-size);
-  aspect-ratio: auto;
-  gap: 0;
   padding: 0;
   border: 1px solid var(--border-gentle-divider);
   background: var(--color-panel-contrast);
   cursor: pointer;
-  box-shadow: none;
   transition: background-color var(--motion-duration-fast) var(--motion-ease-default),
     border-color var(--motion-duration-fast) var(--motion-ease-default);
 }
 
-.home-project-inventory-index,
 .home-project-inventory-media,
 .home-project-inventory-body {
   display: none;
@@ -1129,9 +1215,6 @@ html[data-theme="light"] .home-project-specimen,
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: auto;
-  height: auto;
-  margin: 0;
   font-size: 1.25rem;
   line-height: 1;
   color: var(--color-on-surface-variant);
@@ -1154,7 +1237,6 @@ html[data-theme="light"] .home-project-specimen,
   outline: 1px solid var(--color-primary);
   outline-offset: -1px;
   background: var(--color-surface-high);
-  box-shadow: none;
 }
 
 .home-project-inventory-row.is-selected .home-project-inventory-glyph,
@@ -1169,93 +1251,68 @@ html[data-theme="light"] .home-project-specimen,
   background: var(--color-surface-high-contrast);
 }
 
-.home-project-inventory-row .ledger-meta {
-  display: none;
-}
-
 @media (min-width: 900px) {
+
+  /* The rack panel stretches to the specimen's fixed height. */
   .home-projects-bench {
     --home-specimen-height: 36rem;
     display: grid;
-    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
-    gap: var(--space-xl);
+    grid-template-columns: minmax(0, 50%) minmax(18rem, 34%);
+    column-gap: var(--space-xl);
     align-items: stretch;
   }
 
-  .home-project-specimen {
-    height: var(--home-specimen-height);
-  }
-
-  /* Panel container over the tiled band — not bare rows on the grid. */
   .home-project-inventory {
+    order: 0;
     display: flex;
     flex-direction: column;
-    height: var(--home-specimen-height);
+    gap: var(--space-sm);
+    min-height: 0;
     overflow: hidden;
-    gap: 0;
-    padding: 0;
+    padding: var(--space-md);
     background: var(--color-panel-contrast);
-    border: 1px solid var(--border-gentle-divider);
+  }
+
+  .home-project-specimen .home-specimen-title {
+    font-size: var(--type-title);
   }
 
   .home-project-inventory-row {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
     flex: 1 1 0;
-    width: auto;
+    justify-content: flex-start;
+    gap: var(--space-md);
     height: auto;
     min-height: 0;
-    aspect-ratio: auto;
-    gap: var(--space-md);
     padding: var(--space-sm) var(--space-md);
-    border: 0;
-    border-bottom: 1px solid var(--border-gentle-divider);
-    background: transparent;
+    border: 1px solid var(--border-gentle-divider);
+    background: var(--color-surface-card);
     outline: none;
   }
 
-  .home-project-inventory-row:last-child {
-    border-bottom: 0;
+  .home-band--contrast .home-project-inventory-row {
+    background: var(--color-surface-card-contrast);
   }
 
-  .home-project-inventory-row.is-selected {
+  .home-project-inventory-row.is-selected,
+  .home-band--contrast .home-project-inventory-row.is-selected {
     background: var(--color-surface-high);
-    border-color: transparent;
+    border-color: var(--border-gentle-divider);
     outline: none;
     box-shadow: inset 3px 0 0 var(--color-primary);
   }
 
-  .home-project-inventory-index {
-    display: block;
-    flex: 0 0 1.75rem;
-    font-family: var(--font-mono);
-    font-size: var(--type-caption);
-    letter-spacing: 0.04em;
-    color: var(--color-on-surface-variant);
-    line-height: 1;
-    text-align: right;
-  }
-
-  .home-project-inventory-row.is-selected .home-project-inventory-index,
-  .home-project-inventory-row:hover .home-project-inventory-index,
-  .home-project-inventory-row:focus-visible .home-project-inventory-index {
-    color: var(--color-primary);
-  }
-
   .home-project-inventory-media {
     display: block;
     flex: 0 0 auto;
     width: 5.5rem;
-    align-self: center;
-    height: auto;
-    min-width: 0;
-    min-height: 0;
     aspect-ratio: 16 / 9;
     overflow: hidden;
     background: var(--color-surface-high);
-    border: 1px solid var(--border-gentle-subtle);
+  }
+
+  .home-project-inventory-row.is-selected .home-project-inventory-media {
+    outline: 1px solid var(--color-primary);
+    outline-offset: 2px;
   }
 
   .home-project-inventory-media .ledger-poster,
@@ -1263,7 +1320,6 @@ html[data-theme="light"] .home-project-specimen,
     width: 100%;
     height: 100%;
     aspect-ratio: auto;
-    border: 0;
     overflow: hidden;
     background: var(--color-surface-high);
   }
@@ -1272,13 +1328,6 @@ html[data-theme="light"] .home-project-specimen,
     display: none;
   }
 
-  .home-project-inventory-media .ledger-poster img {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-    display: block;
-  }
-
   .home-project-inventory-mark {
     display: flex;
     align-items: center;
@@ -1286,6 +1335,10 @@ html[data-theme="light"] .home-project-specimen,
     color: var(--color-primary);
   }
 
+  .home-project-inventory-mark .material-symbols-outlined {
+    font-size: 1.5rem;
+  }
+
   .home-project-inventory-mark--initial {
     font-family: var(--font-content-title);
     font-size: var(--type-card);
@@ -1294,33 +1347,23 @@ html[data-theme="light"] .home-project-specimen,
     color: var(--color-on-surface);
   }
 
-  .home-project-inventory-mark .material-symbols-outlined {
-    font-size: 1.25rem;
-  }
-
   .home-project-inventory-body {
     display: flex;
     flex-direction: column;
     justify-content: center;
-    gap: 0;
+    gap: 0.1rem;
     flex: 1 1 0;
     min-width: 0;
-    padding: 0;
   }
 
   .home-project-inventory-title {
     margin: 0;
-    font-family: var(--font-content-title);
-    font-size: var(--type-card);
-    font-weight: var(--weight-title);
-    font-synthesis: none;
+    font-size: var(--type-label-lg);
     line-height: 1.25;
     color: var(--color-on-surface);
-  }
-
-  .home-project-inventory-title a {
-    color: inherit;
-    text-decoration: none;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
 
   .home-project-inventory-row:hover .home-project-inventory-title,
@@ -1329,15 +1372,23 @@ html[data-theme="light"] .home-project-specimen,
     color: var(--color-primary);
   }
 
-  .home-project-inventory-glyph {
-    flex: 0 0 auto;
-    width: 1.75rem;
-    height: 1.75rem;
-    margin-left: auto;
-    font-size: 1.25rem;
+  .home-project-inventory-copy {
+    margin: 0;
+    font-size: var(--type-meta);
+    font-weight: var(--weight-body);
+    line-height: 1.4;
+    color: var(--color-on-surface-variant);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
-}
 
+  /* Two classes: the glyph also carries .material-symbols-outlined, whose
+     font stylesheet loads after this one and sets display. */
+  .home-project-inventory-row .home-project-inventory-glyph {
+    display: none;
+  }
+}
 
 @media (min-width: 768px) {}
 

data/lib/pandorga/commands/new.rb

@@ -24,7 +24,7 @@ module Pandorga
 
         gem "pandorga", "~> 1.3"
         # Local checkout: gem "pandorga", path: "../pandorga"
-        # GitHub tag: gem "pandorga", github: "alexandrelheinen/pandorga", tag: "v1.3.6"
+        # GitHub tag: gem "pandorga", github: "alexandrelheinen/pandorga", tag: "v1.3.7"
         gem "csv"
         gem "base64"
       RUBY

data/lib/pandorga/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Pandorga
-  VERSION = "1.3.6"
+  VERSION = "1.3.7"
 end

data/scripts/test/render-parity/blocks/project-inventory-row-icon.json

@@ -0,0 +1,29 @@
+{
+  "name": "project-inventory-row/icon mark without a thumbnail (PLT-AC-15)",
+  "block": "renderProjectInventoryRow",
+  "args": [
+    {
+      "slug": "bossa",
+      "front_matter": {
+        "project": "Bossa",
+        "icon": "music_note"
+      }
+    },
+    {
+      "selectable": true,
+      "selected": true
+    }
+  ],
+  "selectors": [
+    "div.home-project-inventory-mark",
+    "h3.home-project-inventory-title"
+  ],
+  "forbidden": [
+    "ledger-poster",
+    "home-project-inventory-mark--initial"
+  ],
+  "contains": [
+    "aria-pressed=\"true\"",
+    "is-selected"
+  ]
+}

data/scripts/test/render-parity/blocks/project-inventory-row.json

@@ -0,0 +1,46 @@
+{
+  "name": "project-inventory-row/rack card (PLT-AC-15)",
+  "block": "renderProjectInventoryRow",
+  "args": [
+    {
+      "slug": "arco",
+      "front_matter": {
+        "project": "ARCO",
+        "thumbnail": "/media/projects/arco.png",
+        "icon": "route",
+        "label": "Simulation",
+        "status": "Ongoing",
+        "tagline": "A city-scale race replayed from telemetry."
+      }
+    },
+    {
+      "selectable": true,
+      "selected": false,
+      "index": 2
+    }
+  ],
+  "selectors": [
+    "article.home-project-inventory-row",
+    "div.home-project-inventory-media",
+    "div.ledger-poster",
+    "div.home-project-inventory-code",
+    "span.home-project-inventory-index",
+    "span.ledger-status",
+    "h3.home-project-inventory-title",
+    "p.home-project-inventory-copy",
+    "span.home-project-inventory-glyph"
+  ],
+  "forbidden": [
+    "ledger-card-stretch"
+  ],
+  "contains": [
+    ">02<",
+    ">Simulation<",
+    ">Ongoing<",
+    ">ARCO<",
+    ">A city-scale race replayed from telemetry.<",
+    ">route<",
+    "aria-pressed=\"false\"",
+    "data-slug=\"arco\""
+  ]
+}

data/scripts/test/render-parity/blocks/project-specimen-glyph.json

@@ -0,0 +1,32 @@
+{
+  "name": "project-specimen/icon plate without a thumbnail (PLT-AC-13)",
+  "block": "renderProjectSpecimen",
+  "args": [
+    {
+      "slug": "bossa",
+      "front_matter": {
+        "project": "Bossa",
+        "icon": "music_note",
+        "tagline": "Edge nodes for street ensembles."
+      }
+    },
+    {
+      "href": "/projects/bossa/"
+    }
+  ],
+  "selectors": [
+    "div.home-specimen-figure",
+    "projects-plate--mark",
+    "h3.ledger-card-title"
+  ],
+  "forbidden": [
+    "ledger-poster",
+    "home-specimen-badge",
+    "home-specimen-strip",
+    "home-specimen-open"
+  ],
+  "contains": [
+    ">music_note<",
+    ">Bossa<"
+  ]
+}

data/scripts/test/render-parity/blocks/project-specimen-initial-badge.json

@@ -0,0 +1,31 @@
+{
+  "name": "project-specimen/initial badge on a thumbnail without an icon (PLT-AC-18)",
+  "block": "renderProjectSpecimen",
+  "args": [
+    {
+      "slug": "arco",
+      "front_matter": {
+        "project": "ARCO",
+        "thumbnail": "/media/projects/arco.png"
+      }
+    },
+    {
+      "href": "/projects/arco/"
+    }
+  ],
+  "selectors": [
+    "ledger-poster",
+    "span.home-specimen-badge",
+    "is-initial"
+  ],
+  "forbidden": [
+    "projects-plate",
+    "material-symbols-outlined"
+  ],
+  "contains": [
+    "aria-hidden=\"true\">A</span>"
+  ],
+  "counts": {
+    "home-specimen-badge": 1
+  }
+}

data/scripts/test/render-parity/blocks/project-specimen-initial.json

@@ -0,0 +1,32 @@
+{
+  "name": "project-specimen/initial plate without a thumbnail or icon (PLT-AC-18)",
+  "block": "renderProjectSpecimen",
+  "args": [
+    {
+      "slug": "bossa",
+      "front_matter": {
+        "project": "bossa",
+        "tagline": "Edge nodes for street ensembles."
+      }
+    },
+    {
+      "href": "/projects/bossa/"
+    }
+  ],
+  "selectors": [
+    "div.home-specimen-figure",
+    "projects-plate--mark",
+    "span.is-initial",
+    "projects-plate-glyph",
+    "h3.ledger-card-title"
+  ],
+  "forbidden": [
+    "ledger-poster",
+    "material-symbols-outlined",
+    "home-specimen-badge"
+  ],
+  "contains": [
+    ">B</span></div>",
+    ">bossa<"
+  ]
+}

data/scripts/test/render-parity/blocks/project-specimen.json

@@ -0,0 +1,69 @@
+{
+  "name": "project-specimen/full (PLT-AC-13)",
+  "block": "renderProjectSpecimen",
+  "args": [
+    {
+      "slug": "arco",
+      "front_matter": {
+        "project": "ARCO",
+        "thumbnail": "/media/projects/arco.png",
+        "icon": "route",
+        "label": "Simulation",
+        "status": "Ongoing",
+        "start_date": "2024-03-01",
+        "tagline": "A city-scale race replayed from telemetry.",
+        "tags": [
+          "Systems",
+          "Rust"
+        ],
+        "github": "https://github.com/example/arco",
+        "article_url": "/articles/arco/",
+        "external_url": "https://arco.example"
+      }
+    },
+    {
+      "href": "/projects/arco/",
+      "folio": 1,
+      "openLabel": "Open project"
+    }
+  ],
+  "selectors": [
+    "article.ledger-system-card",
+    "article.home-project-specimen",
+    "div.home-specimen-strip",
+    "div.ledger-meta",
+    "span.ledger-status",
+    "div.home-specimen-figure",
+    "div.ledger-poster",
+    "img",
+    "span.home-specimen-badge",
+    "h3.ledger-card-title",
+    "a.ledger-card-stretch",
+    "p.ledger-card-copy",
+    "div.ledger-chip-row",
+    "div.ledger-card-links",
+    "span.home-specimen-open"
+  ],
+  "forbidden": [
+    "projects-plate"
+  ],
+  "contains": [
+    ">#01<",
+    ">Simulation<",
+    ">2024<",
+    ">Ongoing<",
+    ">ARCO<",
+    ">Repository<",
+    ">Article<",
+    ">Visit<",
+    ">Open project<",
+    "href=\"/projects/arco/\""
+  ],
+  "counts": {
+    "ledger-card-stretch": 1,
+    "ledger-cta": 4,
+    "ledger-cta-icon": 3,
+    "ledger-chip": 2,
+    "ledger-meta-sep": 2
+  }
+}

data/scripts/test/render-parity/run-absent-field-checks.mjs

@@ -214,6 +214,46 @@ omits(
 
 separatorCount('renderSystemCard / label without status drops the separator', ['Simulation', ''], 0);
 
+// PLT-AC-14: the home specimen and its rack card carry only what the project
+// declares. A project that is only a name is its initial plate (PLT-AC-18)
+// and a title, nothing else.
+omits(
+  'renderProjectSpecimen / project with no media, meta, tags, or links',
+  'renderProjectSpecimen',
+  [{ front_matter: { project: 'Bossa' } }, { href: '/projects/bossa/' }],
+  [
+    'ledger-poster',
+    'material-symbols-outlined',
+    'home-specimen-badge',
+    'home-specimen-strip',
+    'ledger-meta',
+    'ledger-status',
+    'ledger-card-copy',
+    'ledger-chip-row',
+    'ledger-card-foot'
+  ]
+);
+
+omits(
+  'renderProjectSpecimen / a start_date with no year renders no year',
+  'renderProjectSpecimen',
+  [{ front_matter: { project: 'Bossa', start_date: 'someday' } }, { href: '/projects/bossa/' }],
+  ['home-specimen-strip', 'ledger-meta']
+);
+
+omits(
+  'renderProjectInventoryRow / project with no index, label, status, or tagline',
+  'renderProjectInventoryRow',
+  [{ slug: 'bossa', front_matter: { project: 'Bossa' } }, { selectable: true }],
+  [
+    'home-project-inventory-code',
+    'home-project-inventory-index',
+    'ledger-status',
+    'home-project-inventory-copy',
+    'ledger-poster'
+  ]
+);
+
 // The listing preview is derived from description, then excerpt, then body.
 // With all three absent there is nothing to say, so there is no paragraph.
 omits(

data/scripts/test/test-ledger-blocks.rb

@@ -0,0 +1,32 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+require "open3"
+require "pathname"
+
+ROOT = Pathname.new(__dir__).join("..", "..").expand_path
+FIXTURE_DIR = Pathname.new(__dir__).join("render-parity", "blocks")
+RUNNER = Pathname.new(__dir__).join("render-parity", "run-block-fixture.mjs")
+
+# The block half of test-content-render-parity, without its Markdown half.
+# That gate needs `marked` from scripts/node_modules, which CI never installs,
+# so it stays off validate.sh; the ledger blocks fall back cleanly without it.
+
+def check!(condition, message = "condition was false")
+  raise "Assertion failed: #{message}" unless condition
+end
+
+puts "Testing ledger block fixtures..."
+
+paths = Dir.glob(FIXTURE_DIR.join("*.json")).sort
+check! paths.any?, "no ledger block fixtures found"
+
+paths.each do |fixture_path|
+  stdout, stderr, status = Open3.capture3(
+    "node", RUNNER.to_s, fixture_path, chdir: ROOT.join("scripts").to_s
+  )
+  check! status.success?, "#{File.basename(fixture_path)} failed:\n#{stderr}\n#{stdout}"
+  puts "  #{stdout.strip}"
+end
+
+puts "All ledger block fixtures passed."

data/scripts/validate.sh

@@ -49,6 +49,7 @@ TESTS=(
   scripts/test/test-math-row-breaks.rb
   scripts/test/test-detail-render-parity.rb
   scripts/test/test-absent-field-absent-element.rb
+  scripts/test/test-ledger-blocks.rb
   scripts/test/test-home-band-art.rb
   scripts/test/test-r2-json-sync.rb
   scripts/test/test-writing-slug-limits.rb

data/templates/portfolio/README.md

@@ -32,6 +32,42 @@ Optional: `title`, `nav`, `home` (default limit 4).
   home: { limit: 4 }
 ```
 
+## Home band
+
+The home band is a specimen bench: one featured project card beside a
+filing rack of selectable project cards. Every element is backed by a
+collection field; a missing field means a missing element.
+
+- `PLT-AC-13` When the band renders, the specimen card shall carry a strip
+  with the project's folio, `label`, `start_date` year and `status`; a 16:9
+  plate, the `thumbnail` with the `icon` as a badge (or the `icon` plate),
+  with the title always below it; the `tagline`; the `tags`; and the
+  outbound `github`, `article_url` and `external_url` links. The title is
+  its only link to the project page.
+- `PLT-AC-14` When a project lacks `thumbnail`, `label`, `status`,
+  `start_date`, `tagline`, `tags` or outbound links, the specimen card and its
+  rack card shall render no element for that field. A missing `icon` is
+  covered by `PLT-AC-18`.
+- `PLT-AC-15` When the viewport is at least 900px wide, the specimen shall
+  take half the band and the rack a narrower column beside it, leaving the
+  rest blank. Each project shall appear in the rack as a card with its folio,
+  `label`, `status`, title, `tagline` and a 16:9 `thumbnail` (or `icon`, or
+  initial) mark. Selecting a card shall swap the specimen in place and mark
+  that card `aria-pressed="true"`.
+- `PLT-AC-16` Withdrawn: the tape of previous and next arrows was removed;
+  the rack is the only way to change the specimen.
+- `PLT-AC-17` When the viewport is narrower than 900px, the rack shall be a
+  strip of icon buttons above the specimen, one per project (up to six), that
+  together span the band's width.
+- `PLT-AC-18` When a project lacks `icon`, the first letter of its name shall
+  stand in for it wherever the icon would appear: the specimen badge, the
+  specimen plate, the rack mark and the strip button. The elements and the
+  behavior shall be those of a project with an icon.
+
+`PLT-AC-13`, `-14` and `-18` are covered by the block fixtures under
+`scripts/test/render-parity/blocks/` and by the absent-field gate; `-15` and
+`-17` are layout behavior verified in the browser.
+
 ## Package layout
 
 - `template.yml` — slots, detail route, export fields

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: pandorga
 version: !ruby/object:Gem::Version
-  version: 1.3.6
+  version: 1.3.7
 platform: ruby
 authors:
 - The Pandorga contributors
@@ -339,6 +339,12 @@ files:
 - scripts/test/render-parity/blocks/meta-strip.json
 - scripts/test/render-parity/blocks/poster-media-image.json
 - scripts/test/render-parity/blocks/poster-media-video.json
+- scripts/test/render-parity/blocks/project-inventory-row-icon.json
+- scripts/test/render-parity/blocks/project-inventory-row.json
+- scripts/test/render-parity/blocks/project-specimen-glyph.json
+- scripts/test/render-parity/blocks/project-specimen-initial-badge.json
+- scripts/test/render-parity/blocks/project-specimen-initial.json
+- scripts/test/render-parity/blocks/project-specimen.json
 - scripts/test/render-parity/blocks/section-banner.json
 - scripts/test/render-parity/blocks/system-card-custom-meta.json
 - scripts/test/render-parity/blocks/system-card.json
@@ -389,6 +395,7 @@ files:
 - scripts/test/test-home-band-art.rb
 - scripts/test/test-install-functions.rb
 - scripts/test/test-language-export.rb
+- scripts/test/test-ledger-blocks.rb
 - scripts/test/test-listing-filter-contract.rb
 - scripts/test/test-math-row-breaks.mjs
 - scripts/test/test-math-row-breaks.rb