Fixed accessibility issues

author: Volpeon <git@volpeon.ink> 2021-12-22 10:58:07 +0100
committer: Volpeon <git@volpeon.ink> 2021-12-22 10:58:07 +0100
commit: d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c (patch)
tree: 67c8748c6abab02416404c6beccc068857fa6353
parent: Fixed contrast issues (diff)
download: volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.tar.gz
volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.tar.bz2
volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.zip
6 files changed, 13 insertions, 13 deletions
diff --git a/filters/icons.lua b/filters/icons.lua
index fb6a608..490d406 100644
--- a/filters/icons.lua
+++ b/filters/icons.lua
@@ -3,7 +3,7 @@ function Str(el)
    if icon then
        return pandoc.RawInline('html',
-            '<svg class="o-icon o-icon--inline" width="1em" height="1em"><use href="/symbols.svg#icon-' ..
+            '<svg class="o-icon o-icon--inline" width="1em" height="1em" aria-hidden="true"><use href="/symbols.svg#icon-' ..
                icon .. '"></use></svg>')
    end
diff --git a/templates/base.html b/templates/base.html
index 76a2cf3..353a2bd 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -49,7 +49,7 @@
 <body>
    <nav class="c-header">
        <a class="c-header__item c-header__item--icon" href="/" title="$site.title$">
-            <svg class="c-header__icon" width="1em" height="1em">
+            <svg class="c-header__icon" width="1em" height="1em" aria-label="Logo">
                <use href="/symbols.svg#logo"></use>
            </svg>
        </a>
@@ -77,9 +77,9 @@ ${layouts/page()}
    </main>
    <footer class="c-footer">
-        <div class="l-container l-container--pad-y u-pb0">
+        <div class="l-container l-container--pad-y u-pb0" aria-hidden="true">
-            <pre class="c-footer__ascii u-dn@sm-lo" aria-hidden="true">${partials/ascii_fox()}</pre>
+            <pre class="c-footer__ascii u-dn@sm-lo">${partials/ascii_fox()}</pre>
-            <pre class="c-footer__ascii u-dn@sm-hi" aria-hidden="true">${partials/ascii_fox_small()}</pre>
+            <pre class="c-footer__ascii u-dn@sm-hi">${partials/ascii_fox_small()}</pre>
        </div>
    </footer>
 </body>
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index e0bd1db..fd21017 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -27,7 +27,7 @@ $body$
                            <div class="c-card__block c-card__block--main">
                                $it.omitted$ more items
                            </div>
-                            <svg class="c-card__block o-icon" width="1em" height="1em">
+                            <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                                <use href="/symbols.svg#icon-arrow-right"></use>
                            </svg>
                        </div>
diff --git a/templates/partials/gallery_card.html b/templates/partials/gallery_card.html
index a2dbe5f..f3c85e8 100644
--- a/templates/partials/gallery_card.html
+++ b/templates/partials/gallery_card.html
@@ -3,7 +3,7 @@ $if(it.thumbnail)$
    <a href="$it.url.rel$" class="l-card-list__card c-card">
        <div class="c-card__row c-card__row--flush">
            <div class="c-card__thumbnail">
-                <img class="c-card__thumbnail-img" src="$it.thumbnail.rel$" />
+                <img class="c-card__thumbnail-img" src="$it.thumbnail.rel$" alt="Preview thumbnail of &quot;$it.title$&quot;" />
            </div>
        </div>
        <div class="c-card__row c-card__row--hidden">
