[templates] Cleaning up how notes are displayed

vrobbler/templates/scrobbles/scrobble_detail.html

@@ -11,6 +11,7 @@
 <div class="row">
 
 <h1>{{ object.media_obj }} - {{object.media_type}}</h1>
+<h2 class="text-muted">{{ object.local_timestamp }}</h2>
 
 {% with notes_html=object.logdata.notes_as_html %}
 {% if notes_html %}
@@ -27,8 +28,10 @@
 <p>Rate: {{object.logdata.avg_seconds_per_page}}s per page</p>
 {% endif %}
 
-<details class="mb-3">
-  <summary>Edit Log</summary>
+<button class="btn btn-secondary mb-3" type="button" data-bs-toggle="collapse" data-bs-target="#editLogForm">
+  Edit Log
+</button>
+<div class="collapse mb-3" id="editLogForm">
   <form method="post" class="needs-validation mt-3" novalidate>
     {% csrf_token %}
     {% for field in log_form %}
@@ -46,7 +49,7 @@
 
     <button type="submit" class="btn btn-primary">Save</button>
   </form>
-</details>
+</div>
 
 <h2 class="mt-4">Other Scrobbles of This Media</h2>
 {% if related_scrobbles %}