Kaynağa Gözat

Add text to the link for screenreaders. (#713)

Also add a tooltip at the same time.
Simon Hollingshead 3 yıl önce
ebeveyn
işleme
688fc55123

+ 2 - 1
layouts/_default/_markup/render-heading.html

@@ -1,6 +1,7 @@
 <h{{ .Level }} id="{{ .Anchor | safeURL }}">
   {{ .Text | safeHTML }}
   <a class="heading-link" href="#{{ .Anchor | safeURL }}">
-    <i class="fa fa-link" aria-hidden="true"></i>
+    <i class="fa fa-link" aria-hidden="true" title="{{ i18n "link_to_heading" | default "Link to heading" }}"></i>
+    <span class="sr-only">{{ i18n "link_to_heading" | default "Link to heading" }}</span>
   </a>
 </h{{ .Level }}>

+ 2 - 1
layouts/partials/posts/series.html

@@ -8,7 +8,8 @@
       <h3 id="{{ i18n "see_also" | default "See also in" | anchorize }}-{{ anchorize . | safeURL }}">
         {{ i18n "see_also" | default "See also in" }} {{ . }}
         <a class="heading-link" href="#{{ i18n "see_also" | default "See also in" | anchorize }}-{{ anchorize . | safeURL }}">
-          <i class="fa fa-link" aria-hidden="true"></i>
+          <i class="fa fa-link" aria-hidden="true" title="{{ i18n "link_to_heading" | default "Link to heading" }}"></i>
+          <span class="sr-only">{{ i18n "link_to_heading" | default "Link to heading" }}</span>
         </a>
       </h3>
       <nav>