Merge pull request #8 from fritzhand/claude/install-ga4-432gka

Add a dedicated Ecosystem news page

Author: fritzhand

build.mjs

@@ -69,6 +69,19 @@ const news = (() => {
 })();
 const hostOf = (u) => { try { return new URL(u).hostname.replace(/^www\./, ""); } catch { return ""; } };
 const tickerItem = (n) => `<a class="ticker-item" href="${attr(n.url)}" target="_blank" rel="noopener"><span class="ti-src">${esc(n.source || hostOf(n.url))}</span><span class="ti-title">${esc(n.title)}</span></a>`;
+const NEWS_MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+const fmtNewsDate = (iso) => { const m = /^(\d{4})-(\d{2})-(\d{2})/.exec(iso || ""); return m ? `${NEWS_MONTHS[+m[2] - 1]} ${+m[3]}, ${m[1]}` : ""; };
+const newsSlug = (n) => (n.id || "n-" + hostOf(n.url) + "-" + (n.date || "")).replace(/[^a-z0-9-]/gi, "-").toLowerCase();
+const newsCard = (n) => `
+  <article class="news-card" id="${newsSlug(n)}">
+    <div class="nc-head">
+      <span class="nc-src">${esc(n.source || hostOf(n.url))}</span>
+      ${n.date ? `<time class="nc-date" datetime="${attr(n.date)}">${esc(fmtNewsDate(n.date))}</time>` : ""}
+    </div>
+    <h3 class="nc-title"><a href="${attr(n.url)}" target="_blank" rel="noopener">${esc(n.title)} ${ICONS.external}</a></h3>
+    ${n.summary ? `<p class="nc-summary">${esc(n.summary)}</p>` : ""}
+    <div class="nc-foot">${(n.tags || []).map((t) => `<span class="nc-tag">${esc(t)}</span>`).join("")}<span class="nc-host">${esc(hostOf(n.url))}</span></div>
+  </article>`;
 
 /* ---------------- taxonomy labels ---------------- */
 const CAT_LABEL = { grant: "Grant", equity: "Equity", "loan-credit": "Loan / Credit", incubation: "Incubation", "market-access": "Market Access", mixed: "Mixed", other: "Other" };
@@ -243,6 +256,7 @@ const NAV_PAGES = [
     { href: "finder.html", title: "Scheme Finder", icon: "compass" },
     { href: "lifecycle.html", title: "Lifecycle Map", icon: "sprout" },
     { href: "needs.html", title: "What do you need?", icon: "target" },
+    { href: "news.html", title: "Ecosystem news", icon: "news" },
   ]},
   { group: "Browse", items: [
     { href: "directory.html", title: "All schemes", icon: "grid" },
@@ -463,13 +477,14 @@ const write = (rel, html) => { mkdirSync(dirname(join(OUT, rel)), { recursive: t
   const seq = tickerItems.map(tickerItem).join("");
   const tickerHTML = tickerItems.length ? `
 <div class="news-ticker" role="region" aria-label="Latest Indian startup ecosystem news">
-  <span class="ticker-tag">${ICONS.news}<span>News</span></span>
+  <a class="ticker-tag" href="news.html">${ICONS.news}<span>News</span></a>
   <div class="ticker-viewport">
     <div class="ticker-track" style="animation-duration:${tickerDur}s">
       <div class="ticker-seq">${seq}</div>
       <div class="ticker-seq" aria-hidden="true">${seq}</div>
     </div>
   </div>
+  <a class="ticker-more" href="news.html">All news ${ICONS.arrow}</a>
 </div>` : "";
 
   const body = `
@@ -1121,6 +1136,40 @@ ${rel.length ? `
   }));
 });
 
