From ee5947db38d56932f6164d45b32e18ca829f4c8f Mon Sep 17 00:00:00 2001
From: Shuaib Hasan Akib <akibh805@gmail.com>
Date: Sat, 15 Nov 2025 11:11:35 +0600
Subject: [PATCH] docs: improve accessibility with descriptive link and main
 landmark - Replaced <a><button></button></a> with a proper <a> containing
 text and   aria-label to ensure links have discernible text.

- Added main tag in home page to provide
  a consistent main landmark, improving accessibility for screen readers
  and satisfying WCAG and Lighthouse requirements.

Fixes #65181.
---
 .../cookie-popup/cookie-popup.component.html  | 38 +++++++++++--------
 .../src/app/features/home/home.component.html |  4 +-
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/adev/shared-docs/components/cookie-popup/cookie-popup.component.html b/adev/shared-docs/components/cookie-popup/cookie-popup.component.html
index becf5b6b422..684eee09d32 100644
--- a/adev/shared-docs/components/cookie-popup/cookie-popup.component.html
+++ b/adev/shared-docs/components/cookie-popup/cookie-popup.component.html
@@ -1,22 +1,28 @@
 @if (!hasAccepted()) {
-<div class="docs-cookies-popup docs-invert-mode">
-  <p>This site uses cookies from Google to deliver its services and to analyze traffic.</p>
+  <div class="docs-cookies-popup docs-invert-mode">
+    <p>This site uses cookies from Google to deliver its services and to analyze traffic.</p>
 
-  <div>
-    <a href="https://policies.google.com/technologies/cookies" target="_blank" rel="noopener">
-      <button type="button" class="docs-primary-btn" [attr.text]="'Learn more'" aria-label="Learn More">
+    <div>
+      <a
+        href="https://policies.google.com/technologies/cookies"
+        target="_blank"
+        rel="noopener"
+        class="docs-primary-btn"
+        aria-label="Learn more about how Google uses cookies"
+        text="Learn more"
+      >
         Learn more
+      </a>
+
+      <button
+        type="button"
+        (click)="accept()"
+        class="docs-primary-btn"
+        text="Ok, Got it"
+        aria-label="Ok, Got it"
+      >
+        Ok, Got it
       </button>
-    </a>
-    <button
-      type="button"
-      (click)="accept()"
-      class="docs-primary-btn"
-      [attr.text]="'Ok, Got it'"
-      aria-label="Ok, Got it"
-    >
-      Ok, Got it
-    </button>
+    </div>
   </div>
-</div>
 }
diff --git a/adev/src/app/features/home/home.component.html b/adev/src/app/features/home/home.component.html
index 93c5b9502a0..d0c7c0e1455 100644
--- a/adev/src/app/features/home/home.component.html
+++ b/adev/src/app/features/home/home.component.html
@@ -1,4 +1,4 @@
-<div class="adev-home" #home>
+<main class="adev-home" #home>
   <div class="banners-layer layer">
     <div class="adev-banner-container">
       <a
@@ -490,4 +490,4 @@
       </div>
     </div>
   </section>
-</div>
+</main>