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:
parent
278dc928df
commit
cd463d2810
10 changed files with 418 additions and 73 deletions
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue