1
Fork 0
mirror of https://github.com/thegeneralist01/archivr synced 2026-07-22 03:05:32 +02:00

feat: multi-select entries with bulk delete, tag, and collection actions (#28)

* feat: multi-select entry rows (shift/ctrl+click, mobile checkbox)
* feat: bulk-action panel for multi-selected entries
This commit is contained in:
TheGeneralist 2026-07-15 16:50:37 +02:00 committed by GitHub
parent 278dc928df
commit cd463d2810
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 418 additions and 73 deletions

View file

@ -306,6 +306,11 @@ select {
outline: 2px solid var(--accent);
outline-offset: -2px;
}
#entries-body > div.is-multi-selected {
background: #eee2d2;
outline: 2px solid var(--accent);
outline-offset: -2px;
}
.col-added { width: 162px; color: var(--muted); }
.col-title { flex: 1 1 0; min-width: 0; overflow: hidden; display: flex; align-items: center; gap: 0.42em; }
@ -322,8 +327,9 @@ select {
}
.col-url { flex: 0 0 30%; min-width: 0; overflow: hidden; }
.entry-header-row > div:first-child,
#entries-body > div > div:first-child { padding-left: 22px; }
/* col-check is first-child but hidden on desktop — target col-added directly */
.entry-header-row .col-added,
#entries-body > div .col-added { padding-left: 22px; }
.entry-header-row > div:last-child,
#entries-body > div > div:last-child { padding-right: 22px; }
@ -337,6 +343,56 @@ select {
#entries-body .is-selected .url-cell { overflow: visible; white-space: normal; }
.type-pill { display: inline-block; padding: 2px 6px; background: #d8e3df; color: #275a5f; border: 1px solid #bfd0ca; border-radius: var(--r); }
/* ── Multi-select checkbox column ───────────────────────────────────────── */
/* Hidden on desktop (pointer:fine); always visible on touch/mobile */
.col-check {
display: none;
width: 40px;
flex-shrink: 0;
align-items: center;
justify-content: center;
padding: 0 !important;
cursor: pointer;
}
.row-checkbox {
/* reset <button> UA styles */
-webkit-appearance: none;
appearance: none;
padding: 0;
border: 1.5px solid var(--line);
cursor: pointer;
/* visual checkbox */
display: block;
width: 17px;
height: 17px;
border-radius: 4px;
background: var(--paper-3);
transition: border-color .15s ease, background .15s ease;
position: relative;
flex-shrink: 0;
}
.row-checkbox.is-checked {
background: var(--accent);
border-color: var(--accent);
}
.row-checkbox.is-checked::after {
content: '';
position: absolute;
left: 4px;
top: 2px;
width: 5px;
height: 8px;
border: 2px solid #fff;
border-top: none;
border-left: none;
transform: rotate(45deg);
}
@media (pointer: coarse) {
.col-check { display: flex; }
.entry-header-row .col-added,
#entries-body > div .col-added { padding-left: 10px; }
}
/* ── Runs view (table) ───────────────────────────────────────────────────── */
#runs-view .entry-table {
border-collapse: collapse;
@ -527,6 +583,42 @@ select {
background: var(--accent-2);
}
/* ── Bulk-action panel ───────────────────────────────────────────────────── */
.bulk-panel { padding-top: 2px; }
.bulk-count {
font-size: 13px;
color: var(--muted);
margin-bottom: 22px;
}
.bulk-count-num {
font-size: 22px;
font-weight: 700;
color: var(--ink);
line-height: 1;
margin-right: 4px;
}
.bulk-coll-row {
display: flex;
align-items: center;
gap: 8px;
}
.bulk-coll-select {
flex: 1;
min-width: 0;
height: 32px;
padding: 0 8px;
border: 1px solid var(--line);
border-radius: var(--r);
background: var(--field);
color: var(--ink);
font-size: 13px;
cursor: pointer;
outline: none;
transition: border-color .15s ease;
}
.bulk-coll-select:focus { border-color: var(--accent); }
.tag-add-btn:disabled { opacity: 0.45; cursor: default; }
/* ── Rail delete zone ───────────────────────────────────────────────────── */
.rail-delete-zone {
margin-top: 24px;