diff --git a/internal/assets/css/screen.css b/internal/assets/css/screen.css index 2c1d28c..fa15224 100644 --- a/internal/assets/css/screen.css +++ b/internal/assets/css/screen.css @@ -1350,6 +1350,26 @@ body { opacity: 0.7; } +.archive-sep { + color: var(--text-secondary); + margin: 0 var(--space-1); + opacity: 0.5; +} + +.archive-link { + color: var(--text-secondary); + font-size: 0.85em; + text-decoration: none; + opacity: 0.7; + white-space: nowrap; +} + +.archive-link:hover { + color: var(--link-color); + text-decoration: underline; + opacity: 1; +} + /* Spotify embed styles */ [data-embed-type="spotify"] iframe { max-width: 800px !important; diff --git a/internal/templates/views/index.html b/internal/templates/views/index.html index 4ceff8a..154de72 100644 --- a/internal/templates/views/index.html +++ b/internal/templates/views/index.html @@ -214,7 +214,17 @@ if (linkSpan && !imgurCard) { var statusPrefix = '' + status + ' '; var linkHref = buildLinkUrl(ircId, clickSig) || escapeHtml(url); - linkSpan.innerHTML = '' + statusPrefix + escapeHtml(url) + ''; + var archiveSuffix = ''; + if (data.archive_url) { + var dateLabel = ''; + if (data.archive_snapshot_at) { + var d = new Date(data.archive_snapshot_at); + var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']; + dateLabel = ' (' + months[d.getUTCMonth()] + ' ' + d.getUTCFullYear() + ')'; + } + archiveSuffix = ' · View on Archive.org' + dateLabel + ''; + } + linkSpan.innerHTML = '' + statusPrefix + escapeHtml(url) + '' + archiveSuffix; } if (previewDiv) previewDiv.remove(); return;