4ea7cf7d05
- Add request hydration, submission, closing, and response handling - Wire UI events for dispatch orders, support requests, and map focus - Expand dispatcher layout for alerts, requests, and detail views
1 line
7.4 KiB
CSS
1 line
7.4 KiB
CSS
html,body{background:radial-gradient(circle at 0 0,#29455d2e,#0000 30%),linear-gradient(#090e14f5,#0f161ffa);width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{color:var(--text);font-family:var(--font)}.dispatch-shell{flex-direction:column;gap:14px;height:100%;padding:18px;display:flex}.dispatch-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.dispatch-kicker{color:var(--accent);text-transform:uppercase;letter-spacing:.1em;margin:0 0 4px;font-size:11px;font-weight:700}.dispatch-header h2{margin:0;font-size:24px;font-weight:650}.dispatch-header button,.dispatch-btn,.dispatch-select{color:var(--text);background:#181f28e6;border:1px solid #ffffff1f}.dispatch-header button,.dispatch-btn{cursor:pointer;padding:10px 14px}.dispatch-btn-secondary{background:#352827eb}.dispatch-status{color:#e9f1f8c7;min-height:20px;font-size:13px}.dispatch-status[data-type=success]{color:#79d28a}.dispatch-status[data-type=error]{color:#ff8a80}.dispatch-danger-alert{color:#ffd4cf;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(90deg,#5c1212f0,#801d1dd1);border:1px solid #ff6b6b61;padding:10px 12px;font-size:12px;font-weight:700;animation:1.35s ease-in-out infinite cad-danger-pulse}.dispatch-danger-alert.is-hidden{display:none}.dispatch-warning-alert{color:#ffe9b2;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(90deg,#59400cf0,#7d5c12d6);border:1px solid #f6c6546b;padding:10px 12px;font-size:12px;font-weight:700;animation:1.35s ease-in-out infinite cad-warning-pulse}.dispatch-warning-alert.is-hidden{display:none}.dispatch-metrics{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;display:grid}.metric-card{background:#0d131ab8;border:1px solid #ffffff14;padding:14px}.metric-label{color:#e9f1f899;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-size:11px;display:block}.metric-card strong{font-size:28px;font-weight:700}.metric-card.is-danger{background:linear-gradient(#4a1111db,#160d10eb);border-color:#ff6b6b57;animation:1.35s ease-in-out infinite cad-danger-pulse;box-shadow:inset 0 0 0 1px #ff6b6b1f}.metric-card.is-warning{background:linear-gradient(#5c410edb,#1d160beb);border-color:#f6c65457;animation:1.35s ease-in-out infinite cad-warning-pulse;box-shadow:inset 0 0 0 1px #f6c6541f}.dispatch-grid{flex:1;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:14px;min-height:0;display:grid}.dispatch-panel{background:#0b1118c7;border:1px solid #ffffff14;flex-direction:column;min-width:0;min-height:0;display:flex}.dispatch-panel-open{grid-column:span 5}.dispatch-panel-assigned{grid-column:span 7}.dispatch-panel-groups{grid-column:span 8}.dispatch-panel-activity{grid-column:span 4}.dispatch-panel-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.dispatch-panel-header h3{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin:0;font-size:13px}.dispatch-list{flex-direction:column;flex:1;gap:10px;padding:12px;display:flex;overflow:auto}.dispatch-inline-section{flex-direction:column;gap:10px;display:flex}.dispatch-inline-header{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700}.dispatch-card{background:#131a22b8;border:1px solid #ffffff0f;padding:12px}.dispatch-card-interactive{cursor:pointer}.dispatch-card-interactive:hover{background:#171f28d1;border-color:#5bbbff33}.dispatch-card-header,.dispatch-meta{justify-content:space-between;gap:10px;display:flex}.dispatch-card-header-actions{align-items:center;gap:8px;display:flex}.dispatch-card-header-main{align-items:center;gap:8px;min-width:0;display:flex}.dispatch-card-header{margin-bottom:8px}.dispatch-description{color:#f1f6fbd1;margin:0 0 10px;font-size:13px;line-height:1.45}.dispatch-meta{color:#e5edf4b3;margin-bottom:10px;font-size:12px}.dispatch-badge{color:var(--accent);text-transform:uppercase;background:#102b3db3;border:1px solid #5bbbff2e;padding:3px 7px;font-size:11px}.dispatch-alert-badge{color:#ffd8d1;text-transform:uppercase;letter-spacing:.08em;background:#5f1717e0;border:1px solid #ff6b6b70;padding:3px 7px;font-size:11px;font-weight:700}.dispatch-icon-btn{width:32px;height:32px;color:var(--text);cursor:pointer;background:#181f28eb;border:1px solid #ffffff24;padding:0}.dispatch-icon-btn:hover{background:#202a34f5}.dispatch-actions{flex-direction:column;gap:8px;display:flex}.dispatch-card.is-danger{background:linear-gradient(#451416c7,#1c1115eb);border-color:#ff6b6b57;animation:1.35s ease-in-out infinite cad-danger-pulse;box-shadow:inset 0 0 0 1px #ff6b6b1a}.dispatch-card.is-danger .dispatch-meta,.dispatch-card.is-danger .dispatch-description{color:#ffe8e4d1}.dispatch-card.is-warning{background:linear-gradient(#564011c7,#221b10eb);border-color:#f6c65457;animation:1.35s ease-in-out infinite cad-warning-pulse;box-shadow:inset 0 0 0 1px #f6c6541a}.dispatch-card.is-warning .dispatch-meta,.dispatch-card.is-warning .dispatch-description{color:#fff3d6d6}.dispatch-actions-split{margin-top:10px}.dispatch-select{width:100%;padding:9px 10px}.dispatch-textarea{width:100%;min-height:92px;color:var(--text);font:inherit;resize:vertical;box-sizing:border-box;background:#181f28eb;border:1px solid #ffffff1f;padding:10px 12px}.placeholder-message{text-align:center;color:#e9f1f899;padding:18px}.dispatch-modal{z-index:30;box-sizing:border-box;justify-content:center;align-items:center;padding:32px 24px;display:flex;position:fixed;inset:0}.dispatch-modal.is-hidden{display:none}.dispatch-modal-backdrop{background:#04080cb8;position:absolute;inset:0}.dispatch-modal-dialog{background:#0b1118fa;border:1px solid #ffffff1f;flex-direction:column;width:min(560px,100% - 48px);max-height:calc(100vh - 64px);margin:0;display:flex;position:relative;box-shadow:0 24px 64px #0000006b}.dispatch-modal-header,.dispatch-modal-actions{justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.dispatch-modal-header{border-bottom:1px solid #ffffff14}.dispatch-modal-header h3{margin:0;font-size:22px;font-weight:650}.dispatch-modal-body{flex:1;min-height:0;padding:16px;overflow:auto}.dispatch-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:18px;display:grid}.dispatch-meta-grid strong{margin-top:4px;font-size:14px;font-weight:600;display:block}.dispatch-modal-fields{gap:12px;display:grid}.dispatch-field{gap:6px;display:grid}.dispatch-field span{text-transform:uppercase;letter-spacing:.08em;color:#e9f1f8b3;font-size:12px;font-weight:650}.dispatch-modal-actions{border-top:1px solid #ffffff14;justify-content:flex-end}.dispatch-detail-block,.dispatch-detail-list{background:#131a22b8;border:1px solid #ffffff14}.dispatch-detail-block{color:#f1f6fbd1;white-space:pre-wrap;padding:12px;line-height:1.45}.dispatch-detail-list{gap:1px;display:grid;overflow:hidden}.dispatch-detail-row{background:#0e141ceb;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:12px;padding:10px 12px;display:grid}.dispatch-detail-label{color:#e9f1f8a3;text-transform:uppercase;letter-spacing:.06em;font-size:12px;font-weight:650}.dispatch-detail-value{color:#f1f6fbd6;word-break:break-word;white-space:pre-wrap;line-height:1.4}@keyframes cad-danger-pulse{0%,to{box-shadow:inset 0 0 0 1px #ff6b6b14,0 0 #ff6b6b00}50%{box-shadow:inset 0 0 0 1px #ff8d8d38,0 0 18px #ff6b6b29}}@keyframes cad-warning-pulse{0%,to{box-shadow:inset 0 0 0 1px #f6c65414,0 0 #f6c65400}50%{box-shadow:inset 0 0 0 1px #fbd47638,0 0 18px #f6c65429}} |