southfox/miniflux
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

change article html structure for accessibility

Browse source
This commit is contained in:
krvpb024 2024-02-02 11:15:33 +08:00 committed by Frédéric Guillot
parent 531e80f580
commit 9b6dbd422c
6 changed files with 89 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
internal/template/templates/views/bookmark_entries.html
View file

@ -19,16 +19,28 @@
</div> </div>
<div class="items"> <div class="items">
{{ range .entries }} {{ range .entries }}
<article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> <article
<div class="item-header" dir="auto"> class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}"
<span class="item-title"> data-id="{{ .ID }}"
aria-labelledby="entry-title-{{ .ID }}"
>
<header class="item-header" dir="auto">
<h2 id="entry-title-{{ .ID }}" class="item-title">
<a href="{{ route "starredEntry" "entryID" .ID }}">
{{ if ne .Feed.Icon.IconID 0 }} {{ if ne .Feed.Icon.IconID 0 }}
<img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}">
{{ else }}
<span class="sr-only">{{ .Feed.Title }}</span>
{{ end }} {{ end }}
<a href="{{ route "starredEntry" "entryID" .ID }}">{{ .Title }}</a> {{ .Title }}
</a>
</h2>
<span class="category">
<a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">
{{ .Feed.Category.Title }}
</a>
</span> </span>
<span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span> </header>
</div>
{{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }}
</article> </article>
{{ end }} {{ end }}

2
internal/template/templates/views/entry.html
View file

@ -156,7 +156,7 @@
</div> </div>
{{ end }} {{ end }}
{{ end }} {{ end }}
<article role="article" class="entry-content gesture-nav-{{ $.user.GestureNav }}" dir="auto"> <article class="entry-content gesture-nav-{{ $.user.GestureNav }}" dir="auto">
{{ if (and .entry.Enclosures (not .entry.Feed.NoMediaPlayer)) }} {{ if (and .entry.Enclosures (not .entry.Feed.NoMediaPlayer)) }}
{{ range .entry.Enclosures }} {{ range .entry.Enclosures }}
{{ if ne .URL "" }} {{ if ne .URL "" }}

6
internal/template/templates/views/feed_entries.html
View file

@ -93,7 +93,11 @@
</div> </div>
<div class="items"> <div class="items">
{{ range .entries }} {{ range .entries }}
<article class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> <article
class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}"
data-id="{{ .ID }}"
aria-labelledby="entry-title-{{ .ID }}"
>
<header class="item-header" dir="auto"> <header class="item-header" dir="auto">
<h2 id="entry-title-{{ .ID }}" class="item-title"> <h2 id="entry-title-{{ .ID }}" class="item-title">
<a <a

24
internal/template/templates/views/search_entries.html
View file

@ -15,16 +15,28 @@
</div> </div>
<div class="items"> <div class="items">
{{ range .entries }} {{ range .entries }}
<article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> <article
<div class="item-header" dir="auto"> class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}"
<span class="item-title"> data-id="{{ .ID }}"
aria-labelledby="entry-title-{{ .ID }}"
>
<header class="item-header" dir="auto">
<h2 id="entry-title-{{ .ID }}" class="item-title">
<a href="{{ route "searchEntry" "entryID" .ID }}?q={{ $.searchQuery }}">
{{ if ne .Feed.Icon.IconID 0 }} {{ if ne .Feed.Icon.IconID 0 }}
<img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}">
{{ else }}
<span class="sr-only">{{ .Feed.Title }}</span>
{{ end }} {{ end }}
<a href="{{ route "searchEntry" "entryID" .ID }}?q={{ $.searchQuery }}">{{ .Title }}</a> {{ .Title }}
</a>
</h2>
<span class="category">
<a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">
{{ .Feed.Category.Title }}
</a>
</span> </span>
<span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span> </header>
</div>
{{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }}
</article> </article>
{{ end }} {{ end }}

20
internal/template/templates/views/shared_entries.html
View file

@ -34,21 +34,29 @@
{{ else }} {{ else }}
<div class="items"> <div class="items">
{{ range .entries }} {{ range .entries }}
<article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> <article
<div class="item-header" dir="auto"> class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}"
<span class="item-title"> data-id="{{ .ID }}"
aria-labelledby="entry-title-{{ .ID }}"
>
<header class="item-header" dir="auto">
<h2 id="entry-title-{{ .ID }}" class="item-title">
<a href="{{ route "readEntry" "entryID" .ID }}">
{{ if ne .Feed.Icon.IconID 0 }} {{ if ne .Feed.Icon.IconID 0 }}
<img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}">
{{ else }}
<span class="sr-only">{{ .Feed.Title }}</span>
{{ end }} {{ end }}
<a href="{{ route "readEntry" "entryID" .ID }}">{{ .Title }}</a> {{ .Title }}
</a>
{{ if .ShareCode }} {{ if .ShareCode }}
<a href="{{ route "sharedEntry" "shareCode" .ShareCode }}" <a href="{{ route "sharedEntry" "shareCode" .ShareCode }}"
title="{{ t "entry.shared_entry.title" }}" title="{{ t "entry.shared_entry.title" }}"
target="_blank">{{ icon "share" }}</a> target="_blank">{{ icon "share" }}</a>
{{ end }} {{ end }}
</span> </h2>
<span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span> <span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span>
</div> </header>
<div class="item-meta"> <div class="item-meta">
<ul class="item-meta-info"> <ul class="item-meta-info">
<li class="item-meta-info-site-url"> <li class="item-meta-info-site-url">

29
internal/template/templates/views/unread_entries.html
View file

@ -44,16 +44,28 @@
</div> </div>
<div class="items hide-read-items"> <div class="items hide-read-items">
{{ range .entries }} {{ range .entries }}
<article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> <article
<div class="item-header" dir="auto"> class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}"
<span class="item-title"> data-id="{{ .ID }}"
aria-labelledby="entry-title-{{ .ID }}"
>
<header class="item-header" dir="auto">
<h2 id="entry-title-{{ .ID }}" class="item-title">
<a href="{{ route "unreadEntry" "entryID" .ID }}">
{{ if ne .Feed.Icon.IconID 0 }} {{ if ne .Feed.Icon.IconID 0 }}
<img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}">
{{ else }}
<span class="sr-only">{{ .Feed.Title }}</span>
{{ end }} {{ end }}
<a href="{{ route "unreadEntry" "entryID" .ID }}">{{ .Title }}</a> {{ .Title }}
</a>
</h2>
<span class="category">
<a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">
{{ .Feed.Category.Title }}
</a>
</span> </span>
<span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span> </header>
</div>
{{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }}
</article> </article>
{{ end }} {{ end }}
@ -67,7 +79,10 @@
data-label-question="{{ t "confirm.question" }}" data-label-question="{{ t "confirm.question" }}"
data-label-yes="{{ t "confirm.yes" }}" data-label-yes="{{ t "confirm.yes" }}"
data-label-no="{{ t "confirm.no" }}" data-label-no="{{ t "confirm.no" }}"
data-label-loading="{{ t "confirm.loading" }}">{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}</a> data-label-loading="{{ t "confirm.loading" }}"
>
{{ icon "mark-page-as-read" }}{{ t "menu.mark_page_as_read" }}
</a>
</li> </li>
</ul> </ul>
{{ end }} {{ end }}