+/* ================= NEWS ================= */
+{
+  const srcNames = [...new Set(news.map((n) => n.source).filter(Boolean))];
+  const latest = news.length ? fmtNewsDate(news[0].date) : "";
+  const intro = news.length
+    ? `The latest coverage of India's startup ecosystem — ${news.length} stories from ${srcNames.length} source${srcNames.length === 1 ? "" : "s"}, each linking straight to the publisher.`
+    : `A source-linked feed of the latest coverage of India's startup ecosystem.`;
+  const body = `
+${crumbs("", [["Home", "index.html"], ["Ecosystem news", null]])}
+<div class="page-head">
+  <div class="kicker">Startup ecosystem${latest ? ` · latest ${esc(latest)}` : ""}</div>
+  <h1>Ecosystem news</h1>
+  <p class="lede">${esc(intro)}</p>
+</div>
+${news.length ? `
+<div class="news-meta">
+  <div class="callout tone-info" style="margin:0 0 22px">
+    <span class="ic">${ICONS.info}</span>
+    <div>Headlines are curated from reputable outlets covering India's startup ecosystem — each links straight to the publisher. Nothing here is written or edited by this site; always verify scheme details on the official portals.</div>
+  </div>
+  <div class="news-sources"><span class="ns-label">Sources in this feed</span>${srcNames.map((s) => `<span class="nc-tag">${esc(s)}</span>`).join("")}</div>
+</div>
+<div class="news-grid">
+  ${news.map((n) => newsCard(n)).join("")}
+</div>` : `
+<div class="empty-state" style="margin-top:40px">
+  <div class="big">📰</div>
+  <h2 style="font-size:1.3rem">No news yet</h2>
+  <p class="muted" style="margin-top:8px">This feed is populated from <code>data/news.json</code>. Add source-linked headlines there and rebuild.</p>
+  <p style="margin-top:18px"><a class="btn btn-primary" href="directory.html">Browse all schemes</a></p>
+</div>`}`;
+  write("news.html", shell({ root: "", active: "news.html", title: "Ecosystem news", description: "Source-linked news about India's startup ecosystem — funding, policy, schemes and incubators.", body }));
+}
+
 /* ================= 404 ================= */
 write("404.html", shell({
   root: PATH_PREFIX, active: "", title: "Page not found",

docs/404.html

@@ -59,6 +59,7 @@
 <a class="nav-link" href="/startup-india-guide/finder.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="/startup-india-guide/lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="/startup-india-guide/needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="/startup-india-guide/news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>
 

docs/about.html

@@ -59,6 +59,7 @@
 <a class="nav-link" href="finder.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>
 

docs/assets/search-index.js

@@ -455,14 +455,52 @@ a.stat .l { color: var(--link); }
 .ticker-item:hover .ti-title { color: var(--text); text-decoration: underline; text-underline-offset: 2px; }
 .ti-src { color: var(--accent); font-weight: 700; font-size: 0.78rem; }
 .ti-title { color: var(--text-muted); font-size: 0.84rem; max-width: 44ch; overflow: hidden; text-overflow: ellipsis; }
+.ticker-tag:hover { text-decoration: none; color: #fff; filter: brightness(1.12); }
+.ticker-more {
+  display: inline-flex; align-items: center; gap: 5px; flex: none;
+  padding: 0 15px; font-size: 0.76rem; font-weight: 600; color: var(--text-muted);
+  white-space: nowrap; border-left: 1px solid var(--border); background: var(--surface);
+}
+.ticker-more:hover { text-decoration: none; color: var(--primary); background: var(--surface-alt); }
+.ticker-more svg { width: 14px; height: 14px; }
 @keyframes ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
-@media (max-width: 640px) { .ti-title { max-width: 30ch; } }
+@media (max-width: 640px) { .ti-title { max-width: 30ch; } .ticker-more { display: none; } }
 @media (prefers-reduced-motion: reduce) {
   .ticker-track { animation: none; }
   .ticker-seq[aria-hidden="true"] { display: none; }
   .ticker-viewport { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
 }
 
+/* ---------- news page ---------- */
+.news-sources { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 0 0 24px; }
+.news-sources .ns-label {
+  font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em;
+  color: var(--text-faint); margin-right: 4px;
+}
+.news-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); margin-top: 6px; }
+.news-card {
+  display: flex; flex-direction: column; gap: 9px;
+  padding: 18px; background: var(--surface); border: 1px solid var(--border);
+  border-radius: var(--radius-lg); box-shadow: var(--shadow-1);
+  scroll-margin-top: 80px;
+}
+.news-card:target { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent); }
+.nc-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
+.nc-src { font-size: 0.76rem; font-weight: 700; color: var(--accent); letter-spacing: 0.01em; }
+.nc-date { font-size: 0.74rem; color: var(--text-faint); font-family: var(--font-mono); white-space: nowrap; }
+.nc-title { font-size: 1rem; line-height: 1.35; font-weight: 700; }
+.nc-title a { color: var(--text); display: inline; }
+.nc-title a:hover { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
+.nc-title svg { width: 13px; height: 13px; color: var(--text-faint); vertical-align: baseline; flex: none; }
+.nc-summary { font-size: 0.875rem; color: var(--text-muted); line-height: 1.5; }
+.nc-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: auto; padding-top: 4px; }
+.nc-tag {
+  display: inline-block; font-size: 0.7rem; font-weight: 600; color: var(--text-muted);
+  background: var(--surface-sunken); border: 1px solid var(--border);
+  border-radius: var(--radius-pill); padding: 2px 9px;
+}
+.nc-host { margin-left: auto; font-size: 0.72rem; color: var(--text-faint); font-family: var(--font-mono); }
+
 /* ---------- card grids ---------- */
 .grid { display: grid; gap: 16px; margin-top: 20px; }
 .grid-2 { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }

docs/assets/site.css

@@ -59,6 +59,7 @@
 <a class="nav-link" href="finder.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>
 

docs/compare.html

@@ -59,6 +59,7 @@
 <a class="nav-link" href="finder.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>
 

docs/directory.html

@@ -59,6 +59,7 @@
 <a class="nav-link" href="finder.html" aria-current="page"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>
 

docs/finder.html

@@ -59,6 +59,7 @@
 <a class="nav-link" href="finder.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><path d="m16.2 7.8-2.3 6.1-6.1 2.3 2.3-6.1z"/></svg></span>Scheme Finder</a>
 <a class="nav-link" href="lifecycle.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M12 20v-8m0 0S9 4 3 4c0 6 5 8 9 8Zm0-3s2-6 9-6c0 5-4 7-9 7"/></svg></span>Lifecycle Map</a>
 <a class="nav-link" href="needs.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/></svg></span>What do you need?</a>
+<a class="nav-link" href="news.html"><span class="card-icon" style="width:22px;height:22px;border-radius:6px;background:transparent;color:var(--text-faint)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" width="15" height="15"><path d="M4 22h14a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"/><path d="M18 14h-8M15 18h-5M10 6h8v4h-8V6Z"/></svg></span>Ecosystem news</a>
 
     </div>