From d7321c3e56004aa95ee51682cf24efb92d8becd7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20Guillot?= <f@miniflux.net>
Date: Mon, 9 Jun 2025 21:06:29 -0700
Subject: [PATCH] feat(ui): display external URL in single entry view

Display the article's external URL directly in the single entry view.

Rationale: On mobile devices, users couldn't see where a link pointed before tapping it.
Previously, the only way to view the external URL was by hovering - an action not available on touch devices.
---
 internal/template/templates/views/entry.html | 25 ++++++++++----------
 internal/ui/static/css/common.css            |  6 +++++
 2 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/internal/template/templates/views/entry.html b/internal/template/templates/views/entry.html
index 0ef05a20..e5ef1967 100644
--- a/internal/template/templates/views/entry.html
+++ b/internal/template/templates/views/entry.html
@@ -69,20 +69,12 @@
                 <li>
                     <form method="post" action="{{route "shareEntry" "entryID" .entry.ID }}">
                         <input type="hidden" name="csrf" value="{{ .csrf }}">
-                          <button type="submit" class="page-button">
-		              {{ icon "share" }}<span class="icon-label">{{ t "entry.share.label" }}</span>
-	                  </button>
-		    </form>
+                        <button type="submit" class="page-button">
+                            {{ icon "share" }}<span class="icon-label">{{ t "entry.share.label" }}</span>
+                        </button>
+                    </form>
                 </li>
                 {{ end }}
-                <li>
-                    <a href="{{ .entry.URL | safeURL  }}"
-                        class="page-link"
-                        {{ if $.user.OpenExternalLinksInNewTab }}target="_blank"{{ end }}
-                        rel="noopener noreferrer"
-                        referrerpolicy="no-referrer"
-                        data-original-link="{{ .user.MarkReadOnView }}">{{ icon "external-link" }}<span class="icon-label">{{ t "entry.external_link.label" }}</span></a>
-                </li>
                 <li>
                     <button
                         class="page-button"
@@ -173,6 +165,14 @@
             {{ end }}
         </div>
         {{ end }}
+        <div class="entry-external-link">
+            <a
+                href="{{ .entry.URL | safeURL  }}"
+                {{ if $.user.OpenExternalLinksInNewTab }}target="_blank"{{ end }}
+                rel="noopener noreferrer"
+                referrerpolicy="no-referrer"
+                data-original-link="{{ $.user.MarkReadOnView }}">{{ .entry.URL }}</span></a>
+        </div>
         <div class="entry-date">
             {{ if .user }}
             <time datetime="{{ isodate .entry.Date }}" title="{{ isodate .entry.Date }}">{{ elapsed $.user.Timezone .entry.Date }}</time>
@@ -276,7 +276,6 @@
 </details>
 {{ end }}
 
-
 {{ if .user }}
 <div class="pagination-entry-bottom">
     {{ template "entry_pagination" . }}
diff --git a/internal/ui/static/css/common.css b/internal/ui/static/css/common.css
index 9a5e5ad0..43c98c10 100644
--- a/internal/ui/static/css/common.css
+++ b/internal/ui/static/css/common.css
@@ -1227,6 +1227,12 @@ details.entry-enclosures {
     max-width: 100%;
 }
 
+.entry-external-link {
+    font-size: 0.8em;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
 /* Confirmation */
 .confirm {
     font-weight: 500;