From 12d2e2e3f10719b983005e7ce8fa8f931026ae5c Mon Sep 17 00:00:00 2001
From: hamed <15238-genius.ha@users.noreply.drupalcode.org>
Date: Sun, 21 Jun 2026 17:47:23 +0330
Subject: [PATCH] fix(logo): add aria-labels and improve accessibility features
 in Logo component fix(progress): enhance accessibility by adding aria-label
 to LinearProgress component fix(share): add aria-label for better
 accessibility in Share button fix(title): change h3 to h2 for semantic
 correctness and add aria-labels for links fix(qrimg): add alt text for QR
 code image for improved accessibility fix(buttonmenu): add aria-label for
 mobile menu button to enhance accessibility

---
 app/component/Logo.js                           | 16 ++++++++++++----
 app/component/ProfressDetail.js                 |  1 +
 components/doctor/detailDoctor/Share.js         |  1 +
 components/doctor/detailDoctor/Title.js         |  5 +++--
 components/doctor/poster/QrImg.js               |  2 +-
 components/layout/header/list/col/ButtonMenu.js |  1 +
 6 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/app/component/Logo.js b/app/component/Logo.js
index 9928a04..7817d3d 100644
--- a/app/component/Logo.js
+++ b/app/component/Logo.js
@@ -3,19 +3,27 @@ import Link from "next/link";
 import React from "react";
 
 function Logo({ isAbsolute, matchedCity }) {
+  const siteName =
+    matchedCity?.site_name ||
+    (matchedCity?.name ? `${matchedCity.name} نوبت` : "نوبت ۷۲۴");
   return (
-    <Link href="/" className={isAbsolute ? "absolute right-[32px] top-0" : ""}>
+    <Link
+      href="/"
+      aria-label={isAbsolute ? undefined : siteName}
+      aria-hidden={isAbsolute ? true : undefined}
+      tabIndex={isAbsolute ? -1 : undefined}
+      className={isAbsolute ? "absolute right-[32px] top-0" : ""}
+    >
       <div className="flex items-center justify-start gap-[5px]">
         <Image
           className="w-[20px] h-[20px] sm:w-[23px] sm:h-[23px] md:w-[26px] md:h-[26px] lg:w-[30px] lg:h-[30px]"
           src="/assets/images/logo.png"
           width={30}
           height={30}
-          alt="logo"
+          alt=""
         />
         <p className="text-[#526CAC] text-[14px] lg:text-[16px] font-bold">
-          {matchedCity?.site_name ||
-            (matchedCity?.name ? `${matchedCity.name} نوبت` : "نوبت ۷۲۴")}
+          {siteName}
         </p>
       </div>
     </Link>
diff --git a/app/component/ProfressDetail.js b/app/component/ProfressDetail.js
index 0e0a5d5..7955681 100644
--- a/app/component/ProfressDetail.js
+++ b/app/component/ProfressDetail.js
@@ -21,6 +21,7 @@ function ProgressDetail({ data, idx }) {
       <LinearProgress
         value={progress || 0}
         variant="determinate"
+        aria-label={label}
         className="!w-full lg:!w-[265px] !rounded-[10px] !bg-[#D7D7D7] !h-[11px]"
         sx={{
           "& .MuiLinearProgress-bar": {
diff --git a/components/doctor/detailDoctor/Share.js b/components/doctor/detailDoctor/Share.js
index 284550b..5d424ea 100644
--- a/components/doctor/detailDoctor/Share.js
+++ b/components/doctor/detailDoctor/Share.js
@@ -20,6 +20,7 @@ function Share({ data }) {
       <Button
         className="!gap-1 !border-none lg:!border-[#EFEFEF] !p-2 !rounded-lg !text-[#525252] !text-[14px]"
         onClick={handleOpen}
+        aria-label="اشتراک گذاری"
         variant="outlined"
       >
         <ShareDI />
diff --git a/components/doctor/detailDoctor/Title.js b/components/doctor/detailDoctor/Title.js
index 1c4267b..70c6d45 100644
--- a/components/doctor/detailDoctor/Title.js
+++ b/components/doctor/detailDoctor/Title.js
@@ -39,13 +39,13 @@ function Title({ doctor }) {
           </h1>
         </TextLoading>
         <TextLoading width={100} height={20}>
-          <h3 className="text-[#525252] text-[14px] md:text-[16px] font-medium">
+          <h2 className="text-[#525252] text-[14px] md:text-[16px] font-medium">
             تخصص:
             {doctor?.specialties?.map(
               (item, idx) =>
                 `${item.name} ${doctor.specialties.length === idx + 1 ? "" : "|"} `
             )}
-          </h3>
+          </h2>
         </TextLoading>
         <div className="flex items-center justify-start gap-11">
           <TextLoading width={60} height={20}>
@@ -92,6 +92,7 @@ function Title({ doctor }) {
                   href={url}
                   target="_blank"
                   rel="noopener noreferrer"
+                  aria-label={key}
                   className="flex items-center justify-center p-1.5 rounded-full bg-[#F8F8FF]"
                 >
                   <Icon />
diff --git a/components/doctor/poster/QrImg.js b/components/doctor/poster/QrImg.js
index 5e30d61..57a5b94 100644
--- a/components/doctor/poster/QrImg.js
+++ b/components/doctor/poster/QrImg.js
@@ -21,7 +21,7 @@ export default function QrImg() {
   return (
     <div className="flex items-center flex-col justify-center mt-[100%]">
       {qrCodeData ? (
-        <img src={qrCodeData} width={167} height={167} />
+        <img src={qrCodeData} width={167} height={167} alt="کد QR پروفایل پزشک" />
       ) : (
         <p>در حال بارگذاری...</p>
       )}
diff --git a/components/layout/header/list/col/ButtonMenu.js b/components/layout/header/list/col/ButtonMenu.js
index 3ee939d..a8f997c 100644
--- a/components/layout/header/list/col/ButtonMenu.js
+++ b/components/layout/header/list/col/ButtonMenu.js
@@ -4,6 +4,7 @@ function ButtonMenu({ isActive, setIsActive }) {
   return (
     <Button
       onClick={() => setIsActive(!isActive)}
+      aria-label="منوی موبایل"
       className="!py-[6px] !px-[2px] !flex !p-0.5 !w-[24px] !h-[24px] !flex-col !justify-between !items-center"
     >
       <span