Enhance button labels for clarity in exam collection detail view

generic/templates/generic/exam_index.html

@@ -13,7 +13,7 @@
                     <button type="button" class="btn btn-sm btn-outline-secondary" id="clear-selection-btn">Clear</button>
                 </div>
 
-                <form id="bulk-date-form" class="mt-2" hx-post="{% url app_name|add:':exam_bulk_update' %}" hx-target="#exam-list-container" hx-include="#exam-list-container input[name='exam_ids']">
+                <form id="bulk-date-form" class="mt-2" hx-post="{% url app_name|add:':exam_bulk_update' %}" hx-target="#exam-list-container" hx-include="#exam-list-container input[name='exam_ids']" hx-indicator="#bulk-action-indicator">
                     {% for k, v in request.GET.items %}
                         <input type="hidden" name="{{ k }}" value="{{ v }}" />
                     {% endfor %}
@@ -24,13 +24,18 @@
                     </div>
                 </form>
 
-                <form id="bulk-delete-form" class="mt-2" hx-post="{% url app_name|add:':exam_bulk_delete' %}" hx-target="#exam-list-container" hx-include="#exam-list-container input[name='exam_ids']">
+                <form id="bulk-delete-form" class="mt-2" hx-post="{% url app_name|add:':exam_bulk_delete' %}" hx-target="#exam-list-container" hx-include="#exam-list-container input[name='exam_ids']" hx-indicator="#bulk-action-indicator">
                     {% for k, v in request.GET.items %}
                         <input type="hidden" name="{{ k }}" value="{{ v }}" />
                     {% endfor %}
                     {% csrf_token %}
                     <button class="btn btn-sm btn-danger" type="submit" onclick="return confirm('Delete selected exams? This action is irreversible.')">Delete selected</button>
                 </form>
+                
+                <!-- Bulk action indicator shown while HTMX requests are running -->
+                <span id="bulk-action-indicator" class="ms-2" aria-hidden="true">
+                    <span class="spinner-border spinner-border-sm text-primary" role="status" aria-hidden="true"></span>
+                </span>
             </div>
         </div>
       </div>
@@ -59,8 +64,12 @@
     #exam-list-wrapper.bulk-mode .mb-2 { cursor: pointer; }
     #exam-list-wrapper .mb-2.selected { background-color: rgba(0,123,255,0.06); }
 
-    /* Defensive: hide bulk-controls unless bulk-mode is enabled */
+        /* Defensive: hide bulk-controls unless bulk-mode is enabled */
-    #exam-list-wrapper:not(.bulk-mode) #bulk-controls { display: none !important; }
+        #exam-list-wrapper:not(.bulk-mode) #bulk-controls { display: none !important; }
+
+        /* Bulk action indicator - hidden by default, shown while HTMX request is active */
+        #bulk-action-indicator { display: none; }
+        #bulk-action-indicator.htmx-request { display: inline-block; }
     </style>
 {% endblock css %}
 

generic/templates/generic/examcollection_detail.html

@@ -32,7 +32,7 @@
 
 
             <div class="add-marker">
-            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'anatomy' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker</button>
+            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'anatomy' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker to Anatomy Exams</button>
             </div>
         {% endif %}
 
@@ -43,7 +43,7 @@
             {% endwith %}
             <a href="{% url 'longs:exam_list_collection' object.pk %}">View exam list</a>
             <div class="add-marker">
-            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'longs' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker</button>
+            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'longs' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker to Longs Exams</button>
             </div>
         {% endif %}
 
@@ -54,7 +54,7 @@
             {% endwith %}
             <a href="{% url 'rapids:exam_list_collection' object.pk %}">View exam list</a>
             <div class="add-marker">
-            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'rapids' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker</button>
+            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'rapids' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker to Rapids Exams</button>
             </div>
         {% endif %}
 
@@ -65,7 +65,7 @@
             {% endwith %}
             <a href="{% url 'shorts:exam_list_collection' object.pk %}">View exam list</a>
             <div class="add-marker">
-            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'shorts' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker</button>
+            <button class="btn-sm add-marker-button" hx-get="{% url 'generic:exam_collection_add_marker' object.pk 'shorts' %}" hx-target=".add-marker" hx-swap="innerHTML">Add marker to Shorts Exams</button>
             </div>
         {% endif %}
 
@@ -87,7 +87,7 @@
 
         <br/>
         <div id="add-user">
-        <button hx-get="{% url 'generic:exam_collection_add_author' object.pk %}" hx-target="#add-user" hx-swap="innerHTML">Add author</button>
+        <button hx-get="{% url 'generic:exam_collection_add_author' object.pk %}" hx-target="#add-user" hx-swap="innerHTML">Add author to all exams</button>
         </div>
 
     {% include 'exam_overview_js.html' %}