Compact request activity into a live summary and modal history

This commit is contained in:
2026-09-06 22:20:33 +12:00
parent 009bb35032
commit 74c49fad5b
10 changed files with 223 additions and 71 deletions
@@ -0,0 +1,28 @@
.latest-activity.beside-download { grid-column: 7 / -1; grid-row: 2; }
.latest-activity.full-row { grid-column: 1 / -1; }
.latest-activity .latest-activity-trigger { display: grid; gap: .6rem; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; box-shadow: none; text-transform: none; }
.latest-activity-trigger:focus-visible { outline: 2px solid var(--ops-accent, #83d7f7); outline-offset: 6px; }
.latest-activity-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.latest-activity-message { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; font-size: .875rem; line-height: 1.5; font-weight: 400; }
.latest-activity-more { color: var(--ops-accent, #83d7f7); font-size: .75rem; }
.latest-activity-badge { font-size: .7rem; font-weight: 500; color: var(--ops-muted, #bbb); }
.latest-activity-badge.is-error { color: #ff9b9b; }
.latest-activity-badge.is-complete { color: #55dec0; }
.activity-dialog { position: fixed; inset: 0; margin: auto; width: min(720px, calc(100vw - 32px)); max-width: none; max-height: min(760px, calc(100dvh - 40px)); padding: 0; border: 1px solid var(--ops-border, #444); border-radius: 16px; color: var(--ops-text, #eee); background: var(--ops-surface, #1c1c1e); overflow: auto; box-shadow: 0 24px 80px #0008; }
.activity-dialog::backdrop { background: #000a; backdrop-filter: blur(5px); }
.activity-dialog-content { padding: 1.25rem; }
.activity-dialog header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.activity-dialog h2 { font-size: 1.2rem; margin: .4rem 0; }
.activity-dialog small { color: var(--ops-muted, #bbb); }
.activity-dialog-events { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: .65rem; }
.activity-dialog-events li { display: grid; grid-template-columns: 85px minmax(0, 1fr); gap: .8rem; padding: .9rem; border: 1px solid var(--ops-border, #444); border-radius: 10px; }
.activity-dialog-events strong { font-size: .8rem; }
.activity-dialog-events p { margin: .3rem 0 0; font-size: .875rem; line-height: 1.5; overflow-wrap: anywhere; }
.activity-event-state { font-size: .7rem; color: #55dec0; }
.is-error > .activity-event-state { color: #ff9b9b; }
.is-active > .activity-event-state { color: #83d7f7; }
.activity-dialog footer { display: flex; justify-content: flex-end; margin-top: 1rem; }
@media (max-width: 720px) {
.latest-activity.beside-download { grid-column: 1 / -1; grid-row: auto; }
.activity-dialog-events li { grid-template-columns: 1fr; gap: .4rem; }
}