From cee721b151e16e3d845c4d179da55d45880f5a42 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Wed, 31 Aug 2022 10:03:02 +0300
Subject: [PATCH] Fixed #2904 - Improve Card implementation for Accessibility

---
 src/views/card/CardDoc.vue | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/views/card/CardDoc.vue b/src/views/card/CardDoc.vue
index fe41371b3..c85de73b9 100755
--- a/src/views/card/CardDoc.vue
+++ b/src/views/card/CardDoc.vue
@@ -104,6 +104,25 @@ import Card from 'primevue/card';
 			</table>
 		</div>
 
+        <h5>Accessibility</h5>
+    <DevelopmentSection>
+        <h6>Screen Reader</h6>
+        <p>A card can be utilized in many use cases as a result no role is enforced, in fact a role may not be necessary if the card is used for presentational purposes only.
+            Any valid attribute is passed to the container element so if you require to use one of the <a href="https://www.w3.org/TR/wai-aria/#landmark" alt="Landmark Roles">landmark</a> roles
+            like <i>region</i>, you may use the <i>role</i> property.
+        </p>
+
+<pre v-code><code>
+&lt;Card role="region"&gt;
+    Content
+&lt;/Card&gt;
+
+</code></pre>
+
+        <h5>Keyboard Support</h5>
+        <p>Component does not include any interactive elements.</p>
+    </DevelopmentSection>
+
 		<h5>Dependencies</h5>
 		<p>None.</p>
     </AppDoc>