From 6e7c93ab2635107da79ebc3bbffe94c800d054b8 Mon Sep 17 00:00:00 2001
From: Michael Reinhard <mreinhard@google.com>
Date: Tue, 22 Oct 2024 17:21:12 -0700
Subject: [PATCH] fix: remove header/heading semantics from Store Locator for
 a11y

PiperOrigin-RevId: 688746007
---
 src/store_locator/store_locator.ts        | 12 ++++++------
 src/store_locator/store_locator_styles.ts | 10 +++++-----
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/store_locator/store_locator.ts b/src/store_locator/store_locator.ts
index 22a3204..4e227cb 100644
--- a/src/store_locator/store_locator.ts
+++ b/src/store_locator/store_locator.ts
@@ -415,9 +415,9 @@ export class StoreLocator extends BaseComponent {
             .place=${listing.placeResult}>
           <div class="result-item">
             <button class="select-location" @click=${selectButtonClick}>
-              <h2 class="name">
+              <div class="name">
                 <gmpx-place-field-text field="displayName"></gmpx-place-field-text>
-              </h2>
+              </div>
             </button>
             <div class="address">
               ${join(listing.addressLines ?? [], html`<br>`)}
@@ -465,16 +465,16 @@ export class StoreLocator extends BaseComponent {
     const header = this.featureSet === FeatureSet.BASIC ?
         nothing :
         html`
-        <header>
-          <h1 class="search-title">
+        <div class="header">
+          <div class="search-title">
             <span class="icon material-symbols-outlined">distance</span>
             ${this.getMsg('LOCATOR_LIST_HEADER')}
-          </h1>
+          </div>
           <gmpx-place-picker for-map="main-map" type="geocode"
               .placeholder=${this.getMsg('LOCATOR_SEARCH_PROMPT')}
               @gmpx-placechange=${this.updateSearchLocation}>
           </gmpx-place-picker>
-        </header>
+        </div>
     `;
 
     return html`
diff --git a/src/store_locator/store_locator_styles.ts b/src/store_locator/store_locator_styles.ts
index df5ec96..fd19e87 100644
--- a/src/store_locator/store_locator_styles.ts
+++ b/src/store_locator/store_locator_styles.ts
@@ -54,18 +54,18 @@ export const storeLocatorStyles = css`
     padding: 0.5em;
   }
 
-  #locations-panel-list > header {
+  #locations-panel-list > .header {
     padding: 1.4em 1.4em 0 1.4em;
   }
 
-  #locations-panel-list h1.search-title {
+  #locations-panel-list .search-title {
     align-items: center;
     display: flex;
     font: ${GMPX_FONT_TITLE_LARGE};
     margin: 0;
   }
 
-  #locations-panel-list h1.search-title .icon {
+  #locations-panel-list .search-title .icon {
     font-size: 150%;
     margin-right: 0.2em;
   }
@@ -101,7 +101,7 @@ export const storeLocatorStyles = css`
     outline-offset: -2px;
   }
 
-  #location-results-list h2 {
+  #location-results-list .name {
     font: ${GMPX_FONT_TITLE_LARGE};
     margin: 0 0 0.6em 0;
   }
@@ -162,4 +162,4 @@ export const storeLocatorStyles = css`
     fill: #3367D6;
     fill-opacity: 50%;
   }
-`;
\ No newline at end of file
+`;