Minor issues

assets/sass/_colors.sass

@@ -26,3 +26,4 @@ $surface: #1a1e29
 $border: #3a4054
 $text: #ffffff
 $text-subtle: #bfc9e6
+$text-grey: #80869a

assets/sass/_taxonomy.sass

@@ -73,6 +73,12 @@ table#taxonomy-table
         text-decoration: none
         &:hover, &:focus
             color: $accent
+    
+a.not-maintained, span.not-maintained
+    color: $text-grey !important
+    font-style: italic
+    opacity: 0.7&:hover, &:focus
+        color: $text-subtle
 
 #taxonomy-page a.term-link
     padding: 0.3rem 1.2rem

layouts/home.html

@@ -14,7 +14,7 @@
   <!-- <section> -->
     <!-- </section> -->
     
-    {{ $pages := shuffle (where site.RegularPages "Section" "tools") | first 20 }}
+    {{ $pages := shuffle (where (where site.RegularPages "Section" "tools") "Params.maintenance" "intersect" (slice "Actively Maintained")) | first 20 }}
     <section>
       <h2>Try Something New</h2>
       <p><strong>Proudly featuring {{ len (where site.RegularPages "Section" "tools") }} tools and counting!</strong>

layouts/tools/section.html

@@ -54,8 +54,8 @@
             {{ if .Params.maintenance }}
               {{ if in .Params.maintenance "Not Maintained" }}
                 <div style="display: flex; align-items: center; gap: 8px;">
-                  <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
+                  <a href="{{ .RelPermalink }}" class="not-maintained">{{ .LinkTitle }}</a>
-                  <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span>
+                  <!-- <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span> -->
                 </div>
               {{ else }}
                 <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
@@ -108,8 +108,8 @@
   </table>
 
   <div style="display: flex; align-items: center; gap: 8px; margin: 1rem 0 0 0;">
-    <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span>
+    <!-- <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(128, 28, 28);"></span> -->
-    <span style="color: rgb(128, 28, 28); font-size: 1rem;">Red dot indicates tool has not been updated or maintained recently</span>
+    <span class="not-maintained">Grey text indicates tool has not been updated or maintained recently</span>
   </div>
   <!-- <div style="display: flex; align-items: center; gap: 8px; margin: 0;">
     <span style="display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgb(143, 96, 15);"></span>