feat: add archive/delete/restore sessions with header preview

2026-02-11 11:51:05 -06:00
parent b97424554c
commit 0df35b015b
5 changed files with 400 additions and 101 deletions
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -707,6 +707,138 @@ body {
    color: var(--color-primary);
 }

+/* Session List - Archive/Delete Actions */
+
+.new-session-section {
+    background: var(--color-surface);
+    border: 2px solid var(--color-border);
+    border-radius: var(--radius-lg);
+    padding: var(--space-xl);
+    margin-bottom: var(--space-xl);
+}
+
+.process-buttons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--space-md);
+    margin-top: var(--space-md);
+}
+
+.section-card {
+    margin-top: var(--space-xl);
+}
+
+.session-list-item-container {
+    display: flex;
+    align-items: stretch;
+    gap: 0; /* Remove gap */
+    margin-bottom: var(--space-sm);
+    border: 2px solid var(--color-border);
+    border-radius: var(--radius-md);
+    background: var(--color-surface);
+    overflow: hidden;
+}
+
+.session-list-item {
+    flex: 1;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background: transparent; /* Remove duplicate background */
+    border: none; /* Remove border since container has it */
+    border-radius: 0;
+    padding: var(--space-lg);
+    text-decoration: none;
+    transition: var(--transition);
+}
+
+.session-list-item:hover {
+    border-color: var(--color-primary);
+    transform: translateX(4px);
+}
+
+.session-list-info {
+    flex: 1;
+}
+
+.session-list-action {
+    display: flex;
+    align-items: center;
+}
+
+.session-list-meta {
+    display: flex;
+    gap: var(--space-sm);
+    font-size: 0.875rem;
+    color: var(--color-text-muted);
+}
+
+.checkbox-toggle {
+    display: flex;
+    align-items: center;
+    gap: var(--space-sm);
+    font-size: 0.875rem;
+    color: var(--color-text-muted);
+    cursor: pointer;
+}
+
+.checkbox-toggle input[type="checkbox"] {
+    cursor: pointer;
+}
+
+.btn-session-action {
+    background: transparent;
+    border: none;
+    border-left: 2px solid var(--color-border);
+    border-radius: 0;
+    padding: var(--space-xl);
+    cursor: pointer;
+    font-size: 2rem;
+    transition: var(--transition);
+    min-width: 80px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.btn-session-action.btn-archive:hover {
+    border-color: var(--color-warning);
+    background: rgba(255, 170, 0, 0.1);
+}
+
+.btn-session-action.btn-delete:hover {
+    border-color: var(--color-danger);
+    background: rgba(255, 51, 102, 0.1);
+}
+
+.btn-session-action.btn-unarchive:hover {
+    border-color: var(--color-primary);
+    background: rgba(0, 212, 255, 0.1);
+}
+
+.btn-session-action.btn-restore:hover {
+    border-color: var(--color-success);
+    background: rgba(0, 255, 136, 0.1);
+}
+
+.session-status-archived {
+    opacity: 1;
+}
+
+.session-status-archived .session-list-item-container {
+    border-color: var(--color-warning);
+    background: rgba(255, 170, 0, 0.08);
+}
+
+.session-status-deleted {
+    opacity: 1;
+}
+
+.session-status-deleted .session-list-item-container {
+    border-color: var(--color-danger);
+    background: rgba(255, 51, 102, 0.08);
+}
+
 /* ==================== FORM CONTAINER ==================== */

 .form-container {