diff options
author | 2024-01-27 15:11:48 +0800 | |
---|---|---|
committer | 2024-02-04 10:47:30 -0800 | |
commit | 6c78a1d635c2327368d21637889847d303256078 (patch) | |
tree | ce98951af2943f93c70d29dc728a253820db2148 | |
parent | 6413c9f9f7cebb21fdea348ed2f37ef977e387a1 (diff) | |
download | v2-6c78a1d635c2327368d21637889847d303256078.tar.gz v2-6c78a1d635c2327368d21637889847d303256078.tar.zst v2-6c78a1d635c2327368d21637889847d303256078.zip |
improve feed, entry, category a11y
23 files changed, 139 insertions, 43 deletions
diff --git a/internal/locale/translations/de_DE.json b/internal/locale/translations/de_DE.json index 184a69aa..668ff143 100644 --- a/internal/locale/translations/de_DE.json +++ b/internal/locale/translations/de_DE.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Kategorie bearbeiten: %s", "page.edit_user.title": "Benutzer bearbeiten: %s", "page.feeds.title": "Abonnements", + "page.feeds.category": "Category", "page.feeds.last_check": "Letzte Aktualisierung:", "page.feeds.next_check": "Nächste Aktualisierung:", "page.feeds.unread_counter": "Anzahl der ungelesenen Artikel", diff --git a/internal/locale/translations/el_EL.json b/internal/locale/translations/el_EL.json index e9806d50..fbae9660 100644 --- a/internal/locale/translations/el_EL.json +++ b/internal/locale/translations/el_EL.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Επεξεργασία κατηγορίας: % s", "page.edit_user.title": "Επεξεργασία χρήστη: % s", "page.feeds.title": "Ροές", + "page.feeds.category": "Category", "page.feeds.last_check": "Τελευταίος έλεγχος:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Αριθμός μη αναγνωσμένων καταχωρήσεων", diff --git a/internal/locale/translations/en_US.json b/internal/locale/translations/en_US.json index 342e955d..79a500ff 100644 --- a/internal/locale/translations/en_US.json +++ b/internal/locale/translations/en_US.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Edit Category: %s", "page.edit_user.title": "Edit User: %s", "page.feeds.title": "Feeds", + "page.feeds.category": "Category", "page.feeds.last_check": "Last check:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Number of unread entries", diff --git a/internal/locale/translations/es_ES.json b/internal/locale/translations/es_ES.json index ce8d7d53..a396953b 100644 --- a/internal/locale/translations/es_ES.json +++ b/internal/locale/translations/es_ES.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Editar categoría: %s", "page.edit_user.title": "Editar usuario: %s", "page.feeds.title": "Fuentes", + "page.feeds.category": "Category", "page.feeds.last_check": "Última verificación:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Número de artículos no leídos", diff --git a/internal/locale/translations/fi_FI.json b/internal/locale/translations/fi_FI.json index 54816137..8b2e7aa5 100644 --- a/internal/locale/translations/fi_FI.json +++ b/internal/locale/translations/fi_FI.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Muokkaa kategoria: %s", "page.edit_user.title": "Muokkaa käyttäjä: %s", "page.feeds.title": "Syötteet", + "page.feeds.category": "Category", "page.feeds.last_check": "Viimeisin tarkistus:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Lukemattomien artikkeleiden määrä", diff --git a/internal/locale/translations/fr_FR.json b/internal/locale/translations/fr_FR.json index 8d6905af..8ab12f15 100644 --- a/internal/locale/translations/fr_FR.json +++ b/internal/locale/translations/fr_FR.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Modification de la catégorie : %s", "page.edit_user.title": "Modification de l'utilisateur : %s", "page.feeds.title": "Abonnements", + "page.feeds.category": "Category", "page.feeds.last_check": "Dernière vérification :", "page.feeds.next_check": "Prochaine vérification :", "page.feeds.unread_counter": "Nombre d'entrées non lues", diff --git a/internal/locale/translations/hi_IN.json b/internal/locale/translations/hi_IN.json index b62e4abc..773648ce 100644 --- a/internal/locale/translations/hi_IN.json +++ b/internal/locale/translations/hi_IN.json @@ -109,6 +109,7 @@ "page.edit_category.title": "%s श्रेणी संपाद करे", "page.edit_user.title": "%s उपभोक्ता संपाद करे", "page.feeds.title": "फ़ीड", + "page.feeds.category": "Category", "page.feeds.last_check": "आखरी जाँच", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "अपठित विषयवस्तुया", diff --git a/internal/locale/translations/id_ID.json b/internal/locale/translations/id_ID.json index 13d6d4c7..3ec900fc 100644 --- a/internal/locale/translations/id_ID.json +++ b/internal/locale/translations/id_ID.json @@ -107,6 +107,7 @@ "page.edit_category.title": "Sunting Kategori: %s", "page.edit_user.title": "Sunting Pengguna: %s", "page.feeds.title": "Umpan", + "page.feeds.category": "Category", "page.feeds.last_check": "Terakhir diperiksa:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Jumlah entri yang belum dibaca", diff --git a/internal/locale/translations/it_IT.json b/internal/locale/translations/it_IT.json index d0bde545..53041273 100644 --- a/internal/locale/translations/it_IT.json +++ b/internal/locale/translations/it_IT.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Modifica categoria: %s", "page.edit_user.title": "Modifica utente: %s", "page.feeds.title": "Feed", + "page.feeds.category": "Category", "page.feeds.last_check": "Ultimo controllo:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Numero di voci non lette", diff --git a/internal/locale/translations/ja_JP.json b/internal/locale/translations/ja_JP.json index 01a2cd6c..a8faa06a 100644 --- a/internal/locale/translations/ja_JP.json +++ b/internal/locale/translations/ja_JP.json @@ -109,6 +109,7 @@ "page.edit_category.title": "カテゴリを編集: %s", "page.edit_user.title": "ユーザーを編集: %s", "page.feeds.title": "フィード一覧", + "page.feeds.category": "Category", "page.feeds.last_check": "最終チェック:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "未読記事の数", diff --git a/internal/locale/translations/nl_NL.json b/internal/locale/translations/nl_NL.json index b40bd3a1..db18dd0d 100644 --- a/internal/locale/translations/nl_NL.json +++ b/internal/locale/translations/nl_NL.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Bewerken van categorie: %s", "page.edit_user.title": "Bewerk gebruiker: %s", "page.feeds.title": "Feeds", + "page.feeds.category": "Category", "page.feeds.last_check": "Laatste update:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Aantal ongelezen vermeldingen", diff --git a/internal/locale/translations/pl_PL.json b/internal/locale/translations/pl_PL.json index 17b71e1f..34eceddf 100644 --- a/internal/locale/translations/pl_PL.json +++ b/internal/locale/translations/pl_PL.json @@ -110,6 +110,7 @@ "page.edit_category.title": "Edycja Kategorii: %s", "page.edit_user.title": "Edytuj użytkownika: %s", "page.feeds.title": "Kanały", + "page.feeds.category": "Category", "page.feeds.last_check": "Ostatnia aktualizacja:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Liczba nieprzeczytanych wpisów", diff --git a/internal/locale/translations/pt_BR.json b/internal/locale/translations/pt_BR.json index b9c2cef0..2cd3bffa 100644 --- a/internal/locale/translations/pt_BR.json +++ b/internal/locale/translations/pt_BR.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Editar categoria: %s", "page.edit_user.title": "Editar usuário: %s", "page.feeds.title": "Fontes", + "page.feeds.category": "Category", "page.feeds.last_check": "Última verificação:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Numero de itens não lidos", diff --git a/internal/locale/translations/ru_RU.json b/internal/locale/translations/ru_RU.json index 06181a2c..41150b3f 100644 --- a/internal/locale/translations/ru_RU.json +++ b/internal/locale/translations/ru_RU.json @@ -110,6 +110,7 @@ "page.edit_category.title": "Изменить категорию: %s", "page.edit_user.title": "Изменить пользователя: %s", "page.feeds.title": "Подписки", + "page.feeds.category": "Category", "page.feeds.last_check": "Последняя проверка:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Количество непрочитанных статей", diff --git a/internal/locale/translations/tr_TR.json b/internal/locale/translations/tr_TR.json index a0a3e81c..9300c4fa 100644 --- a/internal/locale/translations/tr_TR.json +++ b/internal/locale/translations/tr_TR.json @@ -109,6 +109,7 @@ "page.edit_category.title": "Kategoriyi Düzenle: %s", "page.edit_user.title": "Kullanıcıyı Düzenle: %s", "page.feeds.title": "Beslemeler", + "page.feeds.category": "Category", "page.feeds.last_check": "Son kontrol:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Okunmamış iletilerin sayısı", diff --git a/internal/locale/translations/uk_UA.json b/internal/locale/translations/uk_UA.json index 0acc0e7c..4fb10815 100644 --- a/internal/locale/translations/uk_UA.json +++ b/internal/locale/translations/uk_UA.json @@ -111,6 +111,7 @@ "page.edit_category.title": "Редагування категорії: %s", "page.edit_user.title": "Редагування користувача: %s", "page.feeds.title": "Стрічки", + "page.feeds.category": "Category", "page.feeds.last_check": "Остання перевірка:", "page.feeds.next_check": "Next check:", "page.feeds.unread_counter": "Кількість непрочитаних записів", diff --git a/internal/locale/translations/zh_CN.json b/internal/locale/translations/zh_CN.json index 5c0d522a..5356c525 100644 --- a/internal/locale/translations/zh_CN.json +++ b/internal/locale/translations/zh_CN.json @@ -108,6 +108,7 @@ "page.edit_category.title": "编辑分类 : %s", "page.edit_user.title": "编辑用户 : %s", "page.feeds.title": "源", + "page.feeds.category": "Category", "page.feeds.last_check": "最后检查时间:", "page.feeds.next_check": "下次检查时间:", "page.feeds.unread_counter": "未读文章数", diff --git a/internal/locale/translations/zh_TW.json b/internal/locale/translations/zh_TW.json index a7c886e5..03c50c8e 100644 --- a/internal/locale/translations/zh_TW.json +++ b/internal/locale/translations/zh_TW.json @@ -109,6 +109,7 @@ "page.edit_category.title": "編輯分類 : %s", "page.edit_user.title": "編輯使用者 : %s", "page.feeds.title": "Feeds", + "page.feeds.category": "分類", "page.feeds.last_check": "最後檢查時間:", "page.feeds.next_check": "下次檢查時間:", "page.feeds.unread_counter": "未讀文章數", diff --git a/internal/template/templates/common/feed_list.html b/internal/template/templates/common/feed_list.html index 2caaabf6..4f47ce99 100644 --- a/internal/template/templates/common/feed_list.html +++ b/internal/template/templates/common/feed_list.html @@ -1,22 +1,43 @@ {{ define "feed_list" }} <div class="items"> {{ range .feeds }} - <article role="article" class="item feed-item {{ if ne .ParsingErrorCount 0 }}feed-parsing-error{{ else if ne .UnreadCount 0 }}feed-has-unread{{ end }}"> - <div class="item-header" dir="auto"> - <span class="item-title"> - {{ if and (.Icon) (gt .Icon.IconID 0) }} - <img src="{{ route "icon" "iconID" .Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Title }}"> - {{ end }} - {{ if .Disabled }} 🚫 {{ end }} - <a href="{{ route "feedEntries" "feedID" .ID }}">{{ .Title }}</a> - </span> + <article + class="item feed-item {{ if ne .ParsingErrorCount 0 }}feed-parsing-error{{ else if ne .UnreadCount 0 }}feed-has-unread{{ end }}" + aria-labelledby="feed-title-{{ .ID }}" + > + <header class="item-header" dir="auto"> + <h2 id="feed-title-{{ .ID }}" class="item-title"> + + <a href="{{ route "feedEntries" "feedID" .ID }}"> + {{ if and (.Icon) (gt .Icon.IconID 0) }} + <img src="{{ route "icon" "iconID" .Icon.IconID }}" width="16" height="16" loading="lazy" alt=""> + {{ end }} + {{ if .Disabled }} 🚫 {{ end }} + {{ .Title }} + </a> + </h2> <span class="feed-entries-counter"> - (<span title="{{ t "page.feeds.unread_counter" }}">{{ .UnreadCount }}</span>/<span>{{ .NumberOfVisibleEntries }}</span>) + <span aria-hidden="true">(</span> + <span class="sr-only"> + {{ t "page.feeds.unread_counter" }}: + </span> + <span>{{ .UnreadCount }}</span> + <span aria-hidden="true">/</span> + <span class="sr-only"> + {{ t "page.categories.all_counter" }}: + </span> + <span>{{ .NumberOfVisibleEntries }}</span> + <span aria-hidden="true">)</span> </span> <span class="category"> - <a href="{{ route "categoryEntries" "categoryID" .Category.ID }}">{{ .Category.Title }}</a> + <a id="feed-category-{{ .ID }}" + href="{{ route "categoryEntries" "categoryID" .Category.ID }}" + aria-label="{{ t "page.feeds.category" }}: {{ .Category.Title }}" + > + {{ .Category.Title }} + </a> </span> - </div> + </header> <div class="item-meta"> <ul class="item-meta-info"> <li class="item-meta-info-site-url" dir="auto"> diff --git a/internal/template/templates/views/categories.html b/internal/template/templates/views/categories.html index 7c98f92c..a0c273af 100644 --- a/internal/template/templates/views/categories.html +++ b/internal/template/templates/views/categories.html @@ -23,13 +23,21 @@ {{ else }} <div class="items"> {{ range .categories }} - <article role="article" class="item category-item {{if gt (deRef .TotalUnread) 0 }} category-has-unread{{end}}"> - <div class="item-header" dir="auto"> - <span class="item-title"> + <article + class="item category-item {{if gt (deRef .TotalUnread) 0 }} category-has-unread{{end}}" + aria-labelledby="category-title-{{ .ID }}" + > + <header id="category-title-{{ .ID }}" class="item-header" dir="auto"> + <h2 class="item-title"> <a href="{{ route "categoryEntries" "categoryID" .ID }}">{{ .Title }}</a> - </span> - (<span title="{{ t "page.categories.unread_counter" }}">{{ .TotalUnread }}</span>) - </div> + <span aria-hidden="true">(</span> + <span class="sr-only"> + {{ t "page.categories.unread_counter" }}: + </span> + <span>{{ .TotalUnread }}</span> + <span aria-hidden="true">)</span> + </h2> + </header> <div class="item-meta"> <ul class="item-meta-info"> <li class="item-meta-info-feed-count"> diff --git a/internal/template/templates/views/category_entries.html b/internal/template/templates/views/category_entries.html index eafacee4..8b61a86e 100644 --- a/internal/template/templates/views/category_entries.html +++ b/internal/template/templates/views/category_entries.html @@ -64,20 +64,34 @@ </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 }} - <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - {{ if $.showOnlyUnreadEntries }} - <a href="{{ route "unreadCategoryEntry" "categoryID" .Feed.Category.ID "entryID" .ID }}">{{ .Title }}</a> - {{ else }} - <a href="{{ route "categoryEntry" "categoryID" .Feed.Category.ID "entryID" .ID }}">{{ .Title }}</a> - {{ end }} + <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 + {{ if $.showOnlyUnreadEntries }} + href="{{ route "unreadCategoryEntry" "categoryID" .Feed.Category.ID "entryID" .ID }}" + {{ else }} + href="{{ route "categoryEntry" "categoryID" .Feed.Category.ID "entryID" .ID }}" + {{ end }} + > + {{ if ne .Feed.Icon.IconID 0 }} + <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 }} + {{ .Title }} + </a> + </h2> + <span class="category"> + <a href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}" aria-label="{{ t "page.feeds.category" }}: {{ .Feed.Category.Title }}"> + {{ .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/feed_entries.html b/internal/template/templates/views/feed_entries.html index 05181ebe..e101a3ce 100644 --- a/internal/template/templates/views/feed_entries.html +++ b/internal/template/templates/views/feed_entries.html @@ -93,20 +93,33 @@ </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 }}"> + <header class="item-header" dir="auto"> + <h2 id="entry-title-{{ .ID }}" class="item-title"> + <a + {{ if $.showOnlyUnreadEntries }} + href="{{ route "unreadFeedEntry" "feedID" .Feed.ID "entryID" .ID }}" + {{ else }} + href="{{ route "feedEntry" "feedID" .Feed.ID "entryID" .ID }}" + {{ end }} + > + {{ if ne .Feed.Icon.IconID 0 }} <img src="{{ route "icon" "iconID" .Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .Feed.Title }}"> - {{ end }} - {{ if $.showOnlyUnreadEntries }} - <a href="{{ route "unreadFeedEntry" "feedID" .Feed.ID "entryID" .ID }}">{{ .Title }}</a> - {{ else }} - <a href="{{ route "feedEntry" "feedID" .Feed.ID "entryID" .ID }}">{{ .Title }}</a> - {{ end }} + {{ else }} + <span class="sr-only">{{ .Feed.Title }}</span> + {{ end }} + {{ .Title }} + </a> + </h2> + <span class="category"> + <a + href="{{ route "categoryEntries" "categoryID" .Feed.Category.ID }}" + aria-label="{{ t "page.feeds.category" }}: {{ .Feed.Category.Title }}" + > + {{ .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/ui/static/css/common.css b/internal/ui/static/css/common.css index e64ab5d5..0c31b470 100644 --- a/internal/ui/static/css/common.css +++ b/internal/ui/static/css/common.css @@ -815,9 +815,31 @@ template { box-shadow: var(--current-item-box-shadow); } + +.item-header { + font-size: 1rem; +} + +.item-header span { + font-weight: normal; +} + +.item-title { + font-size: 1rem; + margin: 0; + display: inline; +} + .item-title a { text-decoration: none; font-weight: var(--item-title-link-font-weight); + font-size: inherit; +} + +.feed-entries-counter { + display: inline-flex; + gap: 2px; + align-items: center; } .item-status-read .item-title a { |