From daf50446a43d95bbe7ab83f188f4ecab02258033 Mon Sep 17 00:00:00 2001
From: Scott Anderson <scott@influxdata.com>
Date: Thu, 29 May 2025 12:00:17 -0600
Subject: [PATCH] clean up homepage state tags

---
 assets/styles/layouts/_homepage.scss | 16 ++++------------
 layouts/index.html                   | 12 ++++++------
 2 files changed, 10 insertions(+), 18 deletions(-)

diff --git a/assets/styles/layouts/_homepage.scss b/assets/styles/layouts/_homepage.scss
index 5389f6b08..ca92588e9 100644
--- a/assets/styles/layouts/_homepage.scss
+++ b/assets/styles/layouts/_homepage.scss
@@ -118,10 +118,10 @@
           line-height: 1.5rem;
           color: rgba($article-text, .7);
         }
-      }
 
-      &[state] {
-        .product-info h3::after {
+        h3[state] {
+          &::after {
+          content: attr(state);
           margin-left: .5rem;
           font-size: 1rem;
           padding: .25em .5em .25em .4em;
@@ -131,16 +131,8 @@
           font-style: italic;
           vertical-align: middle;
         }
-      }
 
-      &[state="new"] {
-        .product-info h3::after { content: "New"; }
-      }
-      &[state="beta"] {
-        .product-info h3::after { content: "beta";}
-      }
-      &[state="alpha"] {
-        .product-info h3::after { content: "alpha";}
+        }
       }
 
       ul.product-links {
diff --git a/layouts/index.html b/layouts/index.html
index 436019298..b04b66e5c 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -45,9 +45,9 @@
             <h4>Self-managed</h4>
           </div>
           <div class="products">
-            <div class="product" state="new">
+            <div class="product">
               <div class="product-info">
-                <h3><a href="/influxdb3/core/">InfluxDB 3 Core</a></h3>
+                <h3 state="New"><a href="/influxdb3/core/">InfluxDB 3 Core</a></h3>
                 <p>The open source recent data engine optimized for time series and event data.</p>
               </div>
               <ul class="product-links">
@@ -55,9 +55,9 @@
                 <li><a href="/influxdb3/core/">View documentation</a></li>
               </ul>
             </div>
-            <div class="product" state="new">
+            <div class="product" >
               <div class="product-info">
-                <h3><a href="/influxdb3/enterprise/">InfluxDB 3 Enterprise</a></h3>
+                <h3 state="New"><a href="/influxdb3/enterprise/">InfluxDB 3 Enterprise</a></h3>
                 <p>The scalable data engine built for recent and historical time series and event data.</p>
               </div>
               <ul class="product-links">
@@ -109,9 +109,9 @@
             <h4>Tools</h4>
           </div>
           <div class="products">
-            <div class="product" state="beta">
+            <div class="product">
               <div class="product-info">
-                <h3><a href="/influxdb3/explorer/">InfluxDB 3 Explorer</a></h3>
+                <h3 state="beta"><a href="/influxdb3/explorer/">InfluxDB 3 Explorer</a></h3>
                 <p>A standalone UI designed for visualizing, querying, and managing data in InfluxDB 3 Core and Enterprise.</p>
               </div>
               <ul class="product-links">