bramval/openslide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

restyling

Browse Source
This commit is contained in:
bramval
2026-01-23 19:16:21 +01:00
parent 138136e835
commit 1394ef6f67
12 changed files with 804 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/templates/company/playlist_detail.html
View File

@@ -1,7 +1,7 @@
{% extends "base.html" %}
{% block content %}
{# Cropper.js (used for image cropping) #}
<link rel="stylesheet" href="{{ url_for('static', filename='vendor/cropperjs/cropper.min.css') }}" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/cropperjs@1.6.2/dist/cropper.min.css" />
<style>
/* Gallery grid for playlist items */
#playlist-items.playlist-gallery,
@@ -11,9 +11,9 @@
gap: 12px;
}
.playlist-card {
background: #fff;
border: 1px solid rgba(0,0,0,.125);
border-radius: .5rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
@@ -26,13 +26,13 @@
justify-content: space-between;
gap: .5rem;
padding: .5rem .75rem;
border-bottom: 1px solid rgba(0,0,0,.08);
border-bottom: 1px solid var(--border);
}
.playlist-card .drag-handle {
width: 26px;
cursor: grab;
user-select: none;
color: #6c757d;
color: var(--muted);
flex: 0 0 auto;
}
.playlist-card .card-body {
@@ -68,7 +68,7 @@
<form method="post" action="{{ url_for('company.delete_playlist', playlist_id=playlist.id) }}" onsubmit="return confirm('Delete playlist? This will remove all items and unassign it from displays.');">
<button class="btn btn-outline-danger btn-sm" type="submit">Delete playlist</button>
</form>
<a class="btn btn-outline-secondary btn-sm" href="{{ url_for('company.dashboard') }}">Back</a>
<a class="btn btn-outline-ink btn-sm" href="{{ url_for('company.dashboard') }}">Back</a>
</div>
</div>
@@ -77,7 +77,7 @@
<h2 class="h5 mb-0">Items</h2>
<div class="text-muted small">Tip: drag items to reorder. Changes save automatically.</div>
</div>
<button class="btn btn-success" type="button" id="open-add-item">Add item</button>
<button class="btn btn-brand" type="button" id="open-add-item">Add item</button>
</div>
<div class="mt-3">
@@ -301,19 +301,17 @@
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" id="add-item-back">Back</button>
<button type="button" class="btn btn-success" id="add-item-submit">Add</button>
<button type="button" class="btn btn-outline-ink" id="add-item-back">Back</button>
<button type="button" class="btn btn-brand" id="add-item-submit">Add</button>
</div>
</div>
</div>
</div>
{# Load Cropper.js BEFORE our inline script so window.Cropper is available #}
<script src="{{ url_for('static', filename='vendor/cropperjs/cropper.min.js') }}"></script>
{# Bootstrap JS required for modal (already included via base.html CSS only) #}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/cropperjs@1.6.2/dist/cropper.min.js"></script>
<script>
<script type="module">
(function() {
// -------------------------
// Add-item modal + steps