From 8cd3565452e2baba26e39a346593951715d50792 Mon Sep 17 00:00:00 2001
From: Zach Hawtof <zhawtof@gmail.com>
Date: Sat, 16 May 2026 01:05:43 -0400
Subject: [PATCH] design: copy polish, heart redesign, license chips, no
 em-dashes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Page polish:
- Hero pill: drop dynamic repo count, replace with "for teams building on slack · open source"
- RepoGrid subhead: reframe around Slack-dev tooling; reorder featured so slack-hono is slot 2
- Footer: swap blog link for community (community.tightknit.ai); "all repos" arrow now points up
- Manifesto principle 03: reframed as "From the Tightknit team." (no overclaim of every lib running in prod)

Logo + favicon:
- Redrew Heart polygon so humps are rounder (3 cells wide at top) and valley is shallower (2 rows)
- Favicon: removed beige background rect so it sits transparent in the browser tab

Type effect:
- .stacked-3d now layers pink, yellow, cyan, black instead of pink + double-black

Repo cards:
- Show SPDX license between language and stars; backfill MIT on fallback/manual repos
- Hide stars row when count < 10

Em-dash sweep:
- Removed em dashes from all user-visible copy (Layout title, 404, Footer, RepoGrid, Hero, slack-hono fallback description)
- API descriptions normalized in github.ts so anything fetched from GitHub also drops em dashes
---
 public/favicon.svg             |  5 ++---
 public/llms.txt                |  6 +++---
 public/og.svg                  |  2 +-
 src/components/Footer.astro    | 10 +++++-----
 src/components/Heart.astro     |  4 ++--
 src/components/Hero.astro      |  7 ++-----
 src/components/Manifesto.astro |  4 ++--
 src/components/RepoCard.astro  | 15 ++++++++++-----
 src/components/RepoGrid.astro  |  7 ++++---
 src/layouts/Layout.astro       |  4 ++--
 src/lib/github.ts              | 12 ++++++++++--
 src/pages/404.astro            |  4 ++--
 src/pages/index.astro          |  4 ++--
 src/pages/index.md.ts          | 17 +++++++++--------
 src/styles/global.css          |  6 +++---
 15 files changed, 59 insertions(+), 48 deletions(-)

diff --git a/public/favicon.svg b/public/favicon.svg
index dfd0bb3..c3bfad0 100644
--- a/public/favicon.svg
+++ b/public/favicon.svg
@@ -1,5 +1,4 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
-  <rect width="64" height="64" fill="#f3ede0"/>
-  <polygon points="21,9 33,9 33,27 39,27 39,9 51,9 51,15 57,15 57,21 63,21 63,39 57,39 57,45 51,45 51,51 45,51 45,57 39,57 39,63 33,63 33,57 27,57 27,51 21,51 21,45 15,45 15,39 9,39 9,21 15,21 15,15 21,15" fill="#0a0a0a"/>
-  <polygon points="17,5 29,5 29,23 35,23 35,5 47,5 47,11 53,11 53,17 59,17 59,35 53,35 53,41 47,41 47,47 41,47 41,53 35,53 35,59 29,59 29,53 23,53 23,47 17,47 17,41 11,41 11,35 5,35 5,17 11,17 11,11 17,11" fill="#ff2d7b"/>
+  <polygon points="15,9 33,9 33,21 39,21 39,9 57,9 57,15 63,15 63,39 57,39 57,45 51,45 51,51 45,51 45,57 39,57 39,63 33,63 33,57 27,57 27,51 21,51 21,45 15,45 15,39 9,39 9,15 15,15" fill="#0a0a0a"/>
+  <polygon points="11,5 29,5 29,17 35,17 35,5 53,5 53,11 59,11 59,35 53,35 53,41 47,41 47,47 41,47 41,53 35,53 35,59 29,59 29,53 23,53 23,47 17,47 17,41 11,41 11,35 5,35 5,11 11,11" fill="#ff2d7b"/>
 </svg>