@@ -11,7 +11,7 @@ $if(it.thumbnail)$
                <div class="c-card__block c-card__block--indicator"></div>
            $endif$
            $if(it.icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.icon$"></use>
                </svg>
            $endif$
@@ -37,7 +37,7 @@ $if(it.thumbnail)$
                $endif$
            </div>
            $if(it.post_icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.post_icon$"></use>
                </svg>
            $endif$
diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html
index 25cde52..1b7c000 100644
--- a/templates/partials/grid_card.html
+++ b/templates/partials/grid_card.html
@@ -5,7 +5,7 @@ $if(it.url)$
                <div class="c-card__block c-card__block--indicator"></div>
            $endif$
            $if(it.icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.icon$"></use>
                </svg>
            $endif$
@@ -31,7 +31,7 @@ $if(it.url)$
                $endif$
            </div>
            $if(it.post_icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.post_icon$"></use>
                </svg>
            $endif$
diff --git a/templates/partials/list_card.html b/templates/partials/list_card.html
index 8244cf5..ef52cf4 100644
--- a/templates/partials/list_card.html
+++ b/templates/partials/list_card.html
@@ -5,7 +5,7 @@ $if(it.url)$
                <div class="c-card__block c-card__block--indicator"></div>
            $endif$
            $if(it.icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.icon$"></use>
                </svg>
            $endif$
@@ -35,7 +35,7 @@ $if(it.url)$
                </time>
            $endif$
            $if(it.post_icon)$
-                <svg class="c-card__block o-icon" width="1em" height="1em">
+                <svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
                    <use href="/symbols.svg#icon-$it.post_icon$"></use>
                </svg>
            $endif$
author	Volpeon <git@volpeon.ink>	2021-12-22 10:58:07 +0100
committer	Volpeon <git@volpeon.ink>	2021-12-22 10:58:07 +0100
commit	d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c (patch)
tree	67c8748c6abab02416404c6beccc068857fa6353
parent	Fixed contrast issues (diff)
download	volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.tar.gz volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.tar.bz2 volpeon.ink-d76ce7ba079e335471bcd2d82bf7ed5dc430fa6c.zip

diff --git a/filters/icons.lua b/filters/icons.lua index fb6a608..490d406 100644 --- a/filters/icons.lua +++ b/filters/icons.lua
@@ -3,7 +3,7 @@ function Str(el)
3		3
4	if icon then	4	if icon then
5	return pandoc.RawInline('html',	5	return pandoc.RawInline('html',
6	'<svg class="o-icon o-icon--inline" width="1em" height="1em"><use href="/symbols.svg#icon-' ..	6	'<svg class="o-icon o-icon--inline" width="1em" height="1em" aria-hidden="true"><use href="/symbols.svg#icon-' ..
7	icon .. '"></use></svg>')	7	icon .. '"></use></svg>')
8	end	8	end
9		9


diff --git a/templates/base.html b/templates/base.html index 76a2cf3..353a2bd 100644 --- a/templates/base.html +++ b/templates/base.html
@@ -49,7 +49,7 @@
49	<body>	49	<body>
50	<nav class="c-header">	50	<nav class="c-header">
51	<a class="c-header__item c-header__item--icon" href="/" title="$site.title$">	51	<a class="c-header__item c-header__item--icon" href="/" title="$site.title$">
52	<svg class="c-header__icon" width="1em" height="1em">	52	<svg class="c-header__icon" width="1em" height="1em" aria-label="Logo">
53	<use href="/symbols.svg#logo"></use>	53	<use href="/symbols.svg#logo"></use>
54	</svg>	54	</svg>
55	</a>	55	</a>
@@ -77,9 +77,9 @@ ${layouts/page()}
77	</main>	77	</main>
78		78
79	<footer class="c-footer">	79	<footer class="c-footer">
80	<div class="l-container l-container--pad-y u-pb0">	80	<div class="l-container l-container--pad-y u-pb0" aria-hidden="true">
81	<pre class="c-footer__ascii u-dn@sm-lo" aria-hidden="true">${partials/ascii_fox()}</pre>	81	<pre class="c-footer__ascii u-dn@sm-lo">${partials/ascii_fox()}</pre>
82	<pre class="c-footer__ascii u-dn@sm-hi" aria-hidden="true">${partials/ascii_fox_small()}</pre>	82	<pre class="c-footer__ascii u-dn@sm-hi">${partials/ascii_fox_small()}</pre>
83	</div>	83	</div>
84	</footer>	84	</footer>
85	</body>	85	</body>


diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html index e0bd1db..fd21017 100644 --- a/templates/layouts/categorized_list.html +++ b/templates/layouts/categorized_list.html
@@ -27,7 +27,7 @@ $body$
27	<div class="c-card__block c-card__block--main">	27	<div class="c-card__block c-card__block--main">
28	$it.omitted$ more items	28	$it.omitted$ more items
29	</div>	29	</div>
30	<svg class="c-card__block o-icon" width="1em" height="1em">	30	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
31	<use href="/symbols.svg#icon-arrow-right"></use>	31	<use href="/symbols.svg#icon-arrow-right"></use>
32	</svg>	32	</svg>
33	</div>	33	</div>


diff --git a/templates/partials/gallery_card.html b/templates/partials/gallery_card.html index a2dbe5f..f3c85e8 100644 --- a/templates/partials/gallery_card.html +++ b/templates/partials/gallery_card.html
@@ -3,7 +3,7 @@ $if(it.thumbnail)$
3	<a href="$it.url.rel$" class="l-card-list__card c-card">	3	<a href="$it.url.rel$" class="l-card-list__card c-card">
4	<div class="c-card__row c-card__row--flush">	4	<div class="c-card__row c-card__row--flush">
5	<div class="c-card__thumbnail">	5	<div class="c-card__thumbnail">
6	<img class="c-card__thumbnail-img" src="$it.thumbnail.rel$" />	6	<img class="c-card__thumbnail-img" src="$it.thumbnail.rel$" alt="Preview thumbnail of "$it.title$"" />
7	</div>	7	</div>
8	</div>	8	</div>
9	<div class="c-card__row c-card__row--hidden">	9	<div class="c-card__row c-card__row--hidden">
@@ -11,7 +11,7 @@ $if(it.thumbnail)$
11	<div class="c-card__block c-card__block--indicator"></div>	11	<div class="c-card__block c-card__block--indicator"></div>
12	$endif$	12	$endif$
13	$if(it.icon)$	13	$if(it.icon)$
14	<svg class="c-card__block o-icon" width="1em" height="1em">	14	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
15	<use href="/symbols.svg#icon-$it.icon$"></use>	15	<use href="/symbols.svg#icon-$it.icon$"></use>
16	</svg>	16	</svg>
17	$endif$	17	$endif$
@@ -37,7 +37,7 @@ $if(it.thumbnail)$
37	$endif$	37	$endif$
38	</div>	38	</div>
39	$if(it.post_icon)$	39	$if(it.post_icon)$
40	<svg class="c-card__block o-icon" width="1em" height="1em">	40	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
41	<use href="/symbols.svg#icon-$it.post_icon$"></use>	41	<use href="/symbols.svg#icon-$it.post_icon$"></use>
42	</svg>	42	</svg>
43	$endif$	43	$endif$


diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html index 25cde52..1b7c000 100644 --- a/templates/partials/grid_card.html +++ b/templates/partials/grid_card.html
@@ -5,7 +5,7 @@ $if(it.url)$
5	<div class="c-card__block c-card__block--indicator"></div>	5	<div class="c-card__block c-card__block--indicator"></div>
6	$endif$	6	$endif$
7	$if(it.icon)$	7	$if(it.icon)$
8	<svg class="c-card__block o-icon" width="1em" height="1em">	8	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
9	<use href="/symbols.svg#icon-$it.icon$"></use>	9	<use href="/symbols.svg#icon-$it.icon$"></use>
10	</svg>	10	</svg>
11	$endif$	11	$endif$
@@ -31,7 +31,7 @@ $if(it.url)$
31	$endif$	31	$endif$
32	</div>	32	</div>
33	$if(it.post_icon)$	33	$if(it.post_icon)$
34	<svg class="c-card__block o-icon" width="1em" height="1em">	34	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
35	<use href="/symbols.svg#icon-$it.post_icon$"></use>	35	<use href="/symbols.svg#icon-$it.post_icon$"></use>
36	</svg>	36	</svg>
37	$endif$	37	$endif$


diff --git a/templates/partials/list_card.html b/templates/partials/list_card.html index 8244cf5..ef52cf4 100644 --- a/templates/partials/list_card.html +++ b/templates/partials/list_card.html
@@ -5,7 +5,7 @@ $if(it.url)$
5	<div class="c-card__block c-card__block--indicator"></div>	5	<div class="c-card__block c-card__block--indicator"></div>
6	$endif$	6	$endif$
7	$if(it.icon)$	7	$if(it.icon)$
8	<svg class="c-card__block o-icon" width="1em" height="1em">	8	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
9	<use href="/symbols.svg#icon-$it.icon$"></use>	9	<use href="/symbols.svg#icon-$it.icon$"></use>
10	</svg>	10	</svg>
11	$endif$	11	$endif$
@@ -35,7 +35,7 @@ $if(it.url)$
35	</time>	35	</time>
36	$endif$	36	$endif$
37	$if(it.post_icon)$	37	$if(it.post_icon)$
38	<svg class="c-card__block o-icon" width="1em" height="1em">	38	<svg class="c-card__block o-icon" width="1em" height="1em" aria-hidden="true">
39	<use href="/symbols.svg#icon-$it.post_icon$"></use>	39	<use href="/symbols.svg#icon-$it.post_icon$"></use>
40	</svg>	40	</svg>
41	$endif$	41	$endif$