Improved: Nav buttons as buttons (#6485)

* improved HTML

* CSS

* i18n: new title text

* Update swage.scss

* Update app/i18n/fr/gen.php

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* Update swage.scss

---------

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

50 files changed, 152 insertions, 108 deletions

diff --git a/app/i18n/cz/gen.php b/app/i18n/cz/gen.php
index 3570261cf..e64006451 100644
--- a/app/i18n/cz/gen.php
+++ b/app/i18n/cz/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Načíst výchozí zkratky',
 		'manage' => 'Spravovat',
 		'mark_read' => 'Označit jako přečtené',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Otevřít adresu URL',
 		'promote' => 'Zvýšit úroveň',
 		'purge' => 'Vymazat',
diff --git a/app/i18n/de/gen.php b/app/i18n/de/gen.php
index 1912b58fa..01b2313ae 100644
--- a/app/i18n/de/gen.php
+++ b/app/i18n/de/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Standard-Kürzel laden',
 		'manage' => 'Verwalten',
 		'mark_read' => 'Als gelesen markieren',
+		'nav_buttons' => array(
+			'next' => 'Nächster Artikel',
+			'prev' => 'Vorheriger Artikel',
+			'up' => 'Nach oben',
+		),
 		'open_url' => 'URL öffnen',
 		'promote' => 'Hochstufen',
 		'purge' => 'Bereinigen',
diff --git a/app/i18n/el/gen.php b/app/i18n/el/gen.php
index f36d9731f..a1ccf64c0 100644
--- a/app/i18n/el/gen.php
+++ b/app/i18n/el/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// TODO
 		'manage' => 'Manage',	// TODO
 		'mark_read' => 'Mark as read',	// TODO
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promote',	// TODO
 		'purge' => 'Purge',	// TODO
diff --git a/app/i18n/en-us/gen.php b/app/i18n/en-us/gen.php
index aad06ebbe..c4aa9fa67 100644
--- a/app/i18n/en-us/gen.php
+++ b/app/i18n/en-us/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// IGNORE
 		'manage' => 'Manage',	// IGNORE
 		'mark_read' => 'Mark as read',	// IGNORE
+		'nav_buttons' => array(
+			'next' => 'Next article',	// IGNORE
+			'prev' => 'Previous article',	// IGNORE
+			'up' => 'Go up',	// IGNORE
+		),
 		'open_url' => 'Open URL',	// IGNORE
 		'promote' => 'Promote',	// IGNORE
 		'purge' => 'Purge',	// IGNORE
diff --git a/app/i18n/en/gen.php b/app/i18n/en/gen.php
index 247c63540..2885e3de4 100644
--- a/app/i18n/en/gen.php
+++ b/app/i18n/en/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',
 		'manage' => 'Manage',
 		'mark_read' => 'Mark as read',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Open URL',
 		'promote' => 'Promote',
 		'purge' => 'Purge',
diff --git a/app/i18n/es/gen.php b/app/i18n/es/gen.php
index 3afe57196..7a3849be6 100644
--- a/app/i18n/es/gen.php
+++ b/app/i18n/es/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Cargar accesos directos predeterminados',
 		'manage' => 'Administrar',
 		'mark_read' => 'Marcar como leído',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Abrir URL',
 		'promote' => 'Promover',
 		'purge' => 'Eliminar',
diff --git a/app/i18n/fa/gen.php b/app/i18n/fa/gen.php
index a3cbc8419..63d4697cb 100644
--- a/app/i18n/fa/gen.php
+++ b/app/i18n/fa/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => ' میانبرهای پیش فرض را بارگیری کنید',
 		'manage' => ' مدیریت',
 		'mark_read' => ' علامت گذاری به عنوان خوانده شده',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => ' URL را باز کنید',
 		'promote' => ' ترویج',
 		'purge' => ' پاکسازی',
diff --git a/app/i18n/fr/gen.php b/app/i18n/fr/gen.php
index 852edb32a..3fffd1868 100644
--- a/app/i18n/fr/gen.php
+++ b/app/i18n/fr/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Utiliser les raccourcis par défaut',
 		'manage' => 'Gérer',
 		'mark_read' => 'Marquer comme lu',
+		'nav_buttons' => array(
+			'next' => 'Article suivant',
+			'prev' => 'Article précédent',
+			'up' => 'Aller en haut',
+		),
 		'open_url' => 'Ouvrir l’URL',
 		'promote' => 'Promouvoir',
 		'purge' => 'Purger',
diff --git a/app/i18n/he/gen.php b/app/i18n/he/gen.php
index 7e5c25ed6..45ad564f8 100644
--- a/app/i18n/he/gen.php
+++ b/app/i18n/he/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// TODO
 		'manage' => 'ניהול',
 		'mark_read' => 'סימון כנקרא',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promote',	// TODO
 		'purge' => 'Purge',	// TODO
diff --git a/app/i18n/hu/gen.php b/app/i18n/hu/gen.php
index f4f417552..c9749e32f 100644
--- a/app/i18n/hu/gen.php
+++ b/app/i18n/hu/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Alapértelmezett gyorsgombok visszaállítása',
 		'manage' => 'Kezelés',
 		'mark_read' => 'Megjelölés olvasottként',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'URL Megnyitása',
 		'promote' => 'Előléptet',
 		'purge' => 'Töröl',
diff --git a/app/i18n/id/gen.php b/app/i18n/id/gen.php
index 22e27c531..aacf46a0c 100644
--- a/app/i18n/id/gen.php
+++ b/app/i18n/id/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// TODO
 		'manage' => 'Manage',	// TODO
 		'mark_read' => 'Mark as read',	// TODO
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promote',	// TODO
 		'purge' => 'Purge',	// TODO
diff --git a/app/i18n/it/gen.php b/app/i18n/it/gen.php
index fe3cd5084..90b3a35eb 100644
--- a/app/i18n/it/gen.php
+++ b/app/i18n/it/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Carica le scorciatoie di default',
 		'manage' => 'Gestisci',
 		'mark_read' => 'Segna come letto',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Apri URL',
 		'promote' => 'Promuovi',
 		'purge' => 'Elimina',
diff --git a/app/i18n/ja/gen.php b/app/i18n/ja/gen.php
index e99e8f8ce..2102253a9 100644
--- a/app/i18n/ja/gen.php
+++ b/app/i18n/ja/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'デフォルトのショートカットを読み込む',
 		'manage' => '管理',
 		'mark_read' => '既読にする',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'URLを開く',
 		'promote' => 'プロモート',
 		'purge' => '不要なデータの削除',
diff --git a/app/i18n/ko/gen.php b/app/i18n/ko/gen.php
index 8a9fbf841..1e7735a20 100644
--- a/app/i18n/ko/gen.php
+++ b/app/i18n/ko/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => '기본 단축키 불러오기',
 		'manage' => '관리',
 		'mark_read' => '읽음으로 표시',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'URL 열기',
 		'promote' => '목록 수준 올리기',
 		'purge' => '제거',
diff --git a/app/i18n/lv/gen.php b/app/i18n/lv/gen.php
index af71318e4..3e19231cd 100644
--- a/app/i18n/lv/gen.php
+++ b/app/i18n/lv/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Ielādēt noklusējuma saīsnes',
 		'manage' => 'Pārvaldīt',
 		'mark_read' => 'Atzīmēt kā izlasītu',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Atvērt URL',
 		'promote' => 'Paaugstināt amatu',
 		'purge' => 'Iztīrīt',
diff --git a/app/i18n/nl/gen.php b/app/i18n/nl/gen.php
index 021b43ba3..69ba281ba 100644
--- a/app/i18n/nl/gen.php
+++ b/app/i18n/nl/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Standaardshortcuts laden',
 		'manage' => 'Beheren',
 		'mark_read' => 'Markeer als gelezen',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'URL openen',
 		'promote' => 'Bevorderen',
 		'purge' => 'Zuiveren',
diff --git a/app/i18n/oc/gen.php b/app/i18n/oc/gen.php
index efa25bca7..89b5d5bc4 100644
--- a/app/i18n/oc/gen.php
+++ b/app/i18n/oc/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Cargar los acorchis per defaut',
 		'manage' => 'Gerir',
 		'mark_read' => 'Marcar coma legit',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Dobrir l’URL',
 		'promote' => 'Promòure',
 		'purge' => 'Purgar',
diff --git a/app/i18n/pl/gen.php b/app/i18n/pl/gen.php
index 6e44ff9ae..9c3a6570e 100644
--- a/app/i18n/pl/gen.php
+++ b/app/i18n/pl/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Ustaw domyślne skróty',
 		'manage' => 'Ustawienia',
 		'mark_read' => 'Oznacz jako przeczytane',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Otwórz adres',
 		'promote' => 'Awansuj',
 		'purge' => 'Oczyść',
diff --git a/app/i18n/pt-br/gen.php b/app/i18n/pt-br/gen.php
index b39adf9c5..b985f625a 100644
--- a/app/i18n/pt-br/gen.php
+++ b/app/i18n/pt-br/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Carregar mais atalhos',
 		'manage' => 'Gerenciar',
 		'mark_read' => 'Marcar como lido',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Abrir URL',
 		'promote' => 'Promover',
 		'purge' => 'Limpar',
diff --git a/app/i18n/ru/gen.php b/app/i18n/ru/gen.php
index 27addc522..1868fb1ed 100644
--- a/app/i18n/ru/gen.php
+++ b/app/i18n/ru/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Загрузить горячие клавиши по умолчанию',
 		'manage' => 'Настроить',
 		'mark_read' => 'Отметить прочитанным',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Открыть URL',
 		'promote' => 'Продвинуть',
 		'purge' => 'Запустить очистку',
diff --git a/app/i18n/sk/gen.php b/app/i18n/sk/gen.php
index b0b277194..6660222d3 100644
--- a/app/i18n/sk/gen.php
+++ b/app/i18n/sk/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Načítať prednastavené klávesové skratky',
 		'manage' => 'Spravovať',
 		'mark_read' => 'Označiť ako prečítané',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'Otvoriť URL',
 		'promote' => 'Podporiť',
 		'purge' => 'Vymazať',
diff --git a/app/i18n/tr/gen.php b/app/i18n/tr/gen.php
index a10ac7339..703fc87fa 100644
--- a/app/i18n/tr/gen.php
+++ b/app/i18n/tr/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => 'Öntanımlı kısayolları yükle',
 		'manage' => 'Yönet',
 		'mark_read' => 'Okundu olarak işaretle',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => 'URLyi aç',
 		'promote' => 'Yöneticilik ata',
 		'purge' => 'Temizle',
diff --git a/app/i18n/zh-cn/gen.php b/app/i18n/zh-cn/gen.php
index 5c69b2673..8d57ef352 100644
--- a/app/i18n/zh-cn/gen.php
+++ b/app/i18n/zh-cn/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => '加载默认快捷键',
 		'manage' => '管理',
 		'mark_read' => '标记已读',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => '打开链接',
 		'promote' => '设为管理员',
 		'purge' => '清理',
diff --git a/app/i18n/zh-tw/gen.php b/app/i18n/zh-tw/gen.php
index 8d23ca35e..bd5e86ee0 100644
--- a/app/i18n/zh-tw/gen.php
+++ b/app/i18n/zh-tw/gen.php
@@ -29,6 +29,11 @@ return array(
 		'load_default_shortcuts' => '重置快捷鍵',
 		'manage' => '管理',
 		'mark_read' => '標記已讀',
+		'nav_buttons' => array(
+			'next' => 'Next article',	// TODO
+			'prev' => 'Previous article',	// TODO
+			'up' => 'Go up',	// TODO
+		),
 		'open_url' => '打開連結',
 		'promote' => '設為管理員',
 		'purge' => '清理',
diff --git a/app/layout/nav_entries.phtml b/app/layout/nav_entries.phtml
index e640f265d..a7f8478e1 100644
--- a/app/layout/nav_entries.phtml
+++ b/app/layout/nav_entries.phtml
@@ -1,10 +1,8 @@
 <?php
 	declare(strict_types=1);
 ?>
-<nav>
-	<ul id="nav_entries">
-		<li class="item"><a class="previous_entry" href="#"><?= _i('prev') ?></a></li>
-		<li class="item"><a class="up" href="#"><?= _i('up') ?></a></li>
-		<li class="item"><a class="next_entry" href="#"><?= _i('next') ?></a></li>
-	</ul>
+<nav id="nav_entries">
+	<button class="previous_entry" title="<?= _t('gen.action.nav_buttons.prev') ?>"><?= _i('prev') ?></button>
+	<button class="up" title="<?= _t('gen.action.nav_buttons.up') ?>"><?= _i('up') ?></button>
+	<button class="next_entry" title="<?= _t('gen.action.nav_buttons.next') ?>"><?= _i('next') ?></button>
 </nav>
diff --git a/p/themes/Alternative-Dark/adark.css b/p/themes/Alternative-Dark/adark.css
index 1bc7a5097..ce45f036d 100644
--- a/p/themes/Alternative-Dark/adark.css
+++ b/p/themes/Alternative-Dark/adark.css
@@ -922,11 +922,7 @@ kbd {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background: var(--background-color-light);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/Alternative-Dark/adark.rtl.css b/p/themes/Alternative-Dark/adark.rtl.css
index f618560a9..fff6e102f 100644
--- a/p/themes/Alternative-Dark/adark.rtl.css
+++ b/p/themes/Alternative-Dark/adark.rtl.css
@@ -922,11 +922,7 @@ kbd {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background: var(--background-color-light);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/Ansum/_layout.scss b/p/themes/Ansum/_layout.scss
index c0d0a4f96..8ad5099be 100644
--- a/p/themes/Ansum/_layout.scss
+++ b/p/themes/Ansum/_layout.scss
@@ -372,9 +372,5 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: variables.$sid-bg;
 }
diff --git a/p/themes/Ansum/_mobile.scss b/p/themes/Ansum/_mobile.scss
index 720211a2a..21eb43c52 100644
--- a/p/themes/Ansum/_mobile.scss
+++ b/p/themes/Ansum/_mobile.scss
@@ -140,8 +140,8 @@
 
 	}
 
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 
 	.notification {
diff --git a/p/themes/Ansum/ansum.css b/p/themes/Ansum/ansum.css
index 29fe2de0a..fcefd861e 100644
--- a/p/themes/Ansum/ansum.css
+++ b/p/themes/Ansum/ansum.css
@@ -973,10 +973,6 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #fbf9f6;
 }
 
@@ -1291,8 +1287,8 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 	.notification {
 		border-radius: 0;
diff --git a/p/themes/Ansum/ansum.rtl.css b/p/themes/Ansum/ansum.rtl.css
index 37a3e82ee..fe535fbc5 100644
--- a/p/themes/Ansum/ansum.rtl.css
+++ b/p/themes/Ansum/ansum.rtl.css
@@ -973,10 +973,6 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #fbf9f6;
 }
 
@@ -1291,8 +1287,8 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 	.notification {
 		border-radius: 0;
diff --git a/p/themes/Flat/flat.css b/p/themes/Flat/flat.css
index bfe5eb8a2..61622b840 100644
--- a/p/themes/Flat/flat.css
+++ b/p/themes/Flat/flat.css
@@ -846,10 +846,6 @@ th {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #34495e;
 }
 
diff --git a/p/themes/Flat/flat.rtl.css b/p/themes/Flat/flat.rtl.css
index ee882a5b7..35cd1d620 100644
--- a/p/themes/Flat/flat.rtl.css
+++ b/p/themes/Flat/flat.rtl.css
@@ -846,10 +846,6 @@ th {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #34495e;
 }
 
diff --git a/p/themes/Mapco/_layout.scss b/p/themes/Mapco/_layout.scss
index 4404fd211..ce78db7f2 100644
--- a/p/themes/Mapco/_layout.scss
+++ b/p/themes/Mapco/_layout.scss
@@ -386,9 +386,5 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: variables.$sid-bg;
 }
diff --git a/p/themes/Mapco/_mobile.scss b/p/themes/Mapco/_mobile.scss
index 9c1ad44c7..974c5cf65 100644
--- a/p/themes/Mapco/_mobile.scss
+++ b/p/themes/Mapco/_mobile.scss
@@ -147,8 +147,8 @@
 
 	}
 
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 
 	.notification {
diff --git a/p/themes/Mapco/mapco.css b/p/themes/Mapco/mapco.css
index a25cfade3..925e6ec8b 100644
--- a/p/themes/Mapco/mapco.css
+++ b/p/themes/Mapco/mapco.css
@@ -991,10 +991,6 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #303136;
 }
 
@@ -1311,8 +1307,8 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 	.notification {
 		border-radius: 0;
diff --git a/p/themes/Mapco/mapco.rtl.css b/p/themes/Mapco/mapco.rtl.css
index cece7cc55..c85d108d9 100644
--- a/p/themes/Mapco/mapco.rtl.css
+++ b/p/themes/Mapco/mapco.rtl.css
@@ -991,10 +991,6 @@ main.prompt {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3em;
-	table-layout: fixed;
 	background: #303136;
 }
 
@@ -1311,8 +1307,8 @@ main.prompt {
 		line-height: 1.5rem;
 		margin-bottom: 1rem;
 	}
-	#nav_entries {
-		line-height: 4.5rem;
+	#nav_entries button {
+		height: 4.5rem;
 	}
 	.notification {
 		border-radius: 0;
diff --git a/p/themes/Nord/nord.css b/p/themes/Nord/nord.css
index ab2e9e34e..7df84b20a 100644
--- a/p/themes/Nord/nord.css
+++ b/p/themes/Nord/nord.css
@@ -920,10 +920,7 @@ li.item.active {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background: var(--accent-bg);
-	text-align: center;
-	line-height: 3em;
 }
 
 #nav_entries .item a:hover {
diff --git a/p/themes/Nord/nord.rtl.css b/p/themes/Nord/nord.rtl.css
index 94a07b725..ee20cc6e4 100644
--- a/p/themes/Nord/nord.rtl.css
+++ b/p/themes/Nord/nord.rtl.css
@@ -920,10 +920,7 @@ li.item.active {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background: var(--accent-bg);
-	text-align: center;
-	line-height: 3em;
 }
 
 #nav_entries .item a:hover {
diff --git a/p/themes/Origine/origine.css b/p/themes/Origine/origine.css
index 333bb5354..99f8547ce 100644
--- a/p/themes/Origine/origine.css
+++ b/p/themes/Origine/origine.css
@@ -988,12 +988,8 @@ a:hover .icon {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background-color: var(--background-color-light);
 	border-top: 1px solid var(--border-color);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/Origine/origine.rtl.css b/p/themes/Origine/origine.rtl.css
index 9f8522613..8b88c4329 100644
--- a/p/themes/Origine/origine.rtl.css
+++ b/p/themes/Origine/origine.rtl.css
@@ -988,12 +988,8 @@ a:hover .icon {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background-color: var(--background-color-light);
 	border-top: 1px solid var(--border-color);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/Pafat/pafat.css b/p/themes/Pafat/pafat.css
index 4da46bc7f..675b472fd 100644
--- a/p/themes/Pafat/pafat.css
+++ b/p/themes/Pafat/pafat.css
@@ -958,12 +958,8 @@ a.signin {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background-color: var(--background-color-white);
 	border-top: 1px solid var(--border-color-grey-light);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 #nav_entries .item:hover {
diff --git a/p/themes/Pafat/pafat.rtl.css b/p/themes/Pafat/pafat.rtl.css
index 0c969f1f1..78ed6f984 100644
--- a/p/themes/Pafat/pafat.rtl.css
+++ b/p/themes/Pafat/pafat.rtl.css
@@ -958,12 +958,8 @@ a.signin {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
 	background-color: var(--background-color-white);
 	border-top: 1px solid var(--border-color-grey-light);
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 #nav_entries .item:hover {
diff --git a/p/themes/Swage/swage.css b/p/themes/Swage/swage.css
index 2b8e4b86e..7321fac86 100644
--- a/p/themes/Swage/swage.css
+++ b/p/themes/Swage/swage.css
@@ -833,10 +833,6 @@ form th {
 }
 
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 	background-color: var(--color-background-aside);
 }
 
diff --git a/p/themes/Swage/swage.rtl.css b/p/themes/Swage/swage.rtl.css
index b512ad0d5..c46869e91 100644
--- a/p/themes/Swage/swage.rtl.css
+++ b/p/themes/Swage/swage.rtl.css
@@ -833,10 +833,6 @@ form th {
 }
 
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 	background-color: var(--color-background-aside);
 }
 
diff --git a/p/themes/Swage/swage.scss b/p/themes/Swage/swage.scss
index e329a57c8..f05bf8ee4 100644
--- a/p/themes/Swage/swage.scss
+++ b/p/themes/Swage/swage.scss
@@ -1070,10 +1070,6 @@ form {
 }
 
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 
 	@extend %aside-width;
 	background-color: var(--color-background-aside);
diff --git a/p/themes/base-theme/base.css b/p/themes/base-theme/base.css
index f2807ceee..69bf5fbe5 100644
--- a/p/themes/base-theme/base.css
+++ b/p/themes/base-theme/base.css
@@ -630,10 +630,6 @@ th {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/base-theme/base.rtl.css b/p/themes/base-theme/base.rtl.css
index 5809a1e6c..7c50d3083 100644
--- a/p/themes/base-theme/base.rtl.css
+++ b/p/themes/base-theme/base.rtl.css
@@ -630,10 +630,6 @@ th {
 
 /*=== Navigation menu (for articles) */
 #nav_entries {
-	margin: 0;
-	text-align: center;
-	line-height: 3;
-	table-layout: fixed;
 }
 
 /*=== READER VIEW */
diff --git a/p/themes/base-theme/frss.css b/p/themes/base-theme/frss.css
index 131d0ddc7..adea1f6cc 100644
--- a/p/themes/base-theme/frss.css
+++ b/p/themes/base-theme/frss.css
@@ -1670,13 +1670,17 @@ a.website:hover .favicon {
 	z-index: 50;
 }
 
-#nav_entries .item {
+#nav_entries button {
+	background-color: transparent;
 	display: table-cell;
-	width: 30%;
+	width: 33.3%;
+	height: 3rem;
+	border: 0;
+	cursor: pointer;
 }
 
-#nav_entries a {
-	display: block;
+#nav_entries button:hover {
+	background-color: var(--frss-darken-background-hover-transparent);
 }
 
 /*=== "Load" parts */
diff --git a/p/themes/base-theme/frss.rtl.css b/p/themes/base-theme/frss.rtl.css
index 073306ca5..5684501c3 100644
--- a/p/themes/base-theme/frss.rtl.css
+++ b/p/themes/base-theme/frss.rtl.css
@@ -1670,13 +1670,17 @@ a.website:hover .favicon {
 	z-index: 50;
 }
 
-#nav_entries .item {
+#nav_entries button {
+	background-color: transparent;
 	display: table-cell;
-	width: 30%;
+	width: 33.3%;
+	height: 3rem;
+	border: 0;
+	cursor: pointer;
 }
 
-#nav_entries a {
-	display: block;
+#nav_entries button:hover {
+	background-color: var(--frss-darken-background-hover-transparent);
 }
 
 /*=== "Load" parts */