feat: Add static changelog page

Adds a new static page accessible at /changelog to display site updates and changes manually.

- Creates a new Flask Blueprint in `routes/changelog.py` to handle the route logic.
- Registers the `changelog_bp` blueprint in `app.py`.
- Creates the corresponding template `templates/changelog/changelog.html` extending the base layout.
- Adds a link to the Changelog page in the main sidebar navigation in `templates/base.html`, using an archive icon for consistency.
- Applies basic card styling to the changelog page content for improved visual structure.

app.py

@@ -6,6 +6,7 @@ import jinja_partials
 from jinja2_fragments import render_block
 from decorators import validate_person, validate_topset, validate_workout
 from routes.auth import auth, get_person_by_id
+from routes.changelog import changelog_bp
 from extensions import db
 from utils import convert_str_to_date, generate_plot
 from flask_htmx import HTMX
@@ -32,8 +33,7 @@ def load_user(person_id):
     return get_person_by_id(person_id)
 
 app.register_blueprint(auth, url_prefix='/auth')
-
-
+app.register_blueprint(changelog_bp, url_prefix='/changelog')
 
 @app.after_request
 def response_minify(response):

routes/changelog.py

@@ -0,0 +1,15 @@
+from flask import Blueprint, render_template, current_app
+from flask_htmx import htmx
+from jinja2_fragments import render_block
+
+changelog_bp = Blueprint('changelog', __name__)
+
+@changelog_bp.route('/')
+def show_changelog():
+    """Renders the changelog page."""
+    template_name = 'changelog/changelog.html' # Path relative to templates/
+    if htmx:
+        # If request is from HTMX, render only the content block
+        return render_block(current_app.jinja_env, template_name, 'content')
+    # Otherwise, render the full page
+    return render_template(template_name)

templates/base.html

@@ -198,6 +198,20 @@
                                 </svg>
                                 <span class="ml-3">Settings</span>
                             </a>
+                            <a hx-get="{{ url_for('changelog.show_changelog') }}" hx-push-url="true"
+                                hx-target="#container"
+                                class="text-base text-gray-900 font-normal rounded-lg hover:bg-gray-100 group transition duration-75 flex items-center p-2 cursor-pointer {{ is_selected_page(url_for('changelog.show_changelog')) }} page-link"
+                                _="on click add .hidden to #sidebar then remove .ml-64 from #main
+                               on htmx:afterRequest go to the top of the body">
+                                <svg class="w-6 h-6 text-gray-500 group-hover:text-gray-900 transition duration-75"
+                                    fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                                    <!-- Heroicon name: solid/archive-box -->
+                                    <path fill-rule="evenodd"
+                                        d="M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V5a2 2 0 00-2-2H5zm0 2h10v7h-2l-1 1H8l-1-1H5V5z"
+                                        clip-rule="evenodd"></path>
+                                </svg>
+                                <span class="ml-3">Changelog</span>
+                            </a>
                         </div>
                     </div>
                 </div>

templates/changelog/changelog.html

@@ -0,0 +1,35 @@
+{% extends "base.html" %}
+
+{% block content %}
+<div class="p-4 md:p-6"> {# Add some overall padding for the page content area #}
+    <div class="bg-white shadow-md rounded-lg p-6"> {# Card container #}
+        <h1 class="text-2xl font-semibold text-gray-900 mb-6 border-b pb-2">Changelog</h1> {# Added bottom border to
+        heading #}
+
+        {# Container for the actual changelog entries with prose styling #}
+        <div class="prose max-w-none">
+            <p>Updates and changes to the site will be documented here, with the most recent changes listed first.</p>
+
+            <!-- Example Entry Structure -->
+            <hr class="my-6"> {# Increased margin for HR #}
+            <h2 class="text-xl font-semibold mb-2">March 30, 2025</h2> {# Reduced margin-bottom for H2 #}
+            <ul class="list-disc pl-5 space-y-1"> {# Added space between list items #}
+                <li>Added the initial changelog page.</li>
+                <li>Fixed a minor styling issue on the dashboard.</li>
+                <li>Improved visual styling of the changelog page itself.</li> {# Added an entry for this change #}
+            </ul>
+
+            {# Add more entries below, following the pattern above #}
+            <!-- 
+            <hr class="my-6">
+            <h2 class="text-xl font-semibold mb-2">March 29, 2025</h2>
+            <ul class="list-disc pl-5 space-y-1">
+                <li>Implemented feature X.</li>
+                <li>Refactored component Y.</li>
+            </ul> 
+            -->
+
+        </div>
+    </div>
+</div>
+{% endblock %}