pandorga 1.3.6 → 1.3.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c6a4f2b9d6301de61dc8a70de9ea3e47838f8896ac2b87f0cd77e07665c0030d
-  data.tar.gz: 41c8cefdadd4e2b58d2cf424f587bcb70c98531b870f04a8bfdef7ee0420a33c
+  metadata.gz: cc27aeecd257bc67bb04735b6f9d1069057abe7df27b9857bd1acf3a3eb6ea13
+  data.tar.gz: d7028bb2f9ed6c2c021564327a5a5cb3333e344cd7447ab6a088ec7bb03eba84
 SHA512:
-  metadata.gz: 26e0bbd8c1f915e22a81e34f365e70e7302cd983701730ecdef31bb11a3892a78fad827651cd364276a7cd87b74566b5dd9f60ff208cd9ad9b90bb3df764f7c0
-  data.tar.gz: 3a4c0e1a3641a3558c02867e832424e12f2bcbf20d8d9db0675387f314ed550d780cd870930cc03ecdc8fb5e75898de6d79698ac78fc636b4ab2e9c243e8827e
+  metadata.gz: 43003521e76f118bf9c12e720fc2c4132748ebdd03f8c9443b1591ef0283e81ee6d088e6bf5d96c1f4066f9ffabf408070b0c6b0326ebc314ecc09a67da7f822
+  data.tar.gz: 12319e52eaea1045ca920545e2b816d626cb85e4b8fb32f32d7ccf04e1159e5cbda0c0896851172c172c59594a5d8da09e950d78a02b22236ae551df91db3094

data/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## [1.3.8] — 2026-10-06
+
+### Fixed
+
+- Home specimen grows with its tagline and wrapping tag chips instead of
+  clipping under a fixed height; pills stay one line (row wraps whole chips)
+- Specimen strip above the plate uses the projects label chrome at a larger
+  step so it matches the featured scale
+
+## [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 grows with its tagline and wrapping chips; the rack
+           stretches to the same row via the bench grid. */
         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/base.css

@@ -831,6 +831,8 @@ a.no-underline:active {
 }
 
 .ledger-chip {
+  flex: 0 0 auto;
+  white-space: nowrap;
   font-family: var(--font-label);
   font-size: var(--type-cta);
   font-weight: var(--weight-label);