fix(a11y): cards subtitles

Co-authored-by: Andrea Stagi <stagi.andrea@gmail.com>
italia · Apr 27, 2023 · 8ebeac1 · 8ebeac1
1 parent 6b52afa
commit 8ebeac1
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 4 deletions.
diff --git a/api/componenti/card.json b/api/componenti/card.json
@@ -47,4 +47,4 @@
         "name": "Teaser",
         "content": "\n<div class=\"card-wrapper card-teaser-wrapper\">\n  <!--start card-->\n  <div class=\"card card-teaser\">\n    <div class=\"card-body\">\n      <h3 class=\"card-title h5\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\u2026</h3>\n      <p class=\"card-text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>\n    </div>\n  </div>\n  <!--end card-->\n  <!--start card-->\n  <div class=\"card card-teaser rounded shadow\">\n    <div class=\"card-body\">\n      <h3 class=\"card-title h5\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\u2026</h3>\n      <p class=\"card-text\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>\n    </div>\n  </div>\n  <!--end card-->\n  <!--start card-->\n  <div class=\"card card-teaser rounded shadow\">\n    <div class=\"card-body\">\n      <h3 class=\"card-title h5\">\n        <svg class=\"icon\">\n          <use href=\"/dist/svg/sprites.svg#it-clip\"></use>\n        </svg>\n        <a href=\"#\">Lorem ipsum dolor sit amet</a>\n      </h3>\n      <div class=\"card-text\">\n        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor\u2026</p>\n      </div>\n    </div>\n  </div>\n  <!--end card-->\n</div>\n"
     }
-]
+]
diff --git a/docs/componenti/card.md b/docs/componenti/card.md
@@ -170,8 +170,7 @@ presenti) e icona: la struttura è uguale alla card precedente, per l'intestazio
 elementi come da esempio.
 
 Nell'esempio seguente sono stati inseriti un sottotitolo ed un link semplice che
-segue il paragrafo. Per i sottotitoli utilizzare il tag `<h6>`, per i link
-semplici utilizzare la classe `.simple-link`.
+segue il paragrafo.
 
 {% comment %}Example name: Con icona, sottotitolo e link{% endcomment %}
 {% capture example %}
@@ -189,7 +188,7 @@ semplici utilizzare la classe `.simple-link`.
           </div>
           <a href="#">
             <h3 class="card-title h5 no_toc">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor…</h3>
-            <h6 class="card-subtitle">Sottotitolo</h6>
+            <p class="card-subtitle h6">Sottotitolo</p>
           </a>
           <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
           <a class="simple-link" href="#">Link <span class="visually-hidden">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor…</span></a>