@port60/template-kit 0.20.2 → 0.20.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@port60/template-kit",
-  "version": "0.20.2",
+  "version": "0.20.3",
   "description": "Build Port60 site templates locally: scaffold, live-preview, validate against the platform contract, and package for studio upload. AI-agent ready: every scaffold ships AGENTS.md and validate emits machine-readable JSON.",
   "type": "module",
   "bin": {

package/src/vendor/validator/platform-base.css

@@ -4761,6 +4761,12 @@ textarea.p60-form-control {
   padding: 0.55rem 0.95rem;
   border-radius: 999px;
 }
+/* Named in every theme: the placeholder is the theme's ink at half strength, never the generic
+   muted grey, which vanishes on a dark masthead. */
+.site-search-input::placeholder {
+  color: color-mix(in srgb, var(--ink) 55%, transparent);
+  opacity: 1;
+}
 .site-search-submit {
   padding: 0.55rem 0.95rem;
   border: 1px solid var(--line);
@@ -4855,39 +4861,56 @@ textarea.p60-form-control {
   margin: 0 0 0.35rem;
 }
 /* In the primary nav the box stays compact and grows on focus; Enter searches, so the button rests. */
-.site-nav .site-search {
+/* In a header nav the box is compact and grows on focus; the submit button is the Enter key.
+   Keyed off default's .site-nav AND the layout behaviour API's #site-nav (in attribute form on
+   purpose: class-level specificity, so a template can still override with two classes of its own),
+   so every artifact template's primary nav gets the same compact box whatever its class is called. */
+.site-nav .site-search,
+[id="site-nav"] .site-search {
   margin-inline-start: 0.35rem;
 }
-.site-nav .site-search-input {
+.site-nav .site-search-input,
+[id="site-nav"] .site-search-input {
   width: 9rem;
   min-width: 0;
   padding: 0.45rem 0.85rem;
   font-size: 0.92rem;
   transition: width 0.16s ease;
 }
-.site-nav .site-search-input:focus {
+.site-nav .site-search-input:focus,
+[id="site-nav"] .site-search-input:focus {
   width: 12.5rem;
 }
-.site-nav .site-search-submit {
+.site-nav .site-search-submit,
+[id="site-nav"] .site-search-submit {
   display: none;
 }
 .site-nav .site-search-results,
+[id="site-nav"] .site-search-results,
 .site-nav .site-search-empty,
-.site-nav .site-search-corrected {
+[id="site-nav"] .site-search-empty,
+.site-nav .site-search-corrected,
+[id="site-nav"] .site-search-corrected {
   right: 0;
   left: auto;
 }
 @media (max-width: 860px) {
-  .site-nav .site-search {
+  .site-nav .site-search,
+  [id="site-nav"] .site-search {
     margin: 0.5rem 0;
   }
   .site-nav .site-search-input,
-  .site-nav .site-search-input:focus {
+  [id="site-nav"] .site-search-input,
+  .site-nav .site-search-input:focus,
+  [id="site-nav"] .site-search-input:focus {
     width: 100%;
   }
   .site-nav .site-search-results,
+  [id="site-nav"] .site-search-results,
   .site-nav .site-search-empty,
-  .site-nav .site-search-corrected {
+  [id="site-nav"] .site-search-empty,
+  .site-nav .site-search-corrected,
+  [id="site-nav"] .site-search-corrected {
     position: static;
     min-width: 0;
     box-shadow: none;

package/starter/layout.liquid

@@ -3,7 +3,7 @@
   chrome classes (.site-header/.site-nav/…) so the base mechanics (sticky header, burger
   breakpoint, dropdown hover) apply, and emits the documented behaviour attributes
   (data-nav-burger, #site-nav) so the platform tail script wires the mobile burger. Identity is
-  PLACED, never rebuilt: {% island 'member_menu' %}. The footer derives everything from brand/nav, no fabricated copy (derive or omit).
+  PLACED, never rebuilt: {% island 'member_menu' %} and {% island 'search' %}. The footer derives everything from brand/nav, no fabricated copy (derive or omit).
 {% endcomment %}
 <header class="site-header">
   <div class="container header-inner">
@@ -42,6 +42,7 @@
           <a href="{{ item.href }}"{% if item.external %} target="_blank" rel="noopener"{% endif %}>{{ item.label }}</a>
         {% endif %}
       {% endfor %}
+      {% island 'search' %}
       {% island 'member_menu' %}
     </nav>
   </div>

package/starter/manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "starter",
-  "version": "1.12.0",
+  "version": "1.13.0",
   "format": "port60-liquid@1",
   "label": "Starter",
   "description": "The reference template for the Port60 dialect, the developer docs' worked example and the base to copy when building your own. 1.1.0 adds the layout slot: the template owns the header, navigation and footer chrome.",
@@ -23,7 +23,8 @@
       "member_menu",
       "hero_carousel",
       "map",
-      "primary_action_widget"
+      "primary_action_widget",
+      "search"
     ],
     "layout": true,
     "heroImagery": true,
@@ -53,7 +54,7 @@
       }
     ]
   },
-  "changelog": "Adds the impact map section: pin your located work on a themed map of where you work.",
+  "changelog": "Places the site search box in the header: a typeahead across events, articles, services, campaigns, appeals, volunteering and documents, with the results page at /search.",
   "imagery": {
     "hero": {
       "idealAspect": "16:9",