Fix post detail page navigation issues

- Change back to feed button from onclick to proper link to ensure it always works
- Make platform badge clickable to external source when available (upper left clickable link)
- This addresses the issue where posts had no upper left clickable link and back button didn't work
This commit is contained in:
chelsea
2025-10-12 13:28:41 -05:00
parent 343d6b51ea
commit fc440eafa3

View File

@@ -3,67 +3,27 @@
{% block title %}{{ post.title }} - {{ APP_NAME }}{% endblock %}
{% block content %}
<!-- Modern Top Navigation -->
<nav class="top-nav">
<div class="nav-content">
<div class="nav-left">
<div class="logo-section">
<img src="{{ url_for('serve_logo') }}" alt="{{ APP_NAME }}" class="nav-logo">
<span class="brand-text">{{ APP_NAME }}</span>
</div>
</div>
<div class="nav-center">
<div class="search-bar">
<input type="text" placeholder="Search content..." class="search-input">
<button class="search-btn">🔍</button>
</div>
</div>
<div class="nav-right">
{% if current_user.is_authenticated %}
<div class="user-menu">
<div class="user-info">
<div class="user-avatar">
{% if current_user.profile_picture_url %}
<img src="{{ current_user.profile_picture_url }}" alt="Avatar">
{% else %}
<div class="avatar-placeholder">{{ current_user.username[:2].upper() }}</div>
{% endif %}
</div>
<span class="username">{{ current_user.username }}</span>
</div>
<div class="user-dropdown">
<a href="{{ url_for('settings') }}" class="dropdown-item">⚙️ Settings</a>
{% if current_user.is_admin %}
<a href="{{ url_for('admin_panel') }}" class="dropdown-item">👨‍💼 Admin Panel</a>
{% endif %}
<a href="{{ url_for('logout') }}" class="dropdown-item">🚪 Logout</a>
</div>
</div>
{% else %}
<div class="auth-buttons">
<a href="{{ url_for('login') }}" class="auth-btn">Login</a>
<a href="{{ url_for('signup') }}" class="auth-btn primary">Sign Up</a>
</div>
{% endif %}
</div>
</div>
</nav>
{% include '_nav.html' %}
<!-- Main Content Area -->
<main class="main-content single-post">
<!-- Back Button -->
<div class="back-section">
<button onclick="goBackToFeed()" class="back-btn">← Back to Feed</button>
<a href="{{ url_for('index') }}" class="back-btn">← Back to Feed</a>
</div>
<!-- Post Content -->
<article class="post-detail">
<div class="post-header">
{% if post.url and not post.url.startswith('/') %}
<a href="{{ post.url }}" target="_blank" class="platform-badge platform-{{ post.platform }}" title="View on {{ post.platform.title() }}">
{{ post.platform.title()[:1] }}
</a>
{% else %}
<div class="platform-badge platform-{{ post.platform }}">
{{ post.platform.title()[:1] }}
</div>
{% endif %}
<div class="post-meta">
<span class="post-author">{{ post.author }}</span>
<span class="post-separator"></span>
@@ -202,6 +162,14 @@
display: flex;
align-items: center;
gap: 12px;
text-decoration: none;
color: inherit;
transition: all 0.2s ease;
}
.nav-left .logo-section:hover {
transform: scale(1.02);
text-decoration: none;
}
.nav-logo {
@@ -359,6 +327,35 @@
transform: translateY(-1px);
}
.anonymous-actions {
display: flex;
gap: 12px;
}
.login-btn, .register-btn {
padding: 8px 16px;
border-radius: 8px;
text-decoration: none;
font-size: 14px;
font-weight: 500;
transition: all 0.2s ease;
}
.login-btn {
color: #2c3e50;
border: 1px solid #e2e8f0;
}
.register-btn {
background: #4db6ac;
color: white;
}
.login-btn:hover, .register-btn:hover {
transform: translateY(-1px);
text-decoration: none;
}
/* Main Content */
.main-content.single-post {
max-width: 1200px;
@@ -661,12 +658,12 @@
<script>
function goBackToFeed() {
// Try to go back to the dashboard if possible
if (document.referrer && document.referrer.includes(window.location.origin)) {
// Try to go back in browser history first
if (window.history.length > 1 && document.referrer && document.referrer.includes(window.location.origin)) {
window.history.back();
} else {
// Fallback to dashboard
window.location.href = '/';
// Fallback to dashboard - use the proper URL
window.location.href = {{ url_for('index')|tojson }};
}
}