Improve settings page accessibility (#25885)

src/components/ha-navigation-list.ts

@@ -44,7 +44,7 @@ class HaNavigationList extends LitElement {
               >
                 <ha-svg-icon .path=${page.iconPath}></ha-svg-icon>
               </div>
-              <span>${page.name}</span>
+              <span slot="headline">${page.name}</span>
               ${this.hasSecondary
                 ? html`<span slot="supporting-text">${page.description}</span>`
                 : ""}

src/panels/config/dashboard/ha-config-updates.ts

@@ -64,7 +64,7 @@ class HaConfigUpdates extends SubscribeMixin(LitElement) {
     const updates = this.updateEntities;
 
     return html`
-      <div class="title">
+      <div class="title" role="heading" aria-level="2">
         ${this.hass.localize("ui.panel.config.updates.title", {
           count: this.total || this.updateEntities.length,
         })}

src/panels/config/repairs/ha-config-repairs.ts

@@ -41,7 +41,7 @@ class HaConfigRepairs extends LitElement {
     const issues = this.repairsIssues;
 
     return html`
-      <div class="title">
+      <div class="title" role="heading" aria-level="2">
         ${this.hass.localize("ui.panel.config.repairs.title", {
           count: this.total || this.repairsIssues.length,
         })}