From 2f67fb23462094f3883f935a7d2926e1d30c319d Mon Sep 17 00:00:00 2001
From: Lindsay Auchinachie <lindsay@moderne.io>
Date: Thu, 30 Apr 2026 21:43:15 -0400
Subject: [PATCH] Render markdown link-only lists as cards (recipe README
 pages)

Recipe README pages (e.g. Quarkus, Docker, Apache) use plain markdown
bulleted lists where each item is a link to a subcategory or recipe.
Style any such list (every li contains exactly one anchor) so each item
renders as a card matching DocCard styling.

Refs #492

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/css/custom.css | 34 ++++++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/src/css/custom.css b/src/css/custom.css
index 6a3b48ed13..9a02652fc7 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -436,3 +436,37 @@ html[data-theme='dark'] {
   margin: 0 calc(-1 * var(--ifm-pre-padding));
   padding: 0 calc(var(--ifm-pre-padding) - 3px) 0 var(--ifm-pre-padding);
 }
+
+/* Style markdown link-only lists as cards (recipe README pages) */
+.markdown ul:has(> li > a:only-child) {
+  list-style: none;
+  padding-left: 0;
+}
+
+.markdown ul:has(> li > a:only-child) > li {
+  margin: 0 0 0.5rem 0;
+  padding: 0;
+}
+
+.markdown ul:has(> li > a:only-child) > li::before {
+  content: none;
+}
+
+.markdown ul:has(> li > a:only-child) > li > a {
+  display: block;
+  padding: 0.75rem 1.25rem;
+  border: 1px solid var(--ifm-color-border);
+  border-radius: 8px;
+  background-color: #fff;
+  color: var(--ifm-heading-color);
+  font-weight: 600;
+  font-size: 1.0625rem;
+  text-decoration: none;
+  transition: background-color 0.15s ease, border-color 0.15s ease;
+}
+
+.markdown ul:has(> li > a:only-child) > li > a:hover {
+  background-color: #F3F4F6;
+  border-color: rgba(4, 24, 52, 0.2);
+  text-decoration: none;
+}