diff --git a/operations.html b/operations.html index 9d2a502..f9c4041 100644 --- a/operations.html +++ b/operations.html @@ -20,8 +20,8 @@ --danger-dim: #3b0000; --success: #00ff88; --warning: #ffaa00; - --text: #c8f0ff; - --text-muted: #2e6a80; + --text: #e0f4ff; + --text-muted: #3a8aaa; --radius: 8px; --radius-card: 18px; --shadow: 0 0 0 1px rgba(0,245,255,0.25), 0 0 60px rgba(0,245,255,0.12), 0 28px 72px rgba(0,0,0,0.9); @@ -30,11 +30,11 @@ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; } body { - font-family: "Courier New", Courier, monospace; + font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif; background: var(--bg); color: var(--text); font-size: 14px; - line-height: 1.6; + line-height: 1.7; overflow-x: hidden; padding: 32px 0; } @@ -57,12 +57,16 @@ position: relative; z-index: 1; } + code { + font-family: "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas", monospace; + font-size: 0.9em; + } /* ── Brief Header ────────────────────────── */ .brief-header { text-align: center; margin-bottom: 32px; - padding: 32px 24px 28px; + padding: 36px 28px 28px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-card); @@ -71,7 +75,7 @@ .brief-header .date { font-size: 11px; text-transform: uppercase; - letter-spacing: 0.1em; + letter-spacing: 0.12em; color: var(--text-muted); margin-bottom: 6px; } @@ -309,6 +313,64 @@ margin-top: 4px; } + /* ── Items Needed (interactive checkboxes) ── */ + .needs-card { + background: var(--bg-card); + border: 1px solid var(--border); + border-radius: var(--radius-card); + padding: 24px; + } + .needs-card .needs-intro { + font-size: 13px; + color: var(--text-muted); + margin-bottom: 16px; + } + .needs-list { list-style: none; } + .needs-list li { + display: flex; + align-items: flex-start; + gap: 12px; + padding: 10px 0; + border-bottom: 1px solid rgba(10,48,96,0.3); + } + .needs-list li:last-child { border-bottom: none; } + .need-checkbox { + width: 20px; + height: 20px; + min-width: 20px; + border: 2px solid var(--border); + border-radius: 5px; + flex-shrink: 0; + margin-top: 2px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all 0.15s; + } + .need-checkbox:hover { + border-color: var(--accent); + } + .need-checkbox.checked { + background: var(--success); + border-color: var(--success); + } + .need-checkbox.checked::after { + content: "✓"; + color: var(--bg); + font-size: 14px; + font-weight: 700; + } + .need-item.done .need-text { + color: var(--text-muted); + text-decoration: line-through; + } + .need-text { + font-size: 14px; + color: var(--text); + line-height: 1.6; + } + /* ── Strategy ────────────────────────────── */ .strategy-grid { display: grid; @@ -454,11 +516,99 @@ .comms-alert .alert-body { color: var(--text); } .comms-alert .alert-detail { color: var(--text-muted); font-size: 11px; margin-top: 2px; } + /* ── Daily Routine (from old dashboard) ──── */ + .grid-2 { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 20px; + } + .info-card { + background: var(--bg-card); + border: 1px solid var(--border); + border-radius: var(--radius-card); + padding: 24px; + } + .info-card h3 { + font-size: 13px; + text-transform: uppercase; + letter-spacing: 0.06em; + color: var(--accent); + margin-bottom: 14px; + display: flex; + align-items: center; + gap: 8px; + } + .cron-timeline { + position: relative; + padding-left: 28px; + } + .cron-timeline::before { + content: ""; + position: absolute; + left: 8px; + top: 4px; + bottom: 4px; + width: 2px; + background: var(--border); + } + .cron-item { + position: relative; + padding: 6px 0 16px; + } + .cron-item::before { + content: ""; + position: absolute; + left: -24px; + top: 10px; + width: 12px; + height: 12px; + border-radius: 50%; + background: var(--bg-card); + border: 2px solid var(--accent); + } + .cron-item.daily-hour::before { + background: var(--accent); + box-shadow: 0 0 12px rgba(0,245,255,0.5); + } + .cron-time { + font-size: 12px; + color: var(--accent); + font-weight: 600; + } + .cron-title { + font-size: 14px; + font-weight: 600; + color: var(--text); + } + .cron-desc { + font-size: 12px; + color: var(--text-muted); + margin-top: 2px; + line-height: 1.6; + } + + /* ── Progress badge ──────────────────────── */ + .progress-tag { + display: inline-block; + padding: 2px 10px; + border-radius: 999px; + font-size: 11px; + font-weight: 600; + } + .progress-tag.done { background: rgba(0,255,136,0.12); color: var(--success); border: 1px solid rgba(0,255,136,0.25); } + .progress-tag.in-progress { background: rgba(0,245,255,0.12); color: var(--accent); border: 1px solid rgba(0,245,255,0.25); } + .progress-tag.pending { background: rgba(46,106,128,0.15); color: var(--text-muted); border: 1px solid transparent; } + .progress-tag.blocked { background: rgba(255,59,59,0.12); color: var(--danger); border: 1px solid rgba(255,59,59,0.25); } + .progress-tag.today { background: rgba(255,170,0,0.15); color: var(--warning); border: 1px solid rgba(255,170,0,0.3); } + + .highlight { color: var(--accent); } + @media (max-width: 900px) { .campaign-grid { grid-template-columns: 1fr; } .comms-grid { grid-template-columns: 1fr; } .goals-grid { grid-template-columns: repeat(2, 1fr); } .strategy-grid { grid-template-columns: 1fr; } + .grid-2 { grid-template-columns: 1fr; } } @media (max-width: 500px) { .goals-grid { grid-template-columns: 1fr; } @@ -514,6 +664,22 @@ + +
+ Click a checkbox to mark it done — saved in your browser. +
+Every day at 09:00 PYST (America/Asuncion) — 60 minutes.
+data/operations.json for review at 09:00.