nessi
792f85fc8b
Add `DEVIN_MODE` configuration supporting `enterprise` (default) and `organization_sessions` modes. Organization sessions mode uses `/v3/organizations/{org_id}/sessions` API with `ViewOrgSessions` permission, suitable for non-Enterprise organizations. Sums session ACUs consumed within configurable rolling window (1-365 days via `DEVIN_SESSION_WINDOW_DAYS`). Mode does not show quota, percentage, credit, or reset fields as these are unav
35 lines
4.8 KiB
CSS
35 lines
4.8 KiB
CSS
:root {
|
|
color-scheme: dark;
|
|
--bg: #080c14;
|
|
--panel: #111824;
|
|
--panel-light: #172131;
|
|
--line: #26354a;
|
|
--text: #edf4ff;
|
|
--muted: #8493a8;
|
|
--green: #49e39b;
|
|
--amber: #f2bf63;
|
|
--red: #ff687e;
|
|
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
}
|
|
* { box-sizing: border-box; }
|
|
body { margin: 0; min-height: 100vh; color: var(--text); background: radial-gradient(circle at 85% 0%, #14233b 0, var(--bg) 42%); }
|
|
.shell { max-width: 1760px; min-height: 100vh; margin: auto; padding: 42px 54px 30px; display: flex; flex-direction: column; }
|
|
.topbar { display: grid; grid-template-columns: 1fr auto auto; align-items: end; gap: 30px; padding-bottom: 34px; border-bottom: 1px solid var(--line); }
|
|
.eyebrow { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .18em; }
|
|
h1, h2, p { margin: 0; } h1 { font-size: clamp(32px, 4vw, 58px); letter-spacing: -.06em; line-height: .94; } h2 { margin-top: 8px; font-size: 26px; letter-spacing: .08em; }
|
|
.header-status { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; white-space: nowrap; }
|
|
#connection-state { color: var(--green); font-weight: 700; letter-spacing: .12em; font-size: 11px; } #clock { color: var(--text); font-variant-numeric: tabular-nums; margin-left: 16px; } #last-update { margin-left: 10px; }
|
|
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); } .live-dot.offline { background: var(--red); box-shadow: 0 0 14px var(--red); }
|
|
.demo-badge { padding: 9px 13px; border: 1px solid #7d6434; background: #392d14; color: #f3c86b; border-radius: 5px; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
|
|
.cards { flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding-top: 28px; }
|
|
.provider-card { position: relative; min-width: 0; padding: 27px 29px; background: linear-gradient(145deg, rgba(24,35,52,.97), rgba(13,19,30,.97)); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 20px 50px rgba(0,0,0,.22); }
|
|
.card-heading { display: flex; justify-content: space-between; align-items: start; padding-bottom: 20px; border-bottom: 1px solid var(--line); } .status-pill { color: var(--green); border: 1px solid currentColor; padding: 5px 8px; border-radius: 4px; font-size: 10px; font-weight: 800; letter-spacing: .12em; } .status-pill.error { color: var(--red); } .status-pill.disabled { color: var(--muted); }
|
|
.limits { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 14px; padding-top: 20px; align-content: start; } .limit { min-width: 0; padding: 17px; border: 1px solid #25344a; border-radius: 8px; background: rgba(11,17,27,.62); }
|
|
.limit-top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; } .limit-name { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; } .remaining { color: var(--green); font-size: 30px; font-weight: 750; letter-spacing: -.05em; white-space: nowrap; } .remaining.amber { color: var(--amber); } .remaining.red { color: var(--red); }
|
|
.bar { height: 7px; margin: 15px 0 11px; overflow: hidden; border-radius: 6px; background: #263447; } .bar-fill { height: 100%; width: 0; border-radius: inherit; background: var(--green); transition: width .55s ease; } .bar-fill.amber { background: var(--amber); } .bar-fill.red { background: var(--red); }
|
|
.meta { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 12px; } .amount { color: var(--text); } .meta.standalone { display: block; margin-top: 18px; } .meta.standalone .amount { display: block; color: var(--text); font-size: clamp(24px, 2.2vw, 34px); font-weight: 750; letter-spacing: -.04em; } .reset { margin-top: 14px; color: #b5c1d1; font-size: 12px; font-variant-numeric: tabular-nums; }
|
|
.notice { padding: 22px 14px; color: var(--muted); font-size: 14px; } .notice strong { display: block; color: var(--text); margin-bottom: 6px; } .overlay { margin: 18px 0 0; padding: 13px 15px; color: #ffc4ca; border-left: 2px solid var(--red); background: rgba(130,34,52,.15); font-size: 13px; } .overlay small { display: block; margin-top: 5px; color: var(--muted); }
|
|
@media (max-width: 900px) { .shell { padding: 28px 20px; } .topbar { grid-template-columns: 1fr auto; gap: 18px; } .header-status { grid-column: 1 / -1; grid-row: 2; } .demo-badge { grid-column: 2; grid-row: 1; } .cards { grid-template-columns: 1fr; } }
|
|
@media (max-width: 520px) { .shell { padding: 20px 14px; } .provider-card { padding: 21px 17px; } .limits { grid-template-columns: 1fr; } #last-update { display: none; } }
|
|
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }
|