From bd463527050bc9eaa23de859f822e82eb5e73735 Mon Sep 17 00:00:00 2001
From: teknium1 <127238744+teknium1@users.noreply.github.com>
Date: Wed, 16 Sep 2026 12:55:59 -0700
Subject: [PATCH] feat: catalog card image slot is 2:1; version pill reads as a
 pill

repo social banners are 2:1, so that shape fills the slot without a crop;
the recommended size is in the README/docs. Desktop AgentPluginRow gains
catalog_version to match the generated contract.
---
 apps/desktop/src/app/skills/catalog-browser.tsx    |  2 +-
 apps/desktop/src/store/agent-plugins.ts            |  2 ++
 plugin-catalog/README.md                           |  2 +-
 website/docs/user-guide/features/plugin-catalog.md |  2 +-
 website/src/pages/plugins/styles.module.css        | 10 ++++++----
 5 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/apps/desktop/src/app/skills/catalog-browser.tsx b/apps/desktop/src/app/skills/catalog-browser.tsx
index d93cb21bf2..1f7762bf31 100644
--- a/apps/desktop/src/app/skills/catalog-browser.tsx
+++ b/apps/desktop/src/app/skills/catalog-browser.tsx
@@ -149,7 +149,7 @@ export const CatalogBrowser = memo(function CatalogBrowser({
         {selected.imageUrl && (
           <img
             alt=""
-            className="block aspect-[16/7] w-full rounded-md border border-(--ui-border) object-cover"
+            className="block aspect-[2/1] w-full rounded-md border border-(--ui-border) object-cover"
             decoding="async"
             loading="lazy"
             onError={e => { e.currentTarget.style.display = 'none' }}
diff --git a/apps/desktop/src/store/agent-plugins.ts b/apps/desktop/src/store/agent-plugins.ts
index 98ec9855e1..60e73de860 100644
--- a/apps/desktop/src/store/agent-plugins.ts
+++ b/apps/desktop/src/store/agent-plugins.ts
@@ -32,6 +32,8 @@ export interface AgentPluginRow {
   installed_sha?: string
   /** Current catalog pin for this entry (backend-computed). */
   catalog_sha?: string
+  /** Human label the catalog attaches to that pin ("1.4.0"); shown on the Update button when present. */
+  catalog_version?: string | null
   /** Installed SHA differs from the catalog pin — an update is available. */
   update_available?: boolean
   /** Full commit SHA a `--ref` install is pinned to (custom sources; refuses `update`). */
diff --git a/plugin-catalog/README.md b/plugin-catalog/README.md
index 11ed4ee89d..02b6ebed36 100644
--- a/plugin-catalog/README.md
+++ b/plugin-catalog/README.md
@@ -55,7 +55,7 @@ category: memory            # desktop | memory | platform | web | tools | voice
 requires_hermes: ">=0.19"   # optional
 docs_url: ""                # optional
 version: "1.4.0"            # optional human label for the sha (quote it); shown as "1.4.0 @ abcd1234"
-image: ""                   # optional https image on a GitHub host, e.g.
+image: ""                   # optional https image on a GitHub host, 2:1 (e.g. 1200x600), e.g.
                             # https://raw.githubusercontent.com/owner/repo/<sha>/docs/banner.png
 platforms: []               # optional, e.g. [linux, macos]; empty = all
 capabilities:
diff --git a/website/docs/user-guide/features/plugin-catalog.md b/website/docs/user-guide/features/plugin-catalog.md
index cd2b424dd4..6c6a850d3a 100644
--- a/website/docs/user-guide/features/plugin-catalog.md
+++ b/website/docs/user-guide/features/plugin-catalog.md
@@ -66,7 +66,7 @@ directory of the hermes-agent repository, declaring:
 | `platforms` | OS restrictions, empty = all (optional) |
 | `docs_url` | External documentation link (optional) |
 | `version` | Human-readable label for the pinned sha, e.g. `"1.4.0"`; shown as `1.4.0 @ abcd1234` in the CLI, on the catalog card and on the Desktop **Update to** button (optional, cosmetic) |
-| `image` | Banner image for the catalog card; an `https` URL on `raw.githubusercontent.com`, `github.com` or `*.githubusercontent.com` (optional). Pin it to the entry's commit (`raw.githubusercontent.com/owner/repo/<sha>/...`) so it never changes under the review |
+| `image` | Banner image for the catalog card, shown at 2:1 (1200×600 works; other shapes are centre-cropped); an `https` URL on `raw.githubusercontent.com`, `github.com` or `*.githubusercontent.com` (optional). Pin it to the entry's commit (`raw.githubusercontent.com/owner/repo/<sha>/...`) so it never changes under the review |
 
 ## Trust model
 
diff --git a/website/src/pages/plugins/styles.module.css b/website/src/pages/plugins/styles.module.css
index e94db2240a..25df654837 100644
--- a/website/src/pages/plugins/styles.module.css
+++ b/website/src/pages/plugins/styles.module.css
@@ -467,7 +467,7 @@
 .cardImage {
   display: block;
   width: 100%;
-  aspect-ratio: 16 / 7;
+  aspect-ratio: 2 / 1;
   object-fit: cover;
   border-bottom: 1px solid rgba(255, 255, 255, 0.06);
   background: rgba(255, 255, 255, 0.02);
@@ -528,10 +528,12 @@
 .versionPill {
   font-family: "JetBrains Mono", monospace;
   font-size: 0.62rem;
-  padding: 0.15rem 0.4rem;
+  font-weight: 600;
+  padding: 0.15rem 0.45rem;
   border-radius: 4px;
-  border: 1px solid rgba(255, 255, 255, 0.12);
-  color: var(--ifm-font-color-secondary);
+  border: 1px solid rgba(96, 165, 250, 0.45);
+  background: rgba(96, 165, 250, 0.12);
+  color: rgba(96, 165, 250, 0.95);
   white-space: nowrap;
   flex-shrink: 0;
   margin-top: 0.1rem;