Refactor series actions layout and enhance button styles for improved usability

This commit is contained in:
Ross
2026-03-09 12:06:24 +00:00
parent 4788d56dec
commit 6c7a37ca4a
+27 -11
View File
@@ -354,20 +354,22 @@
{% partial case-series %}
</div>
</form>
<span>
<button type="button"
class="btn btn-info"
onclick="window.location.href='{% url 'atlas:user_uploads_case' case_id=case.pk %}'">
Import new uploads
</button><br />
<div class="d-flex flex-column flex-sm-row gap-2 align-items-start">
<div>
<button type="button"
class="btn btn-outline-primary btn-sm"
onclick="window.location.href='{% url 'atlas:user_uploads_case' case_id=case.pk %}'">
Import new uploads
</button>
</div>
<details class="series-actions" id="series-actions">
<summary>
<button type="button" class="btn btn-primary" title="Click to manage series" onclick="this.closest('details').open = !this.closest('details').open;">
<button type="button" class="btn btn-outline-secondary btn-sm" title="Click to manage series" onclick="this.closest('details').open = !this.closest('details').open;">
Manage Series
</button>
</summary>
<a href="{% url 'atlas:series_id_create' pk=case.pk %}">Create and add new series</a><br />
<button hx-get="{% url 'atlas:case_order_dicom' pk=case.pk %}"
<button class="btn btn-sm btn-outline-secondary mb-1" hx-get="{% url 'atlas:case_order_dicom' pk=case.pk %}"
title="order dicom by slice location"
hx-target="#series-action-results"
hx-swap="innerHTML"
@@ -375,7 +377,7 @@
>
Order dicoms by slice location
</button>
<button hx-post="{% url 'atlas:combine_series' %}"
<button class="btn btn-sm btn-outline-primary mb-1" hx-post="{% url 'atlas:combine_series' %}"
title="merge series"
hx-include="[name='series-ids']"
hx-target="#series-action-results"
@@ -384,7 +386,7 @@
>
Merge selected series
</button>
<button hx-post="{% url 'atlas:use_dates_as_descriptions' case.pk %}"
<button class="btn btn-sm btn-outline-secondary mb-1" hx-post="{% url 'atlas:use_dates_as_descriptions' case.pk %}"
title="merge series"
hx-include="[name='series-ids']"
hx-target="#series-action-results"
@@ -416,7 +418,7 @@
</div>
</details>
</span>
</div>
</div>
<div class="container">
@@ -1151,6 +1153,20 @@
padding: 8px;
margin-top: 8px;
}
.series-actions {
display: inline-block;
border: 1px solid rgba(0,0,0,0.06);
border-radius: .375rem;
padding: .5rem;
background: rgba(255,255,255,0.02);
margin-top: .5rem;
}
.series-actions summary { list-style: none; }
.series-actions summary::-webkit-details-marker { display:none; }
.series-actions .btn { vertical-align: middle; }
@media (prefers-color-scheme: dark) {
.series-actions { background: rgba(255,255,255,0.02); border-color: rgba(255,255,255,0.04); }
}
.link-buttons {
float: right;
}