From 2a7aa701aa063ec4537073385750e03197bc5ba6 Mon Sep 17 00:00:00 2001
From: Leo McArdle <leo@mca.is>
Date: Fri, 10 Jan 2025 15:01:03 +0000
Subject: [PATCH] chore(baseline): change h2 in summary to div (#12433)

https://github.com/mdn/yari/issues/8849
---
 client/src/document/baseline-indicator.scss | 2 +-
 client/src/document/baseline-indicator.tsx  | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/src/document/baseline-indicator.scss b/client/src/document/baseline-indicator.scss
index ab5437609709..a73d3ba149de 100644
--- a/client/src/document/baseline-indicator.scss
+++ b/client/src/document/baseline-indicator.scss
@@ -75,7 +75,7 @@ $browsers: "chrome", "edge", "firefox", "safari";
       width: var(--width);
     }
 
-    h2 {
+    .status-title {
       font-size: 1rem;
       font-weight: 600;
       letter-spacing: 0;
diff --git a/client/src/document/baseline-indicator.tsx b/client/src/document/baseline-indicator.tsx
index fb507d9c1642..ab5bf0903d6a 100644
--- a/client/src/document/baseline-indicator.tsx
+++ b/client/src/document/baseline-indicator.tsx
@@ -116,7 +116,7 @@ export function BaselineIndicator({ status }: { status: SupportStatus }) {
           role="img"
           aria-label={level !== "not" ? "Baseline Check" : "Baseline Cross"}
         />
-        <h2>
+        <div className="status-title">
           {level !== "not" ? (
             <>
               Baseline{" "}
@@ -130,7 +130,7 @@ export function BaselineIndicator({ status }: { status: SupportStatus }) {
           ) : (
             <span className="not-bold">Limited availability</span>
           )}
-        </h2>
+        </div>
         {level === "low" && <div className="pill">Newly available</div>}
         <div className="browsers">
           {ENGINES.map(({ name, browsers }) => (