diff --git a/public/llms.txt b/public/llms.txt
index c9a2e05..8b17471 100644
--- a/public/llms.txt
+++ b/public/llms.txt
@@ -7,18 +7,18 @@ tightknit.dev is the landing page for tightknit's open source repos. The repo gr
 ## Featured repos
 
 - [block-kitchen](https://github.com/tightknitai/block-kitchen): Compose Slack Block Kit messages with a React-style API.
+- [slack-hono](https://github.com/tightknitai/slack-hono): Build Slack apps on Hono. Works on Workers, Bun, Node.
 - [slack-block-kit-validator](https://github.com/tightknitai/slack-block-kit-validator): Validate Slack Block Kit payloads before you send them.
-- [slack-hono](https://github.com/tightknitai/slack-hono): Build Slack apps on Hono — works on Workers, Bun, Node.
 - [slack-hono-template](https://github.com/tightknitai/slack-hono-template): Starter template for shipping a Slack app with slack-hono on Cloudflare Workers.
 
 ## Principles
 
 - **Made to be forked.** Every repo is MIT (or compatible). Lift it, mod it, ship it.
 - **TypeScript first.** Strict mode on, types as docs, end-to-end inference where possible. Runtimes: Node, Bun, Cloudflare Workers.
-- **Built in public.** Roadmaps in GitHub issues, releases on a real changelog, maintainers read PRs.
+- **From the Tightknit team.** Built by the team behind Tightknit, the #1 community platform on Slack. These are the libraries and patterns we reach for when shipping Slack apps, open sourced for yours.
 
 ## Links
 
 - [GitHub org (tightknitai)](https://github.com/tightknitai): Source of truth for all open source repos.
-- [tightknit.ai](https://tightknit.ai): The company behind these tools — community platform for developer-facing teams.
+- [tightknit.ai](https://tightknit.ai): The company behind these tools. The #1 community platform on Slack.
 - [tightknit.dev source](https://github.com/TightknitAI/tightknit.dev): Source code for this landing page (Astro 5, Tailwind v4, Cloudflare Workers).
diff --git a/public/og.svg b/public/og.svg
index fdda41e..c9f661f 100644
--- a/public/og.svg
+++ b/public/og.svg
@@ -27,7 +27,7 @@
   <!-- eyebrow -->
   <g font-family="'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, monospace" font-weight="600" font-size="22" letter-spacing="4" fill="#0a0a0a">
     <rect x="72" y="92" width="14" height="14" fill="#ff3366"/>
-    <text x="100" y="106" opacity="0.85">TIGHTKNIT.DEV — OPEN SOURCE</text>
+    <text x="100" y="106" opacity="0.85">TIGHTKNIT.DEV · OPEN SOURCE</text>
   </g>
 
   <!-- main wordmark (stacked 3D look) -->
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 45b1d81..be0e05f 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -4,7 +4,7 @@ const year = new Date().getFullYear();
 ---
 
 <footer class="bg-cream-dim border-ink relative overflow-hidden border-t-[3px]">
-  <!-- Giant brand wordmark — SVG auto-fits to viewport width -->
+  <!-- Giant brand wordmark; SVG auto-fits to viewport width -->
   <div
     class="pointer-events-none px-4 pt-12 select-none sm:px-6 lg:px-10 lg:pt-16"
     aria-hidden="true"
@@ -49,7 +49,7 @@ const year = new Date().getFullYear();
           </li>
           <li>
             <a href="#repos" class="hover:text-pink decoration-2 underline-offset-4 hover:underline"
-              >all repos ↓</a
+              >all repos ↑</a
             >
           </li>
         </ul>
@@ -70,10 +70,10 @@ const year = new Date().getFullYear();
           </li>
           <li>
             <a
-              href="https://tightknit.ai/blog"
+              href="https://community.tightknit.ai"
               target="_blank"
               rel="noopener"
-              class="hover:text-pink decoration-2 underline-offset-4 hover:underline">blog →</a
+              class="hover:text-pink decoration-2 underline-offset-4 hover:underline">community →</a
             >
           </li>
         </ul>
@@ -116,7 +116,7 @@ const year = new Date().getFullYear();
       class="border-ink/15 text-ink/60 flex flex-col gap-4 border-t-2 pt-6 font-mono text-[12px] tracking-[0.12em] uppercase sm:flex-row sm:items-center sm:justify-between"
     >
       <div>
-        © {year} tightknit — made with <Heart
+        © {year} tightknit · made with <Heart
           class="mx-0.5 inline-block h-3.5 w-3.5 align-[-3px]"
         /> in public
       </div>
diff --git a/src/components/Heart.astro b/src/components/Heart.astro
index 629a310..3cb02fd 100644
--- a/src/components/Heart.astro
+++ b/src/components/Heart.astro
@@ -18,12 +18,12 @@ const {
   {
     shadow && (
       <polygon
-        points="21,9 33,9 33,27 39,27 39,9 51,9 51,15 57,15 57,21 63,21 63,39 57,39 57,45 51,45 51,51 45,51 45,57 39,57 39,63 33,63 33,57 27,57 27,51 21,51 21,45 15,45 15,39 9,39 9,21 15,21 15,15 21,15"
+        points="15,9 33,9 33,21 39,21 39,9 57,9 57,15 63,15 63,39 57,39 57,45 51,45 51,51 45,51 45,57 39,57 39,63 33,63 33,57 27,57 27,51 21,51 21,45 15,45 15,39 9,39 9,15 15,15"
         fill={shadowFill}
       />
     )
   }
   <polygon
-    points="17,5 29,5 29,23 35,23 35,5 47,5 47,11 53,11 53,17 59,17 59,35 53,35 53,41 47,41 47,47 41,47 41,53 35,53 35,59 29,59 29,53 23,53 23,47 17,47 17,41 11,41 11,35 5,35 5,17 11,17 11,11 17,11"
+    points="11,5 29,5 29,17 35,17 35,5 53,5 53,11 59,11 59,35 53,35 53,41 47,41 47,47 41,47 41,53 35,53 35,59 29,59 29,53 23,53 23,47 17,47 17,41 11,41 11,35 5,35 5,11 11,11"
     fill={fill}></polygon>
 </svg>
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index 09ae74c..e225ae2 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -1,8 +1,5 @@
 ---
-interface Props {
-  repoCount: number;
-}
-const { repoCount } = Astro.props;
+
 ---
 
 <section class="border-ink relative overflow-hidden border-b-[3px]">
@@ -49,7 +46,7 @@ const { repoCount } = Astro.props;
     <div class="mb-8 inline-flex items-center gap-3">
       <span class="bg-pink inline-block h-2.5 w-2.5 animate-pulse"></span>
       <span class="text-ink/70 font-mono text-[12px] tracking-[0.18em] uppercase">
-        {repoCount} open source repos · maintained in public
+        for teams building on slack · open source
       </span>
     </div>
 
diff --git a/src/components/Manifesto.astro b/src/components/Manifesto.astro
index 683ba5b..49858e5 100644
--- a/src/components/Manifesto.astro
+++ b/src/components/Manifesto.astro
@@ -12,8 +12,8 @@ const items = [
   },
   {
     n: '03',
-    title: 'Built in public.',
-    body: 'Roadmaps in GitHub issues, releases on a real changelog, and the maintainers actually read PRs.',
+    title: 'From the Tightknit team.',
+    body: 'Built by the team behind Tightknit, the #1 community platform on Slack. These are the libraries and patterns we reach for when shipping Slack apps, open sourced for yours.',
   },
 ];
 ---
diff --git a/src/components/RepoCard.astro b/src/components/RepoCard.astro
index 354a833..56d2864 100644
--- a/src/components/RepoCard.astro
+++ b/src/components/RepoCard.astro
@@ -63,7 +63,7 @@ const dividerColor = isInverse ? 'border-cream/25' : 'border-ink/15';
   }
 
   <div
-    class={`flex items-center gap-4 pt-4 border-t-2 ${dividerColor} font-mono text-[12px] uppercase tracking-[0.08em]`}
+    class={`flex flex-wrap items-center gap-x-4 gap-y-1 pt-4 border-t-2 ${dividerColor} font-mono text-[12px] uppercase tracking-[0.08em]`}
   >
     {
       repo.language && (
@@ -73,10 +73,15 @@ const dividerColor = isInverse ? 'border-cream/25' : 'border-ink/15';
         </span>
       )
     }
-    <span class="flex items-center gap-1">
-      <span aria-hidden="true">★</span>
-      {repo.stars}
-    </span>
+    {repo.license && <span class="opacity-70">{repo.license}</span>}
+    {
+      repo.stars >= 10 && (
+        <span class="flex items-center gap-1">
+          <span aria-hidden="true">★</span>
+          {repo.stars}
+        </span>
+      )
+    }
     <span class="ml-auto opacity-70">{formatRelativeTime(repo.pushedAt)}</span>
   </div>
 </a>
diff --git a/src/components/RepoGrid.astro b/src/components/RepoGrid.astro
index d044aed..16a5bdf 100644
--- a/src/components/RepoGrid.astro
+++ b/src/components/RepoGrid.astro
@@ -8,7 +8,7 @@ interface Props {
 const { repos } = Astro.props;
 
 // Hand-pick the headline projects; remaining repos sort by stars (already sorted upstream).
-const FEATURED_NAMES = ['block-kitchen', 'slack-block-kit-validator', 'slack-hono'];
+const FEATURED_NAMES = ['block-kitchen', 'slack-hono', 'slack-block-kit-validator'];
 const featured = FEATURED_NAMES.map((name) => repos.find((r) => r.name === name)).filter(
   (r): r is Repo => r !== undefined,
 );
@@ -32,12 +32,13 @@ const featuredVariants = ['yellow', 'pink', 'cyan'] as const;
         </h2>
       </div>
       <p class="text-ink/70 max-w-md font-mono text-sm leading-relaxed">
-        Auto-synced from <a
+        Block Kit tooling, app frameworks, and validators we use to ship Slack apps faster. Open
+        sourced on <a
           href="https://github.com/tightknitai"
           class="decoration-pink hover:text-pink underline decoration-2 underline-offset-2"
           target="_blank"
           rel="noopener">github.com/tightknitai</a
-        > at build time. Sorted by stars.
+        >.
       </p>
     </div>
 
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 142d8b9..4f2c82f 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -11,7 +11,7 @@ interface Props {
 }
 
 const {
-  title = 'tightknit.dev — open source tools for Slack apps & AI agents',
+  title = 'tightknit.dev · open source tools for Slack apps & AI agents',
   description = 'Open source TypeScript libraries, agents, and developer tools for building Slack apps and AI agents. Built and maintained in public by the team at tightknit.ai.',
   image = '/og.png',
   jsonLd = [],
@@ -76,7 +76,7 @@ const allJsonLd = [organizationLd, websiteLd, ...jsonLd];
     <meta property="og:image" content={ogImageUrl} />
     <meta property="og:image:width" content="1200" />
     <meta property="og:image:height" content="630" />
-    <meta property="og:image:alt" content="tightknit.dev — tools for Slack + agents" />
+    <meta property="og:image:alt" content="tightknit.dev · tools for Slack + agents" />
 
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:site" content="@tightknitai" />
diff --git a/src/lib/github.ts b/src/lib/github.ts
index 3c3b068..e3f5979 100644
--- a/src/lib/github.ts
+++ b/src/lib/github.ts
@@ -7,6 +7,7 @@ export interface Repo {
   stars: number;
   forks: number;
   language: string | null;
+  license: string | null;
   topics: string[];
   pushedAt: string;
   archived: boolean;
@@ -22,6 +23,7 @@ interface GitHubRepoApi {
   stargazers_count: number;
   forks_count: number;
   language: string | null;
+  license: { spdx_id: string | null; name: string | null } | null;
   topics: string[];
   pushed_at: string;
   archived: boolean;
@@ -105,12 +107,14 @@ export async function getOrgRepos(org: string): Promise<Repo[]> {
       (r): Repo => ({
         name: r.name,
         fullName: r.full_name,
-        description: r.description,
+        description: r.description ? r.description.replace(/\s*—\s*/g, ', ') : null,
         url: r.html_url,
         homepage: r.homepage,
         stars: r.stargazers_count,
         forks: r.forks_count,
         language: r.language,
+        license:
+          r.license?.spdx_id && r.license.spdx_id !== 'NOASSERTION' ? r.license.spdx_id : null,
         topics: sortTopics(r.topics ?? []),
         pushedAt: r.pushed_at,
         archived: r.archived,
@@ -130,6 +134,7 @@ const FALLBACK_REPOS: Repo[] = [
     stars: 0,
     forks: 0,
     language: 'TypeScript',
+    license: 'MIT',
     topics: ['slack', 'block-kit'],
     pushedAt: new Date().toISOString(),
     archived: false,
@@ -144,6 +149,7 @@ const FALLBACK_REPOS: Repo[] = [
     stars: 0,
     forks: 0,
     language: 'TypeScript',
+    license: 'MIT',
     topics: ['slack', 'block-kit', 'validation'],
     pushedAt: new Date().toISOString(),
     archived: false,
@@ -152,12 +158,13 @@ const FALLBACK_REPOS: Repo[] = [
   {
     name: 'slack-hono',
     fullName: 'tightknitai/slack-hono',
-    description: 'Build Slack apps on Hono — works on Workers, Bun, Node.',
+    description: 'Build Slack apps on Hono. Works on Workers, Bun, Node.',
     url: 'https://github.com/tightknitai/slack-hono',
     homepage: null,
     stars: 0,
     forks: 0,
     language: 'TypeScript',
+    license: 'MIT',
     topics: ['slack', 'hono', 'cloudflare-workers'],
     pushedAt: new Date().toISOString(),
     archived: false,
@@ -179,6 +186,7 @@ const MANUAL_REPOS: Repo[] = [
     stars: 0,
     forks: 0,
     language: 'TypeScript',
+    license: 'MIT',
     topics: ['slack', 'hono', 'cloudflare-workers', 'template'],
     pushedAt: new Date().toISOString(),
     archived: false,
diff --git a/src/pages/404.astro b/src/pages/404.astro
index 9f0ebd3..ae93e3e 100644
--- a/src/pages/404.astro
+++ b/src/pages/404.astro
@@ -4,7 +4,7 @@ import Nav from '../components/Nav.astro';
 import Footer from '../components/Footer.astro';
 ---
 
-<Layout title="404 — tightknit.dev" description="Page not found.">
+<Layout title="404 · tightknit.dev" description="Page not found.">
   <Nav />
   <main class="border-ink relative overflow-hidden border-b-[3px]">
     <div class="grid-bg pointer-events-none absolute inset-0 opacity-90"></div>
@@ -20,7 +20,7 @@ import Footer from '../components/Footer.astro';
         404.
       </h1>
       <p class="text-ink/85 mt-10 max-w-xl text-lg font-medium">
-        That page doesn't exist (yet). The repos live below — or head back to{' '}
+        That page doesn't exist (yet). The repos live below, or head back to{' '}
         <a
           href="/"
           class="decoration-pink hover:text-pink underline decoration-[3px] underline-offset-4"
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 3794187..94bbf73 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -10,7 +10,7 @@ import { loadRepos } from '../lib/github';
 const { repos, usedFallback } = await loadRepos('tightknitai');
 
 if (usedFallback) {
-  console.warn('[index] using fallback repos — set GITHUB_TOKEN to fetch live data');
+  console.warn('[index] using fallback repos. Set GITHUB_TOKEN to fetch live data');
 }
 
 const itemListLd = {
@@ -47,7 +47,7 @@ const itemListLd = {
 <Layout jsonLd={[itemListLd]}>
   <Nav />
   <main>
-    <Hero repoCount={repos.length} />
+    <Hero />
     <RepoGrid repos={repos} />
     <Manifesto />
   </main>
diff --git a/src/pages/index.md.ts b/src/pages/index.md.ts
index 5234420..920ea11 100644
--- a/src/pages/index.md.ts
+++ b/src/pages/index.md.ts
@@ -1,17 +1,18 @@
 import type { APIRoute } from 'astro';
 import { formatRelativeTime, loadRepos, type Repo } from '../lib/github';
 
-const FEATURED_NAMES = ['block-kitchen', 'slack-block-kit-validator', 'slack-hono'];
+const FEATURED_NAMES = ['block-kitchen', 'slack-hono', 'slack-block-kit-validator'];
 
 function repoLine(repo: Repo): string {
   const meta = [
     repo.language,
-    repo.stars > 0 ? `★ ${repo.stars}` : null,
+    repo.license,
+    repo.stars >= 10 ? `★ ${repo.stars}` : null,
     `updated ${formatRelativeTime(repo.pushedAt)}`,
   ]
     .filter(Boolean)
     .join(' · ');
-  const desc = repo.description ? ` — ${repo.description}` : '';
+  const desc = repo.description ? `: ${repo.description}` : '';
   return `- [${repo.name}](${repo.url})${desc} _(${meta})_`;
 }
 
@@ -26,13 +27,13 @@ export const GET: APIRoute = async () => {
   const sections: string[] = [
     '# tightknit.dev',
     '',
-    `> Tools for Slack + agents. ${repos.length} open source repos, maintained in public.`,
+    '> Tools for Slack + agents. For teams building on Slack · open source.',
     '',
     'Open source libraries, agents, and developer tools shipped by [tightknit.ai](https://tightknit.ai). Built in TypeScript. Made to be forked.',
     '',
     '## The stack',
     '',
-    'Auto-synced from [github.com/tightknitai](https://github.com/tightknitai) at build time. Sorted by stars.',
+    'Block Kit tooling, app frameworks, and validators we use to ship Slack apps faster. Open sourced on [github.com/tightknitai](https://github.com/tightknitai).',
   ];
 
   if (featured.length > 0) {
@@ -47,11 +48,11 @@ export const GET: APIRoute = async () => {
     '',
     '## Principles',
     '',
-    "**01 — Made to be forked.** Every repo is MIT (or compatible). Lift it, mod it, ship it. The point is that you don't have to ask.",
+    "**01 · Made to be forked.** Every repo is MIT (or compatible). Lift it, mod it, ship it. The point is that you don't have to ask.",
     '',
-    '**02 — TypeScript first.** Strict mode on, types as docs, end-to-end inference where possible. Runtimes: Node, Bun, Cloudflare Workers.',
+    '**02 · TypeScript first.** Strict mode on, types as docs, end-to-end inference where possible. Runtimes: Node, Bun, Cloudflare Workers.',
     '',
-    '**03 — Built in public.** Roadmaps in GitHub issues, releases on a real changelog, and the maintainers actually read PRs.',
+    '**03 · From the Tightknit team.** Built by the team behind Tightknit, the #1 community platform on Slack. These are the libraries and patterns we reach for when shipping Slack apps, open sourced for yours.',
     '',
     '## Links',
     '',
diff --git a/src/styles/global.css b/src/styles/global.css
index 93577f3..8351f65 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -75,13 +75,13 @@
   .stacked-3d {
     color: var(--color-pink);
     text-shadow:
-      4px 4px 0 var(--color-ink),
-      8px 8px 0 var(--color-ink);
+      4px 4px 0 var(--color-yellow),
+      8px 8px 0 var(--color-cyan),
+      12px 12px 0 var(--color-ink);
   }
 
   .marquee {
     display: flex;
-    gap: 3rem;
     animation: marquee 30s linear infinite;
     white-space: nowrap;
     width: max-content;