From f2a90746aba380c3cd5289eddaa649a63ccccbf1 Mon Sep 17 00:00:00 2001
From: Joshua Laymon <joshlaymon@icloud.com>
Date: Wed, 20 Aug 2025 03:01:58 +0000
Subject: [PATCH] Update web/templates/stats.html

---
 web/templates/stats.html | 29 ++++++++++++++---------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/web/templates/stats.html b/web/templates/stats.html
index 66546c3..c66b3c3 100644
--- a/web/templates/stats.html
+++ b/web/templates/stats.html
@@ -36,22 +36,26 @@
     </div>
   </div>
 
-  <!-- Tag Cloud (replaces Top Subjects) -->
+  <!-- Subject Cloud (no pills) -->
   <div class="card" style="padding:16px; margin-bottom:16px;">
     <div class="meta-label">Subject Cloud</div>
 
     {% if top_subjects %}
-      {# max count is the first item because list is sorted desc in the view #}
       {% with maxc=top_subjects.0.count|default:1 %}
       <div class="tag-cloud" aria-label="Subject Tag Cloud">
         {% for s in top_subjects %}
-          {# font-size from 14px up to 32px based on weight #}
           <a
             class="tag"
             href="{% url 'search' %}?q={{ s.name|urlencode }}&subject=on"
             title="{{ s.name }} ({{ s.count }})"
-            style="font-size: calc(14px + ({{ s.count }} / {{ maxc }}) * 18px);
-                   opacity: calc(.6 + ({{ s.count }} / {{ maxc }}) * .4);"
+            style="
+              /* Size: 12px → 40px */
+              font-size: calc(12px + ({{ s.count }} / {{ maxc }}) * 28px);
+              /* Weight: 350 → 800 */
+              font-weight: calc(350 + ({{ s.count }} / {{ maxc }}) * 450);
+              /* Color: darker as frequency rises */
+              color: rgba(31, 41, 55, calc(.45 + ({{ s.count }} / {{ maxc }}) * .55));
+            "
           >
             {{ s.name }}
           </a>
@@ -105,25 +109,20 @@
   .tag-cloud{
     display:flex;
     flex-wrap:wrap;
-    gap:10px 14px;
+    gap:12px 18px;
     margin-top:10px;
     align-items:flex-end;
   }
   .tag{
     line-height:1.1;
-    padding:6px 10px;
-    border-radius:12px;
     text-decoration:none;
-    color:#0f172a;
-    background:#eef5fc;
-    border:1px solid #d7e6f7;
-    transition: transform .1s ease, background .12s ease, border-color .12s ease;
     white-space:nowrap;
+    transition: transform .12s ease, text-decoration-color .12s ease, color .12s ease;
+    text-underline-offset: 3px;
   }
   .tag:hover{
-    transform: translateY(-1px);
-    background:#e2effc;
-    border-color:#c9def5;
+    transform: translateY(-2px);
+    text-decoration: underline;
   }
 </style>
 {% endblock %}
\ No newline at end of file