diff options
author | Luce Carević <lcarevic@access42.net> | 2019-07-13 18:56:43 +0200 |
---|---|---|
committer | Luce Carević <lcarevic@access42.net> | 2019-07-13 18:56:43 +0200 |
commit | d1bcf28db3704b75200c03be728dddcaf725ca51 (patch) | |
tree | c67c0619efe783c620181978e31142a3490b71dd /tpl/default/linklist.html | |
parent | 719ef8e896d4bd28d8d56baafbbe25b8e4e58636 (diff) | |
download | Shaarli-d1bcf28db3704b75200c03be728dddcaf725ca51.tar.gz Shaarli-d1bcf28db3704b75200c03be728dddcaf725ca51.tar.zst Shaarli-d1bcf28db3704b75200c03be728dddcaf725ca51.zip |
fix a11y
Diffstat (limited to 'tpl/default/linklist.html')
-rw-r--r-- | tpl/default/linklist.html | 24 |
1 files changed, 11 insertions, 13 deletions
diff --git a/tpl/default/linklist.html b/tpl/default/linklist.html index a025d53c..b44d0783 100644 --- a/tpl/default/linklist.html +++ b/tpl/default/linklist.html | |||
@@ -19,19 +19,19 @@ | |||
19 | <div id="search-linklist" class="searchform-block search-linklist"> | 19 | <div id="search-linklist" class="searchform-block search-linklist"> |
20 | 20 | ||
21 | <form method="GET" class="pure-form searchform" name="searchform"> | 21 | <form method="GET" class="pure-form searchform" name="searchform"> |
22 | <input type="text" tabindex="1" name="searchterm" class="searchterm" placeholder="{'Search text'|t}" | 22 | <input type="text" name="searchterm" class="searchterm" aria-label="{'Search text'|t}" placeholder="{'Search text'|t}" |
23 | {if="!empty($search_term)"} | 23 | {if="!empty($search_term)"} |
24 | value="{$search_term}" | 24 | value="{$search_term}" |
25 | {/if} | 25 | {/if} |
26 | > | 26 | > |
27 | <input type="text" tabindex="2" name="searchtags" class="searchtags" placeholder="{'Filter by tag'|t}" | 27 | <input type="text" name="searchtags" class="searchtags" aria-label="{'Filter by tag'|t}" placeholder="{'Filter by tag'|t}" |
28 | {if="!empty($search_tags)"} | 28 | {if="!empty($search_tags)"} |
29 | value="{$search_tags}" | 29 | value="{$search_tags}" |
30 | {/if} | 30 | {/if} |
31 | autocomplete="off" data-multiple data-autofirst data-minChars="1" | 31 | autocomplete="off" data-multiple data-autofirst data-minChars="1" |
32 | data-list="{loop="$tags"}{$key}, {/loop}" | 32 | data-list="{loop="$tags"}{$key}, {/loop}" |
33 | > | 33 | > |
34 | <button type="submit" class="search-button"><i class="fa fa-search"></i></button> | 34 | <button type="submit" class="search-button" aria-label="{'Search'|t}"><i class="fa fa-search" aria-hidden="true"></i></button> |
35 | </form> | 35 | </form> |
36 | </div> | 36 | </div> |
37 | 37 | ||
@@ -94,7 +94,7 @@ | |||
94 | {'tagged'|t} | 94 | {'tagged'|t} |
95 | {loop="$exploded_tags"} | 95 | {loop="$exploded_tags"} |
96 | <span class="label label-tag" title="{'Remove tag'|t}"> | 96 | <span class="label label-tag" title="{'Remove tag'|t}"> |
97 | <a href="?removetag={function="urlencode($value)"}">{$value}<span class="remove"><i class="fa fa-times" aria-hidden="true"></i></span></a> | 97 | <a href="?removetag={function="urlencode($value)"}" aria-label="{'Remove tag'|t}">{$value}<span class="remove"><i class="fa fa-times" aria-hidden="true"></i></span></a> |
98 | </span> | 98 | </span> |
99 | {/loop} | 99 | {/loop} |
100 | {/if} | 100 | {/if} |
@@ -136,12 +136,10 @@ | |||
136 | {if="$thumbnails_enabled && !empty($value.thumbnail)"} | 136 | {if="$thumbnails_enabled && !empty($value.thumbnail)"} |
137 | <div class="linklist-item-thumbnail" style="width:{$thumbnails_width}px;height:{$thumbnails_height}px;"> | 137 | <div class="linklist-item-thumbnail" style="width:{$thumbnails_width}px;height:{$thumbnails_height}px;"> |
138 | <div class="thumbnail"> | 138 | <div class="thumbnail"> |
139 | <a href="{$value.real_url}"> | ||
140 | {ignore}RainTPL hack: put the 2 src on two different line to avoid path replace bug{/ignore} | 139 | {ignore}RainTPL hack: put the 2 src on two different line to avoid path replace bug{/ignore} |
141 | <img data-src="{$value.thumbnail}#" class="b-lazy" | 140 | <img data-src="{$value.thumbnail}#" class="b-lazy" |
142 | src="" | 141 | src="" |
143 | alt="thumbnail" width="{$thumbnails_width}" height="{$thumbnails_height}" /> | 142 | alt="" width="{$thumbnails_width}" height="{$thumbnails_height}" /> |
144 | </a> | ||
145 | </div> | 143 | </div> |
146 | </div> | 144 | </div> |
147 | {/if} | 145 | {/if} |
@@ -158,9 +156,9 @@ | |||
158 | <h2> | 156 | <h2> |
159 | <a href="{$value.real_url}"> | 157 | <a href="{$value.real_url}"> |
160 | {if="strpos($value.url, $value.shorturl) === false"} | 158 | {if="strpos($value.url, $value.shorturl) === false"} |
161 | <i class="fa fa-external-link"></i> | 159 | <i class="fa fa-external-link" aria-hidden="true"></i> |
162 | {else} | 160 | {else} |
163 | <i class="fa fa-sticky-note"></i> | 161 | <i class="fa fa-sticky-note" aria-hidden="true"></i> |
164 | {/if} | 162 | {/if} |
165 | 163 | ||
166 | <span class="linklist-link">{$value.title}</span> | 164 | <span class="linklist-link">{$value.title}</span> |
@@ -177,7 +175,7 @@ | |||
177 | <div class="linklist-item-infos clear"> | 175 | <div class="linklist-item-infos clear"> |
178 | {if="$value.tags"} | 176 | {if="$value.tags"} |
179 | <div class="linklist-item-tags"> | 177 | <div class="linklist-item-tags"> |
180 | <i class="fa fa-tags"></i> | 178 | <i class="fa fa-tags" aria-hidden="true"></i> |
181 | {$tag_counter=count($value.taglist)} | 179 | {$tag_counter=count($value.taglist)} |
182 | {loop="value.taglist"} | 180 | {loop="value.taglist"} |
183 | <span class="label label-tag" title="{$strAddTag}"> | 181 | <span class="label label-tag" title="{$strAddTag}"> |
@@ -216,7 +214,7 @@ | |||
216 | <div class="linklist-item-infos-controls-group pure-u-0 pure-u-lg-visible"> | 214 | <div class="linklist-item-infos-controls-group pure-u-0 pure-u-lg-visible"> |
217 | <span class="linklist-item-infos-controls-item ctrl-pin"> | 215 | <span class="linklist-item-infos-controls-item ctrl-pin"> |
218 | <span title="{$strSticky}" class="pin-link pinned-link pure-u-0 pure-u-lg-visible"> | 216 | <span title="{$strSticky}" class="pin-link pinned-link pure-u-0 pure-u-lg-visible"> |
219 | <i class="fa fa-thumb-tack"></i> | 217 | <i class="fa fa-thumb-tack" aria-hidden="true"></i> |
220 | </span> | 218 | </span> |
221 | </span> | 219 | </span> |
222 | </div> | 220 | </div> |
@@ -226,7 +224,7 @@ | |||
226 | {if="!$hide_timestamps || $is_logged_in"} | 224 | {if="!$hide_timestamps || $is_logged_in"} |
227 | {$updated=$value.updated_timestamp ? $strEdited. format_date($value.updated) : $strPermalink} | 225 | {$updated=$value.updated_timestamp ? $strEdited. format_date($value.updated) : $strPermalink} |
228 | <span class="linkdate" title="{$updated}"> | 226 | <span class="linkdate" title="{$updated}"> |
229 | <i class="fa fa-clock-o"></i> | 227 | <i class="fa fa-clock-o" aria-hidden="true"></i> |
230 | {$value.created|format_date} | 228 | {$value.created|format_date} |
231 | {if="$value.updated_timestamp"}*{/if} | 229 | {if="$value.updated_timestamp"}*{/if} |
232 | · | 230 | · |
@@ -248,7 +246,7 @@ | |||
248 | </div><div | 246 | </div><div |
249 | {ignore}do not add space or line break between these div - Firefox issue{/ignore} | 247 | {ignore}do not add space or line break between these div - Firefox issue{/ignore} |
250 | class="linklist-item-infos-url pure-u-lg-5-12 pure-u-1"> | 248 | class="linklist-item-infos-url pure-u-lg-5-12 pure-u-1"> |
251 | <a href="{$value.real_url}" title="{$value.title}"> | 249 | <a href="{$value.real_url}" aria-label="{$value.title}" title="{$value.title}"> |
252 | <i class="fa fa-link" aria-hidden="true"></i> {$value.url} | 250 | <i class="fa fa-link" aria-hidden="true"></i> {$value.url} |
253 | </a> | 251 | </a> |
254 | <div class="linklist-item-buttons pure-u-0 pure-u-lg-visible"> | 252 | <div class="linklist-item-buttons pure-u-0 pure-u-lg-visible"> |