diff options
6 files changed, 89 insertions, 38 deletions
diff --git a/internal/template/templates/views/bookmark_entries.html b/internal/template/templates/views/bookmark_entries.html index 5e08bde5..5c709937 100644 --- a/internal/template/templates/views/bookmark_entries.html +++ b/internal/template/templates/views/bookmark_entries.html @@ -19,16 +19,28 @@ </div> <div class="items"> {{ range .entries }} - <article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> - <div class="item-header" dir="auto"> - <span class="item-title"> - {{ if ne .Feed.Icon.IconID 0 }} + <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"> + <h2 id="entry-title-{{ .ID }}" class="item-title"> + <a href="{{ route "starredEntry" "entryID" .ID }}"> + {{ if ne .Feed.Icon.IconID 0 }} <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - <a href="{{ route "starredEntry" "entryID" .ID }}">{{ .Title }}</a> + {{ else }} + <span class="sr-only">{{ .Feed.Title }}</span> + {{ end }} + {{ .Title }} + </a> + </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> {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} </article> {{ end }} diff --git a/internal/template/templates/views/entry.html b/internal/template/templates/views/entry.html index 06afbbc6..0511af88 100644 --- a/internal/template/templates/views/entry.html +++ b/internal/template/templates/views/entry.html @@ -156,7 +156,7 @@ </div> {{ 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)) }} {{ range .entry.Enclosures }} {{ if ne .URL "" }} diff --git a/internal/template/templates/views/feed_entries.html b/internal/template/templates/views/feed_entries.html index 6efa9a19..339e7eef 100644 --- a/internal/template/templates/views/feed_entries.html +++ b/internal/template/templates/views/feed_entries.html @@ -93,7 +93,11 @@ </div> <div class="items"> {{ 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"> <h2 id="entry-title-{{ .ID }}" class="item-title"> <a diff --git a/internal/template/templates/views/search_entries.html b/internal/template/templates/views/search_entries.html index eb178f9f..1e830c2e 100644 --- a/internal/template/templates/views/search_entries.html +++ b/internal/template/templates/views/search_entries.html @@ -15,16 +15,28 @@ </div> <div class="items"> {{ range .entries }} - <article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> - <div class="item-header" dir="auto"> - <span class="item-title"> - {{ if ne .Feed.Icon.IconID 0 }} + <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"> + <h2 id="entry-title-{{ .ID }}" class="item-title"> + <a href="{{ route "searchEntry" "entryID" .ID }}?q={{ $.searchQuery }}"> + {{ if ne .Feed.Icon.IconID 0 }} <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - <a href="{{ route "searchEntry" "entryID" .ID }}?q={{ $.searchQuery }}">{{ .Title }}</a> + {{ else }} + <span class="sr-only">{{ .Feed.Title }}</span> + {{ end }} + {{ .Title }} + </a> + </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> {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} </article> {{ end }} diff --git a/internal/template/templates/views/shared_entries.html b/internal/template/templates/views/shared_entries.html index 8c387ade..ffbee9ee 100644 --- a/internal/template/templates/views/shared_entries.html +++ b/internal/template/templates/views/shared_entries.html @@ -34,21 +34,29 @@ {{ else }} <div class="items"> {{ range .entries }} - <article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> - <div class="item-header" dir="auto"> - <span class="item-title"> - {{ if ne .Feed.Icon.IconID 0 }} + <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"> + <h2 id="entry-title-{{ .ID }}" class="item-title"> + <a href="{{ route "readEntry" "entryID" .ID }}"> + {{ if ne .Feed.Icon.IconID 0 }} <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - <a href="{{ route "readEntry" "entryID" .ID }}">{{ .Title }}</a> + {{ else }} + <span class="sr-only">{{ .Feed.Title }}</span> + {{ end }} + {{ .Title }} + </a> {{ if .ShareCode }} - <a href="{{ route "sharedEntry" "shareCode" .ShareCode }}" - title="{{ t "entry.shared_entry.title" }}" - target="_blank">{{ icon "share" }}</a> + <a href="{{ route "sharedEntry" "shareCode" .ShareCode }}" + title="{{ t "entry.shared_entry.title" }}" + target="_blank">{{ icon "share" }}</a> {{ end }} - </span> + </h2> <span class="category"><a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}">{{ .Feed.Category.Title }}</a></span> - </div> + </header> <div class="item-meta"> <ul class="item-meta-info"> <li class="item-meta-info-site-url"> diff --git a/internal/template/templates/views/unread_entries.html b/internal/template/templates/views/unread_entries.html index 2daec274..caad5113 100644 --- a/internal/template/templates/views/unread_entries.html +++ b/internal/template/templates/views/unread_entries.html @@ -44,16 +44,28 @@ </div> <div class="items hide-read-items"> {{ range .entries }} - <article role="article" class="item entry-item {{ if $.user.EntrySwipe }}entry-swipe{{ end }} item-status-{{ .Status }}" data-id="{{ .ID }}"> - <div class="item-header" dir="auto"> - <span class="item-title"> - {{ if ne .Feed.Icon.IconID 0 }} + <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"> + <h2 id="entry-title-{{ .ID }}" class="item-title"> + <a href="{{ route "unreadEntry" "entryID" .ID }}"> + {{ if ne .Feed.Icon.IconID 0 }} <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - <a href="{{ route "unreadEntry" "entryID" .ID }}">{{ .Title }}</a> + {{ else }} + <span class="sr-only">{{ .Feed.Title }}</span> + {{ end }} + {{ .Title }} + </a> + </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> {{ template "item_meta" dict "user" $.user "entry" . "hasSaveEntry" $.hasSaveEntry }} </article> {{ end }} @@ -67,7 +79,10 @@ data-label-question="{{ t "confirm.question" }}" data-label-yes="{{ t "confirm.yes" }}" 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> </ul> {{ end }} |