From b3f5d8943a09f8b4d6b30a50c4aae9145135ce64 Mon Sep 17 00:00:00 2001
From: Anton Staroverov <73071319+tonystar@users.noreply.github.com>
Date: Fri, 5 Jun 2026 12:33:25 -0600
Subject: [PATCH 1/2] Upgrade Pico CSS to newer Blades CSS

---
 src/pallets/templates/layout.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pallets/templates/layout.html b/src/pallets/templates/layout.html
index 19a9390..b42ba8c 100644
--- a/src/pallets/templates/layout.html
+++ b/src/pallets/templates/layout.html
@@ -6,7 +6,7 @@
   <title>Pallets</title>
   <link rel=icon href="/static/pallets-logo.svg">
   <link rel="alternate" type="application/atom+xml" title="Blog" href="{{ url_for(".blog_feed") }}">
-  <link rel=stylesheet href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
+  <link rel=stylesheet href="https://cdn.jsdelivr.net/npm/@anyblades/blades@2.3.1/css/blades.min.css">
   <link rel=stylesheet href="/static/style.css">
   {% block extra_head %}{% endblock %}
 </head>

From 28e23964bf8df50f10980c5fdd6e8f1d0dce0de0 Mon Sep 17 00:00:00 2001
From: Anton Staroverov <73071319+tonystar@users.noreply.github.com>
Date: Fri, 5 Jun 2026 13:04:13 -0600
Subject: [PATCH 2/2] style: update project grid layout to be responsive using
 modern auto-fill and minmax

---
 src/pallets/templates/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pallets/templates/index.html b/src/pallets/templates/index.html
index 8a67ed4..3637d2a 100644
--- a/src/pallets/templates/index.html
+++ b/src/pallets/templates/index.html
@@ -4,7 +4,7 @@
   <section>
     {{ page.content_html | safe }}
   </section>
-  <section style="display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--pico-spacing);">
+  <section style="display: grid; grid-template-columns: repeat(auto-fill, minmax(clamp(16ch, 21%, 100%), 1fr)); gap: var(--pico-spacing);">
     {% for title in ("Flask", "Quart", "Jinja", "Click", "Werkzeug", "ItsDangerous", "MarkupSafe") %}
       {% set name = title.lower() %}
       <p>