@stacksjs/ts-cloud 0.7.74 → 0.7.76

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/dist/bin/cli.js +5 -5
  2. package/dist/{chunk-jds7h6zy.js → chunk-0pn5yzev.js} +3 -3
  3. package/dist/{chunk-1p8jah5z.js → chunk-wwv7rmmh.js} +1 -1
  4. package/dist/deploy/index.js +2 -2
  5. package/dist/drivers/index.js +1 -1
  6. package/dist/index.js +2 -2
  7. package/dist/ui/access-denied.html +2 -2
  8. package/dist/ui/account/automation.html +3 -3
  9. package/dist/ui/account/security.html +2 -2
  10. package/dist/ui/applications/compose.html +4 -4
  11. package/dist/ui/applications/new.html +2 -2
  12. package/dist/ui/data/backups.html +4 -4
  13. package/dist/ui/data/services.html +4 -4
  14. package/dist/ui/data/volumes.html +4 -4
  15. package/dist/ui/index.html +4 -4
  16. package/dist/ui/integrations.html +2 -2
  17. package/dist/ui/operations/alerts.html +4 -4
  18. package/dist/ui/operations/configuration.html +4 -4
  19. package/dist/ui/operations/jobs.html +4 -4
  20. package/dist/ui/operations/maintenance.html +4 -4
  21. package/dist/ui/operations/observability.html +4 -4
  22. package/dist/ui/operations/previews.html +4 -4
  23. package/dist/ui/operations/queue.html +4 -4
  24. package/dist/ui/operations/regions.html +4 -4
  25. package/dist/ui/operations/releases.html +4 -4
  26. package/dist/ui/operations/workloads.html +4 -4
  27. package/dist/ui/security.html +2 -2
  28. package/dist/ui/server/actions.html +3 -3
  29. package/dist/ui/server/capacity.html +4 -4
  30. package/dist/ui/server/database.html +4 -4
  31. package/dist/ui/server/deployments.html +4 -4
  32. package/dist/ui/server/diagnostics.html +2 -2
  33. package/dist/ui/server/firewall.html +4 -4
  34. package/dist/ui/server/fleet.html +4 -4
  35. package/dist/ui/server/logs.html +4 -4
  36. package/dist/ui/server/metrics.html +4 -4
  37. package/dist/ui/server/security.html +2 -2
  38. package/dist/ui/server/services.html +2 -2
  39. package/dist/ui/server/sites.html +4 -4
  40. package/dist/ui/server/ssh-keys.html +4 -4
  41. package/dist/ui/server/team.html +3 -3
  42. package/dist/ui/server/terminal.html +2 -2
  43. package/dist/ui/serverless/alarms.html +4 -4
  44. package/dist/ui/serverless/assets.html +2 -2
  45. package/dist/ui/serverless/cost.html +2 -2
  46. package/dist/ui/serverless/data.html +4 -4
  47. package/dist/ui/serverless/deployments.html +2 -2
  48. package/dist/ui/serverless/firewall.html +2 -2
  49. package/dist/ui/serverless/functions.html +3 -3
  50. package/dist/ui/serverless/logs.html +4 -4
  51. package/dist/ui/serverless/metrics.html +2 -2
  52. package/dist/ui/serverless/queues.html +4 -4
  53. package/dist/ui/serverless/secrets.html +4 -4
  54. package/dist/ui/serverless/traces.html +4 -4
  55. package/dist/ui/serverless.html +4 -4
  56. package/package.json +3 -3
package/dist/ui/serverless/deployments.html CHANGED
@@ -80,7 +80,7 @@ var { opOutput, opShown, pending, typed, busy, confirmTok, confirmVerb, confirmD
80
80
  });
81
81
 
82
82
  return { opOutput, opShown, pending, typed, busy, confirmTok, confirmVerb, confirmDanger, confirmLabel, canRun, askOp, cancelOp, runOp };
83
- })</script> <!DOCTYPE html><html lang="en" data-theme="dark"><head><meta name="title" content="stx Project"><meta name="description" content="A website built with stx templating engine"><meta property="og:title" content="stx Project"><meta property="og:description" content="A website built with stx templating engine"><meta property="og:type" content="website"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="stx Project"><meta name="twitter:description" content="A website built with stx templating engine"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ts-cloud · Deployments</title><link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='3' y='3' width='26' height='26' rx='8' fill='%235a8be0'/%3E%3C/svg%3E"><link rel="preconnect" href="https://fonts.googleapis.com"><link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"><style> :root { --bg: #0a0e15; --bg2: #0b0f18; --panel: rgba(255,255,255,0.03); --panel-br: rgba(255,255,255,0.072); --txt: #e9edf5; --txt2: #94a1b8; --txt3: #5a6577; --accent: #5a8be0; --accent-dim: rgba(90,139,224,0.14); --accent-ink: #061019; --ok: #35d19b; --okbg: rgba(53,209,155,0.11); --bad: #f0736e; --badbg: rgba(240,115,110,0.11); --warn: #edb949; --warnbg: rgba(237,185,73,0.11); --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace; } * { box-sizing: border-box; margin: 0; padding: 0; } html { background: var(--bg); min-height: 100%; } body { font-family: 'Inter', system-ui, sans-serif; color: var(--txt); min-height: 100vh; /* One calm accent wash, no AI blue-purple mesh. */ background: radial-gradient(900px 460px at 88% -8%, rgba(90,139,224,0.06), transparent 62%), linear-gradient(175deg, var(--bg), var(--bg2)); -webkit-font-smoothing: antialiased; font-feature-settings: 'tnum' 1, 'ss01' 1; padding-left: 248px; overflow-x: hidden; } /* Tabular monospaced numerals wherever a value is read at a glance (density 7). */ .stat, .gauge .pct, .vital .vval, .health-hero .hmeta .item b, .kv > b, td.mono { font-variant-numeric: tabular-nums; } .stat, .gauge .pct { font-family: var(--mono); letter-spacing: -0.03em; } a { color: inherit; text-decoration: none; } .wrap { max-width: 1240px; margin: 0 auto; padding: 0 28px 64px; min-width: 0; } .skip-link { position: fixed; z-index: 100; top: 8px; left: 264px; transform: translateY(-150%); background: var(--accent); color: var(--accent-ink); border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 800; } .skip-link:focus { transform: translateY(0); } .app-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: 248px; display: flex; flex-direction: column; background: rgba(9,13,20,0.96); border-right: 1px solid var(--panel-br); backdrop-filter: blur(18px); padding: 18px 14px 14px; overflow-y: auto; overscroll-behavior: contain; } .brand { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 8px; font-weight: 800; font-size: 17px; letter-spacing: -0.02em; } .brand .dot { width: 20px; height: 20px; border-radius: 6px; background: var(--accent); box-shadow: inset 0 1px 0 rgba(255,255,255,0.35); } .sidebar-context { display: grid; gap: 3px; margin-top: 16px; padding: 12px; border: 1px solid var(--panel-br); border-radius: 12px; background: rgba(255,255,255,0.025); } .sidebar-context strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .context-label { color: var(--txt3); font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; } .context-detail { color: var(--txt3); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .environment-picker { display: grid; gap: 6px; margin: 14px 4px 4px; } .environment-picker details { position: relative; } .environment-current { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 9px; cursor: pointer; list-style: none; border: 1px solid var(--panel-br); border-radius: 10px; background: rgba(255,255,255,0.03); } .environment-current::-webkit-details-marker { display: none; } .environment-current::after { content: '⌄'; margin-left: auto; color: var(--txt3); } .environment-current > span { min-width: 36px; padding: 3px 5px; border-radius: 5px; background: var(--accent-dim); color: var(--accent); font: 800 9px var(--mono); text-align: center; letter-spacing: .06em; } .environment-current.production > span { background: var(--warnbg); color: var(--warn); } .environment-current strong { font-size: 12px; text-transform: capitalize; } .environment-menu { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; right: 0; padding: 5px; border: 1px solid var(--panel-br); border-radius: 11px; background: #111722; box-shadow: 0 14px 36px rgba(0,0,0,.4); } .environment-menu a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px; border-radius: 7px; font-size: 12px; text-transform: capitalize; } .environment-menu a:hover, .environment-menu a.active { background: var(--accent-dim); color: var(--accent); } .environment-menu small { color: var(--txt3); font-size: 9px; text-transform: uppercase; letter-spacing: .05em; } .command-trigger { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: calc(100% - 8px); margin: 12px 4px 0; padding: 8px 9px; border: 1px solid var(--panel-br); border-radius: 9px; background: rgba(255,255,255,.025); color: var(--txt2); font: 600 12px inherit; text-align: left; } .command-trigger:hover { border-color: rgba(90,139,224,.35); color: var(--txt); } .command-trigger kbd { padding: 2px 5px; border: 1px solid var(--panel-br); border-radius: 5px; background: rgba(255,255,255,.04); color: var(--txt3); font: 600 10px var(--mono); } .nav-groups { display: grid; gap: 18px; margin-top: 20px; } .nav-group { display: grid; gap: 2px; } .nav-group h2 { padding: 0 10px 5px; color: var(--txt3); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; } .nav-group a { position: relative; display: flex; align-items: center; min-height: 34px; padding: 7px 10px; border-radius: 8px; color: var(--txt2); font-size: 12.5px; font-weight: 600; } .nav-group a:hover { color: var(--txt); background: rgba(255,255,255,.035); } .nav-group a.active { color: var(--accent); background: var(--accent-dim); } .nav-group a.active::before { content: ''; position: absolute; left: -4px; width: 3px; height: 16px; border-radius: 4px; background: var(--accent); } .context-bar { position: sticky; top: 0; z-index: 20; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 28px; border-bottom: 1px solid var(--panel-br); background: rgba(10,14,21,.78); backdrop-filter: blur(14px); } .context-path { display: flex; align-items: center; gap: 12px; min-width: 0; overflow: hidden; } .context-breadcrumb { display: flex; align-items: center; gap: 8px; min-width: 0; color: var(--txt2); font-size: 12px; } .context-breadcrumb i { color: var(--txt3); font-style: normal; } .context-breadcrumb strong { color: var(--txt); text-transform: capitalize; } .context-breadcrumb small { margin-left: 7px; padding-left: 14px; border-left: 1px solid var(--panel-br); color: var(--txt3); white-space: nowrap; } .context-filters { display: flex; align-items: center; gap: 5px; min-width: 0; overflow-x: auto; } .filter-chip { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(90,139,224,.25); border-radius: 999px; background: var(--accent-dim); color: var(--accent); font: 700 10px var(--mono); } .filter-chip:hover { border-color: var(--accent); } .scope-safety { flex: 0 0 auto; padding: 4px 9px; border: 1px solid rgba(90,139,224,.25); border-radius: 999px; background: var(--accent-dim); color: var(--accent); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; } .scope-safety.production { border-color: rgba(237,185,73,.3); background: var(--warnbg); color: var(--warn); } .env { padding: 4px 10px; border-radius: 999px; background: var(--okbg); color: var(--ok); font-weight: 600; font-size: 12px; } .signout { display: flex; margin-top: auto; padding: 18px 4px 0; } .signout button { width: 100%; appearance: none; border: 1px solid var(--panel-br); background: rgba(255,255,255,0.035); color: var(--txt2); border-radius: 8px; padding: 5px 11px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: color .12s, border-color .12s; } .signout button:hover { color: var(--txt); border-color: rgba(255,255,255,0.16); } .nav-toggle-button, .nav-scrim { display: none; } .nav-toggle-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } .state-page { min-height: calc(100vh - 48px); display: grid; align-content: center; justify-items: start; gap: 12px; max-width: 620px; padding: 48px 0; } .state-page .state-code { color: var(--accent); font: 800 12px var(--mono); text-transform: uppercase; letter-spacing: .12em; } .state-page h1 { font-size: clamp(28px, 5vw, 48px); letter-spacing: -.035em; } .state-page p { color: var(--txt2); max-width: 560px; font-size: 15px; line-height: 1.65; } .state-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; } .auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; } .auth-card { width: min(460px, 100%); display: grid; gap: 24px; padding: 28px; border: 1px solid var(--panel-br); border-radius: 18px; background: var(--panel); box-shadow: 0 24px 70px rgba(0,0,0,.35); } .auth-card .brand { padding: 0; } .auth-card h1 { margin-top: 7px; font-size: 28px; } .auth-card p { margin-top: 6px; color: var(--txt2); line-height: 1.55; } .auth-form { display: grid; gap: 14px; } .auth-form .field-block { display: grid; gap: 6px; } .auth-form .field-block input { width: 100%; } .auth-form small { color: var(--txt3); font-size: 11px; } .auth-form .btn { justify-self: stretch; } .auth-status { min-height: 20px; color: var(--txt2); font-size: 12px; } .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; } .command-palette { width: min(660px, calc(100vw - 24px)); max-height: min(620px, calc(100vh - 40px)); margin: 9vh auto 0; padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 16px; background: #0f151f; color: var(--txt); box-shadow: 0 28px 90px rgba(0,0,0,.58); } .command-palette::backdrop { background: rgba(2,5,9,.72); backdrop-filter: blur(5px); } .command-search { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--panel-br); } .command-search > span { color: var(--txt3); font-size: 22px; } .command-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--txt); font: 500 15px inherit; } .command-search input::placeholder { color: var(--txt3); } .command-close { padding: 4px 7px; border: 1px solid var(--panel-br); border-radius: 6px; color: var(--txt3); font: 700 10px var(--mono); } .command-status { padding: 12px 16px; color: var(--txt3); font-size: 12px; } .saved-views { display: grid; gap: 8px; padding: 0 14px 12px; border-bottom: 1px solid var(--panel-br); } .saved-views-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .saved-views h3, .command-group > h3 { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .08em; } .save-view-form { display: flex; align-items: center; gap: 6px; } .save-view-form input { width: 150px; min-width: 0; padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; background: rgba(255,255,255,.035); color: var(--txt); font-size: 11px; } .save-view-form button, .saved-view-row button { padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; color: var(--txt2); font-size: 10px; } .saved-view-list { display: flex; flex-wrap: wrap; gap: 6px; } .saved-view-row { display: inline-flex; align-items: center; overflow: hidden; border: 1px solid var(--panel-br); border-radius: 8px; } .saved-view-row a { padding: 5px 8px; color: var(--txt2); font-size: 11px; } .saved-view-row button { border: 0; border-left: 1px solid var(--panel-br); border-radius: 0; color: var(--txt3); } .saved-views.empty .saved-view-list::after { content: 'No saved views yet'; color: var(--txt3); font-size: 11px; } .tag-result-form { display: grid; grid-template-columns: 1fr 150px 32px auto; align-items: center; gap: 7px; padding: 9px 14px; border-bottom: 1px solid var(--panel-br); } .tag-result-form label { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .08em; } .tag-result-form input:not(.tag-color) { min-width: 0; padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; background: rgba(255,255,255,.035); color: var(--txt); font-size: 11px; } .tag-result-form .tag-color { width: 32px; height: 27px; padding: 2px; border: 1px solid var(--panel-br); border-radius: 7px; background: transparent; } .tag-result-form button { padding: 5px 8px; border: 1px solid var(--panel-br); border-radius: 7px; color: var(--txt2); font-size: 10px; } .tag-result-form button:disabled { opacity: .45; cursor: not-allowed; } .command-results { display: grid; gap: 3px; max-height: 430px; overflow-y: auto; padding: 0 7px 10px; } .command-group { display: grid; gap: 3px; } .command-group > h3 { padding: 8px 10px 2px; } .command-result-row { display: grid; grid-template-columns: minmax(0, 1fr) 36px; align-items: center; } .command-results a { display: grid; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; min-width: 0; padding: 10px; border-radius: 9px; } .command-results a:hover, .command-results a.selected { background: var(--accent-dim); } .favorite-result { display: grid; place-content: center; width: 30px; height: 30px; border-radius: 8px; color: var(--txt3); font-size: 17px; } .favorite-result:hover, .favorite-result.active { color: var(--warn); background: var(--warnbg); } .command-type { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .07em; } .command-copy { display: grid; gap: 3px; min-width: 0; } .command-copy strong, .command-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .command-copy strong { font-size: 13px; } .command-copy small { color: var(--txt3); font-size: 11px; } .command-copy mark { border-radius: 2px; background: var(--warnbg); color: var(--warn); } .command-palette footer { display: flex; flex-wrap: wrap; gap: 14px; padding: 9px 14px; border-top: 1px solid var(--panel-br); color: var(--txt3); font-size: 10px; } @media (max-width: 820px) { body { padding-left: 0; } .wrap { padding-left: 16px; padding-right: 16px; } .context-bar { padding: 8px 14px 8px 58px; } .context-breadcrumb small { display: none; } .nav-toggle-button { position: fixed; top: 9px; left: 12px; z-index: 50; width: 36px; height: 30px; display: grid; place-content: center; gap: 4px; border: 1px solid var(--panel-br); border-radius: 8px; background: #111722; cursor: pointer; } .nav-toggle-button span { display: block; width: 15px; height: 1px; background: var(--txt2); } .app-sidebar { transform: translateX(-102%); transition: transform .18s ease; box-shadow: 18px 0 48px rgba(0,0,0,.45); } .nav-scrim { position: fixed; inset: 0; z-index: 25; background: rgba(0,0,0,.58); } body.nav-open .nav-scrim { display: block; } body.nav-open .app-sidebar { transform: translateX(0); } .skip-link { left: 56px; } } @media (max-width: 420px) { .context-filters { display: none; } .saved-views-heading { align-items: stretch; flex-direction: column; } .save-view-form input { width: auto; flex: 1; } .tag-result-form { grid-template-columns: 1fr 32px auto; } .tag-result-form label { grid-column: 1 / -1; } .scope-safety { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } header.page { padding-top: 22px; } header.page h1 { font-size: 23px; } .cards, .cards-3, .cards-2, .vitals { grid-template-columns: 1fr; } .panel { padding: 15px; } table { display: block; overflow-x: auto; } } header.page { padding: 30px 0 22px; display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; } header.page h1 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; } header.page p { color: var(--txt2); margin-top: 4px; font-size: 14px; } .server-line { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; color: var(--txt2); font-size: 13px; } .server-line b { color: var(--txt); font-weight: 600; } .header-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; } /* Breadcrumb / back link for drill-down pages */ .crumbs { display: flex; align-items: center; gap: 8px; padding-top: 26px; font-size: 13px; color: var(--txt3); } .crumbs a { color: var(--txt2); } .crumbs a:hover { color: var(--accent); } .crumbs .sep { color: var(--txt3); } .grid { display: grid; gap: 16px; } .cards { grid-template-columns: repeat(4, 1fr); } .cards-3 { grid-template-columns: repeat(3, 1fr); } .cards-2 { grid-template-columns: repeat(2, 1fr); } @media (max-width: 880px) { .cards, .cards-3, .cards-2 { grid-template-columns: repeat(2, 1fr); } } .panel { background: var(--panel); border: 1px solid var(--panel-br); border-radius: 16px; padding: 18px; backdrop-filter: blur(6px); } a.panel { display: block; transition: border-color .15s, transform .15s; } a.panel:hover { border-color: rgba(90,139,224,0.5); transform: translateY(-1px); } .panel h3 { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--txt3); font-weight: 700; } .stat { font-size: 28px; font-weight: 800; margin-top: 8px; letter-spacing: -0.02em; } .stat small { font-size: 14px; color: var(--txt2); font-weight: 500; } .bar { height: 7px; border-radius: 999px; background: rgba(255,255,255,0.07); margin-top: 12px; overflow: hidden; } .bar > i { display: block; height: 100%; border-radius: 999px; background: var(--accent); } .section { margin-top: 30px; } .section > h2 { font-size: 15px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; } .section > h2 .more { margin-left: auto; display: inline-flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 600; color: var(--accent); } .section > h2 .more a { color: var(--accent); } .cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; } @media (max-width: 880px) { .cols { grid-template-columns: 1fr; } } table { width: 100%; border-collapse: collapse; font-size: 14px; } th { text-align: left; color: var(--txt3); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; padding: 0 12px 10px; } td { padding: 12px; border-top: 1px solid rgba(255,255,255,0.05); } tr:hover td { background: rgba(255,255,255,0.02); } .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: var(--txt2); } .pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; } .pill::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; } .pill.ok { background: var(--okbg); color: var(--ok); } .pill.bad { background: var(--badbg); color: var(--bad); } .pill.warn { background: var(--warnbg); color: var(--warn); } .tag { padding: 2px 8px; border-radius: 6px; background: rgba(90,139,224,0.12); color: var(--accent); font-size: 12px; font-weight: 600; } .kv { display: flex; justify-content: space-between; padding: 9px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; gap: 16px; } .kv:first-of-type { border-top: 0; } .kv > span { color: var(--txt2); white-space: nowrap; } .kv > b { text-align: right; word-break: break-all; } .deploy { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .deploy:first-of-type { border-top: 0; } .deploy .when { margin-left: auto; color: var(--txt3); font-size: 12px; } .btn { background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 10px; padding: 9px 16px; font-weight: 700; font-size: 13.5px; cursor: pointer; font-family: inherit; white-space: nowrap; transition: filter .12s, transform .12s; } .btn:hover { filter: brightness(1.06); } .btn:active { transform: translateY(1px); } .btn.ghost { background: rgba(255,255,255,0.045); border: 1px solid var(--panel-br); color: var(--txt); } .btn.ghost:hover { background: rgba(255,255,255,0.075); filter: none; } .btn.danger { background: transparent; border: 1px solid var(--badbg); color: var(--bad); } .btn.danger:hover { background: var(--badbg); filter: none; } .btn.sm { padding: 6px 12px; font-size: 12px; } .data-item { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .data-item:first-of-type { border-top: 0; } .data-item .detail { color: var(--txt3); font-size: 12px; } .data-item .st { margin-left: auto; } .secret { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .secret:first-of-type { border-top: 0; } .secret .val { margin-left: auto; color: var(--txt3); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; letter-spacing: 2px; } /* Drill-down extras */ .spark { display: flex; align-items: flex-end; gap: 3px; height: 48px; margin-top: 12px; } .spark > i { flex: 1; background: linear-gradient(180deg, var(--accent), rgba(90,139,224,0.25)); border-radius: 3px 3px 0 0; min-height: 2px; } .logs { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.7; color: var(--txt2); max-height: 360px; overflow: auto; } .logs .ts { color: var(--txt3); } .logs .err { color: var(--bad); } .log-list { display: grid; gap: 10px; max-height: 680px; overflow: auto; padding-right: 4px; } .log-row { border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 12px 14px; } .log-row.warn { border-color: rgba(251,191,36,0.18); background: rgba(251,191,36,0.04); } .log-row.error { border-color: rgba(248,113,113,0.2); background: rgba(248,113,113,0.045); } .log-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; color: var(--txt3); font-size: 12px; margin-bottom: 9px; } .log-row pre { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--txt2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.55; } .timeline { display: grid; gap: 11px; } .timeline-row { display: grid; grid-template-columns: 92px 1fr auto; gap: 13px; align-items: start; border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 12px 14px; } .timeline-row .type { color: var(--txt3); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.07em; } .timeline-row .title { font-weight: 800; } .timeline-row .detail { color: var(--txt2); font-size: 13px; margin-top: 3px; overflow-wrap: anywhere; } .timeline-row .when { color: var(--txt3); font-size: 12px; white-space: nowrap; } .check-list { display: grid; gap: 10px; } .check { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; padding: 13px 0; border-top: 1px solid rgba(255,255,255,0.05); } .check:first-child { border-top: 0; padding-top: 0; } .check .mark { width: 12px; height: 12px; border-radius: 50%; margin-top: 4px; background: var(--ok); box-shadow: 0 0 0 4px var(--okbg); } .check.warn .mark { background: var(--warn); box-shadow: 0 0 0 4px var(--warnbg); } .check.fail .mark { background: var(--bad); box-shadow: 0 0 0 4px var(--badbg); } .check .name { font-weight: 800; } .check .detail { color: var(--txt2); font-size: 13px; margin-top: 3px; line-height: 1.45; } .port-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; } @media (max-width: 880px) { .port-grid { grid-template-columns: 1fr; } } .port-card { border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 13px 14px; min-width: 0; } .port-card .top { display: flex; align-items: center; gap: 8px; justify-content: space-between; } .port-card .listen { margin-top: 8px; font-weight: 800; overflow-wrap: anywhere; } .port-card .proc { color: var(--txt3); font-size: 12px; margin-top: 5px; overflow-wrap: anywhere; } .action-runner { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .action-runner select { background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 8px 10px; color: var(--txt); font-family: inherit; font-size: 13px; min-width: 150px; } .action-output { margin-top: 12px; white-space: pre-wrap; overflow: auto; max-height: 260px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.07); background: rgba(0,0,0,0.22); padding: 12px; color: var(--txt2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.5; } .op-confirm { margin-top: 14px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .op-confirm-input { flex: 0 0 200px; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 8px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .op-confirm-input:focus { outline: none; border-color: var(--accent); } .note { color: var(--txt3); font-size: 12px; margin-top: 10px; } .row-actions { display: flex; gap: 8px; } .field { display: flex; gap: 8px; margin-top: 12px; } .field input { flex: 1; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 9px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .field input:focus { outline: none; border-color: var(--accent); } .empty { display: grid; place-items: center; gap: 6px; min-height: 132px; text-align: center; color: var(--txt3); border: 1px dashed rgba(255,255,255,0.12); border-radius: 14px; background: rgba(255,255,255,0.025); padding: 22px; } .empty strong { color: var(--txt); font-size: 14px; } .empty span { max-width: 540px; font-size: 13px; line-height: 1.5; } .empty.compact { min-height: 74px; margin-top: 10px; padding: 14px; } .form-grid { display: grid; grid-template-columns: minmax(180px, 0.7fr) minmax(280px, 1.4fr); gap: 14px; align-items: end; } .field-block { display: flex; flex-direction: column; gap: 7px; } .field-block.wide { grid-column: 1 / -1; } .field-block label, .select-filter span { color: var(--txt3); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.07em; } .field-block input, .field-block textarea, .select-filter select { width: 100%; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 10px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .field-block textarea { resize: vertical; min-height: 92px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.5; } .field-block input:focus, .field-block textarea:focus, .select-filter select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(90,139,224,0.12); } .form-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .msg { color: var(--txt3); font-size: 13px; } .msg.ok { color: var(--ok); } .msg.bad { color: var(--bad); } .table-actions { text-align: right; white-space: nowrap; } .filters { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin: 16px 0; } .segmented { display: inline-flex; padding: 4px; border: 1px solid var(--panel-br); background: rgba(255,255,255,0.035); border-radius: 12px; gap: 2px; } .segmented button { appearance: none; border: 0; background: transparent; color: var(--txt2); border-radius: 9px; padding: 7px 12px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; } .segmented button.active { background: rgba(90,139,224,0.18); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(90,139,224,0.18); } .select-filter { display: inline-flex; align-items: center; gap: 8px; } .select-filter select { min-width: 150px; padding: 8px 10px; } @media (max-width: 760px) { .form-grid { grid-template-columns: 1fr; } .filters { align-items: stretch; } .segmented, .select-filter, .select-filter select { width: 100%; } .segmented button { flex: 1; } } /* Honest action affordance: a copyable CLI command (static dashboard has no backend - the buttons would POST nowhere, so we show the exact command). */ .cmd { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 10px; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: var(--txt); white-space: nowrap; } .cmd::before { content: '$'; color: var(--txt3); } .cmd.accent { border-color: rgba(90,139,224,0.4); color: var(--accent); } .cmds { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } /* Server dashboard components */ .svc { display: flex; flex-wrap: wrap; gap: 10px; } .svc .item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,0.03); border: 1px solid var(--panel-br); font-size: 13px; font-weight: 500; } .key { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .key:first-of-type { border-top: 0; } .key .fp { margin-left: auto; color: var(--txt3); font-size: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; } .chart-panel { overflow: hidden; } .chart-panel.subtle { padding: 0; margin-bottom: 14px; background: transparent; border: 0; } svg.chart { display: block; width: 100%; height: auto; min-height: 150px; } svg.chart .chart-shell { fill: rgba(255,255,255,0.025); stroke: rgba(255,255,255,0.07); } svg.chart .chart-grid { stroke: rgba(255,255,255,0.08); stroke-width: 1; } svg.chart .chart-axis, svg.chart .chart-label { fill: var(--txt3); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } svg.chart .chart-value { fill: var(--txt); font-size: 12px; font-weight: 800; } svg.chart .chart-empty-title { fill: var(--txt); font-size: 15px; font-weight: 800; } svg.chart .chart-empty-sub { fill: var(--txt3); font-size: 12px; } svg.chart .bar-mark.ok rect { fill: var(--ok); opacity: 0.85; } svg.chart .bar-mark.warn rect { fill: var(--warn); opacity: 0.88; } svg.chart .bar-mark.bad rect { fill: var(--bad); opacity: 0.9; } svg.chart .spark-path { fill: none; stroke: var(--accent); stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; } svg.chart circle.ok { fill: var(--ok); } svg.chart circle.bad { fill: var(--bad); } svg.chart.disabled { opacity: 0.86; } /* ───────────── Health / vital signs (server metrics) ───────────── */ /* Overall status banner - at-a-glance "is the box OK?" verdict. */ .health-hero { --hue: var(--ok); --huebg: var(--okbg); display: flex; align-items: center; gap: 18px 28px; flex-wrap: wrap; margin-top: 8px; background: radial-gradient(700px 200px at 0% 0%, var(--huebg), transparent 70%), var(--panel); border: 1px solid var(--panel-br); border-radius: 18px; padding: 18px 22px; backdrop-filter: blur(6px); } .health-hero.warn { --hue: var(--warn); --huebg: var(--warnbg); } .health-hero.bad { --hue: var(--bad); --huebg: var(--badbg); } .health-hero .status { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; font-size: 17px; letter-spacing: -0.01em; color: var(--hue); } .health-hero .status .led { width: 13px; height: 13px; border-radius: 50%; background: var(--hue); box-shadow: 0 0 0 4px var(--huebg); animation: hb-pulse 2.4s ease-in-out infinite; } .health-hero .status small { display: block; color: var(--txt3); font-size: 12px; font-weight: 500; margin-top: 2px; letter-spacing: 0; } @keyframes hb-pulse { 0%, 100% { opacity: 1 } 50% { opacity: 0.5 } } .health-hero .hmeta { margin-left: auto; display: flex; flex-wrap: wrap; gap: 22px 26px; color: var(--txt2); font-size: 13px; } .health-hero .hmeta .item { display: flex; flex-direction: column; gap: 2px; } .health-hero .hmeta .item span { color: var(--txt3); font-size: 11px; text-transform: uppercase; letter-spacing: 0.07em; font-weight: 700; } .health-hero .hmeta .item b { color: var(--txt); font-weight: 600; font-size: 14px; } /* Radial gauges - the centerpiece read for CPU / memory / disk. */ .gauges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; } @media (max-width: 760px) { .gauges { grid-template-columns: 1fr; } } .gauge { --g: var(--ok); --gbg: var(--okbg); background: var(--panel); border: 1px solid var(--panel-br); border-radius: 18px; padding: 20px 20px 18px; backdrop-filter: blur(6px); display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; transition: border-color .15s, transform .15s; } .gauge:hover { border-color: color-mix(in srgb, var(--g) 45%, transparent); transform: translateY(-1px); } .gauge.warn { --g: var(--warn); --gbg: var(--warnbg); } .gauge.bad { --g: var(--bad); --gbg: var(--badbg); } .gauge .ghead { display: flex; align-items: center; gap: 8px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--txt3); font-weight: 700; } .gauge .ghead svg { width: 15px; height: 15px; color: var(--g); } .gauge .ring { position: relative; width: 172px; height: 172px; margin: 6px 0 2px; border-radius: 50%; background: conic-gradient(var(--g) calc(var(--pct) * 1%), rgba(255,255,255,0.07) 0); } .gauge .ring::after { content: ''; position: absolute; inset: 15px; border-radius: 50%; background: linear-gradient(160deg, #10151f, #0c1017); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.035); } .gauge .center { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; } .gauge .pct { font-size: 40px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; } .gauge .pct sup { font-size: 17px; font-weight: 700; color: var(--txt2); margin-left: 1px; top: -0.7em; } .gauge .punit { font-size: 11px; color: var(--txt3); font-weight: 600; margin-top: 7px; text-transform: uppercase; letter-spacing: 0.07em; } .gauge .gsub { color: var(--txt2); font-size: 14px; font-weight: 500; } .gauge .gsub b { color: var(--txt); font-weight: 700; } .gauge .gtag { display: inline-flex; align-items: center; gap: 6px; padding: 3px 11px; border-radius: 999px; background: var(--gbg); color: var(--g); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; } /* Vital-sign tiles - the secondary numbers (free RAM, uptime, etc.). */ .vitals { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; } @media (max-width: 880px) { .vitals { grid-template-columns: repeat(2, 1fr); } } .vital { background: var(--panel); border: 1px solid var(--panel-br); border-radius: 14px; padding: 14px 16px; } .vital .vlabel { display: flex; align-items: center; gap: 7px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.07em; color: var(--txt3); font-weight: 700; } .vital .vlabel svg { width: 13px; height: 13px; } .vital .vval { font-size: 21px; font-weight: 700; margin-top: 7px; letter-spacing: -0.01em; } .vital .vval small { font-size: 12.5px; color: var(--txt2); font-weight: 500; } .vital .vnote { font-size: 12px; color: var(--txt3); margin-top: 3px; } /* Tone-colored progress bars (shared with index health cards). */ .bar.ok > i { background: var(--ok); } .bar.warn > i { background: var(--warn); } .bar.bad > i { background: var(--bad); } /* Load trend chart - sparkline with capacity guide + axis labels. */ .chart { position: relative; } .chart .spark { height: 124px; align-items: flex-end; } .chart .spark > i { background: linear-gradient(180deg, var(--accent), rgba(90,139,224,0.22)); transition: height .6s ease; } .chart .spark > i.hot { background: linear-gradient(180deg, var(--warn), rgba(251,191,36,0.22)); } .chart .spark > i.peak { background: linear-gradient(180deg, var(--bad), rgba(248,113,113,0.25)); } .chart .xaxis { display: flex; justify-content: space-between; margin-top: 9px; color: var(--txt3); font-size: 11px; } .grid > *, .panel, header.page > *, .cols > * { min-width: 0; } @media (max-width: 420px) { .cards, .cards-3, .cards-2, .vitals, .gauges, .cols { grid-template-columns: minmax(0, 1fr); } .stat { max-width: 100%; font-size: 25px; overflow-wrap: anywhere; } .stat small { display: block; margin-top: 5px; letter-spacing: 0; } .header-actions { width: 100%; margin-left: 0; justify-content: flex-end; } .context-breadcrumb { overflow: hidden; } .context-breadcrumb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .timeline-row { grid-template-columns: 1fr; } .timeline-row .when { white-space: normal; } .field, .action-runner, .op-confirm { align-items: stretch; flex-direction: column; } .field input, .op-confirm-input, .action-runner select { flex: 1 1 auto; width: 100%; min-width: 0; } } </style><style data-stx-cloak>[x-cloak]{display:none !important}</style><style data-crosswind="generated"> /* ! Tailwind CSS Preflight | MIT License | https://tailwindcss.com */ *, ::before, ::after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: var(--border-color, currentColor); } ::before, ::after { --hw-content: ''; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; -moz-tab-size: 4; tab-size: 4; font-family: ui-sans-serif, system-ui, sans-serif; font-feature-settings: normal; font-variation-settings: normal; -webkit-tap-highlight-color: transparent; } body { margin: 0; line-height: inherit; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0; border-color: var(--border-color, inherit); border-collapse: collapse; } button, input, optgroup, select, textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0; padding: 0; } button, select { text-transform: none; } button, input:where([type='button']), input:where([type='reset']), input:where([type='submit']) { -webkit-appearance: button; background-color: transparent; background-image: none; } :-moz-focusring { outline: auto; } :-moz-ui-invalid { box-shadow: none; } progress { vertical-align: baseline; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [type='search'] { -webkit-appearance: textfield; outline-offset: -2px; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } summary { display: list-item; } blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } dialog { padding: 0; } textarea { resize: vertical; } input::placeholder, textarea::placeholder { opacity: 1; color: #9ca3af; } button, [role="button"] { cursor: pointer; } :disabled { cursor: default; } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } [hidden] { display: none; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } </style></head><body data-stx-auto><a data-stx-scope="stx_scope_nav_38" class="skip-link" href="#main-content">Skip to content</a><button class="nav-toggle-button" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false"><span></span><span></span><span></span></button><button class="nav-scrim" type="button" aria-label="Close navigation"></button><aside class="app-sidebar" id="primary-navigation" aria-label="Primary navigation"><a class="brand" href="/?env=production"><span class="dot"></span><span>ts-cloud</span></a><div class="sidebar-context"><span class="context-label">Project</span><strong>acme</strong></div><div class="environment-picker" aria-label="Environment"><span class="context-label">Environment</span><details><summary class="environment-current production"><span>PROD</span><strong>production</strong></summary></details></div><button class="command-trigger" type="button" aria-keyshortcuts="Meta+K Control+K"><span>Search resources</span><kbd>⌘ K</kbd></button><div class="nav-groups"><section class="nav-group"><h2>Overview</h2><a class="" href="/?env=production">Dashboard</a><a href="/server/activity?env=production">Activity</a></section><section class="nav-group"><h2>Applications</h2><a class="" href="/server/sites?env=production">Services</a><a class="" href="/server/deployments?env=production">Deployments</a><a class="" href="/server/logs?env=production">Logs</a><a class="" href="/integrations?env=production">Git integrations</a><a class="" href="/applications/new?env=production">Create application</a><a class="" href="/applications/compose?env=production">Compose applications</a></section><section class="nav-group"><h2>Operations</h2><a class="" href="/operations/queue?env=production">Deployment queue</a><a class="" href="/operations/previews?env=production">Preview environments</a><a class="" href="/operations/releases?env=production">Releases & promotion</a><a class="" href="/operations/regions?env=production">Regions & failover</a><a class="" href="/operations/maintenance?env=production">Maintenance & DR</a><a class="" href="/operations/workloads?env=production">Workloads</a><a class="" href="/operations/observability?env=production">Observability</a><a class="" href="/operations/alerts?env=production">Alerts & health</a><a href="/server/metrics?env=production">Metrics</a><a href="/server/services?env=production">Runtime services</a><a class="" href="/operations/jobs?env=production">Workers & schedules</a><a class="" href="/operations/configuration?env=production">Environment &amp; secrets</a><a class="" href="/data/backups?env=production">Backups &amp; recovery</a><a class="" href="/data/volumes?env=production">Persistent volumes</a><a href="/server/actions?env=production">Run operations</a></section><section class="nav-group"><h2>Infrastructure</h2><a class="" href="/data/services?env=production">Data services</a><a class="" href="/data/volumes?env=production">Persistent volumes</a><a href="/server/firewall?env=production">Network & firewall</a><a href="/server/ssh-keys?env=production">SSH keys</a><a class="" href="/server/fleet?env=production">Fleet inventory</a><a class="" href="/server/capacity?env=production">Capacity & placement</a><a href="/security?env=production">Security posture</a><a href="/server/terminal?env=production">Terminal</a></section><section class="nav-group"><h2>Organization</h2><a class="" href="/server/team?env=production">People & access</a><a class="" href="/account/automation?env=production">API & automation</a></section><section class="nav-group"><h2>Account</h2><a class="" href="/account/security?env=production">Sign-in & security</a></section></div><form method="post" action="/api/logout" class="signout"><button type="submit">Sign out</button></form></aside><dialog class="command-palette" aria-labelledby="command-title"><div class="command-search"><span aria-hidden="true">⌕</span><input type="search" placeholder="Search services, domains, deployments…" aria-label="Search resources" autocomplete="off"><button type="button" class="command-close" aria-label="Close search">Esc</button></div><h2 id="command-title" class="sr-only">Search resources and navigation</h2><div class="command-status" role="status">Start typing to search this project.</div><section class="saved-views" aria-labelledby="saved-views-title"><div class="saved-views-heading"><h3 id="saved-views-title">Saved views</h3><form class="save-view-form"><label class="sr-only" for="save-view-name">Saved view name</label><input id="save-view-name" maxlength="64" placeholder="Name this view" autocomplete="off"><button type="submit">Save current filters</button></form></div><div class="saved-view-list"></div></section><form class="tag-result-form"><label for="tag-result-name">Tag selected resource</label><input id="tag-result-name" maxlength="32" placeholder="customer-facing" pattern="[A-Za-z0-9][A-Za-z0-9 -]{0,31}" autocomplete="off"><input class="tag-color" type="color" value="#5a8be0" aria-label="Tag color"><button type="submit">Add tag</button></form><div class="command-results" role="listbox" aria-label="Search results"></div><footer><span>↑ ↓ navigate</span><span>Enter open</span><span>Esc close</span></footer></dialog><div class="context-bar" aria-label="Current scope"><div class="context-path"><div class="context-breadcrumb"><span>acme</span><i>/</i><strong>production</strong></div><div class="context-filters" aria-label="Active filters"></div></div><span class="scope-safety production">Production scope</span></div> <script data-stx-scoped>
83
+ })</script> <!DOCTYPE html><html lang="en" data-theme="dark"><head><meta name="title" content="stx Project"><meta name="description" content="A website built with stx templating engine"><meta property="og:title" content="stx Project"><meta property="og:description" content="A website built with stx templating engine"><meta property="og:type" content="website"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="stx Project"><meta name="twitter:description" content="A website built with stx templating engine"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ts-cloud · Deployments</title><link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='3' y='3' width='26' height='26' rx='8' fill='%235a8be0'/%3E%3C/svg%3E"><link rel="preconnect" href="https://fonts.googleapis.com"><link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"><style> :root { --bg: #0a0e15; --bg2: #0b0f18; --panel: rgba(255,255,255,0.03); --panel-br: rgba(255,255,255,0.072); --txt: #e9edf5; --txt2: #94a1b8; --txt3: #5a6577; --accent: #5a8be0; --accent-dim: rgba(90,139,224,0.14); --accent-ink: #061019; --ok: #35d19b; --okbg: rgba(53,209,155,0.11); --bad: #f0736e; --badbg: rgba(240,115,110,0.11); --warn: #edb949; --warnbg: rgba(237,185,73,0.11); --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace; } * { box-sizing: border-box; margin: 0; padding: 0; } html { background: var(--bg); min-height: 100%; } body { font-family: 'Inter', system-ui, sans-serif; color: var(--txt); min-height: 100vh; /* One calm accent wash, no AI blue-purple mesh. */ background: radial-gradient(900px 460px at 88% -8%, rgba(90,139,224,0.06), transparent 62%), linear-gradient(175deg, var(--bg), var(--bg2)); -webkit-font-smoothing: antialiased; font-feature-settings: 'tnum' 1, 'ss01' 1; padding-left: 248px; overflow-x: hidden; } /* Tabular monospaced numerals wherever a value is read at a glance (density 7). */ .stat, .gauge .pct, .vital .vval, .health-hero .hmeta .item b, .kv > b, td.mono { font-variant-numeric: tabular-nums; } .stat, .gauge .pct { font-family: var(--mono); letter-spacing: -0.03em; } a { color: inherit; text-decoration: none; } .wrap { max-width: 1240px; margin: 0 auto; padding: 0 28px 64px; min-width: 0; } .skip-link { position: fixed; z-index: 100; top: 8px; left: 264px; transform: translateY(-150%); background: var(--accent); color: var(--accent-ink); border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 800; } .skip-link:focus { transform: translateY(0); } .app-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: 248px; display: flex; flex-direction: column; background: rgba(9,13,20,0.96); border-right: 1px solid var(--panel-br); backdrop-filter: blur(18px); padding: 18px 14px 14px; overflow-y: auto; overscroll-behavior: contain; } .brand { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 0 8px; font-weight: 800; font-size: 17px; letter-spacing: -0.02em; } .brand .dot { width: 20px; height: 20px; border-radius: 6px; background: var(--accent); box-shadow: inset 0 1px 0 rgba(255,255,255,0.35); } .sidebar-context { display: grid; gap: 3px; margin-top: 16px; padding: 12px; border: 1px solid var(--panel-br); border-radius: 12px; background: rgba(255,255,255,0.025); } .sidebar-context strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .context-label { color: var(--txt3); font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; } .context-detail { color: var(--txt3); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .environment-picker { display: grid; gap: 6px; margin: 14px 4px 4px; } .environment-picker details { position: relative; } .environment-current { display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 9px; cursor: pointer; list-style: none; border: 1px solid var(--panel-br); border-radius: 10px; background: rgba(255,255,255,0.03); } .environment-current::-webkit-details-marker { display: none; } .environment-current::after { content: '⌄'; margin-left: auto; color: var(--txt3); } .environment-current > span { min-width: 36px; padding: 3px 5px; border-radius: 5px; background: var(--accent-dim); color: var(--accent); font: 800 9px var(--mono); text-align: center; letter-spacing: .06em; } .environment-current.production > span { background: var(--warnbg); color: var(--warn); } .environment-current strong { font-size: 12px; text-transform: capitalize; } .environment-menu { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; right: 0; padding: 5px; border: 1px solid var(--panel-br); border-radius: 11px; background: #111722; box-shadow: 0 14px 36px rgba(0,0,0,.4); } .environment-menu a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px; border-radius: 7px; font-size: 12px; text-transform: capitalize; } .environment-menu a:hover, .environment-menu a.active { background: var(--accent-dim); color: var(--accent); } .environment-menu small { color: var(--txt3); font-size: 9px; text-transform: uppercase; letter-spacing: .05em; } .command-trigger { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: calc(100% - 8px); margin: 12px 4px 0; padding: 8px 9px; border: 1px solid var(--panel-br); border-radius: 9px; background: rgba(255,255,255,.025); color: var(--txt2); font: 600 12px inherit; text-align: left; } .command-trigger:hover { border-color: rgba(90,139,224,.35); color: var(--txt); } .command-trigger kbd { padding: 2px 5px; border: 1px solid var(--panel-br); border-radius: 5px; background: rgba(255,255,255,.04); color: var(--txt3); font: 600 10px var(--mono); } .nav-groups { display: grid; gap: 18px; margin-top: 20px; } .nav-group { display: grid; gap: 2px; } .nav-group h2 { padding: 0 10px 5px; color: var(--txt3); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; } .nav-group a { position: relative; display: flex; align-items: center; min-height: 34px; padding: 7px 10px; border-radius: 8px; color: var(--txt2); font-size: 12.5px; font-weight: 600; } .nav-group a:hover { color: var(--txt); background: rgba(255,255,255,.035); } .nav-group a.active { color: var(--accent); background: var(--accent-dim); } .nav-group a.active::before { content: ''; position: absolute; left: -4px; width: 3px; height: 16px; border-radius: 4px; background: var(--accent); } .context-bar { position: sticky; top: 0; z-index: 20; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 28px; border-bottom: 1px solid var(--panel-br); background: rgba(10,14,21,.78); backdrop-filter: blur(14px); } .context-path { display: flex; align-items: center; gap: 12px; min-width: 0; overflow: hidden; } .context-breadcrumb { display: flex; align-items: center; gap: 8px; min-width: 0; color: var(--txt2); font-size: 12px; } .context-breadcrumb i { color: var(--txt3); font-style: normal; } .context-breadcrumb strong { color: var(--txt); text-transform: capitalize; } .context-breadcrumb small { margin-left: 7px; padding-left: 14px; border-left: 1px solid var(--panel-br); color: var(--txt3); white-space: nowrap; } .context-filters { display: flex; align-items: center; gap: 5px; min-width: 0; overflow-x: auto; } .filter-chip { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(90,139,224,.25); border-radius: 999px; background: var(--accent-dim); color: var(--accent); font: 700 10px var(--mono); } .filter-chip:hover { border-color: var(--accent); } .scope-safety { flex: 0 0 auto; padding: 4px 9px; border: 1px solid rgba(90,139,224,.25); border-radius: 999px; background: var(--accent-dim); color: var(--accent); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; } .scope-safety.production { border-color: rgba(237,185,73,.3); background: var(--warnbg); color: var(--warn); } .env { padding: 4px 10px; border-radius: 999px; background: var(--okbg); color: var(--ok); font-weight: 600; font-size: 12px; } .signout { display: flex; margin-top: auto; padding: 18px 4px 0; } .signout button { width: 100%; appearance: none; border: 1px solid var(--panel-br); background: rgba(255,255,255,0.035); color: var(--txt2); border-radius: 8px; padding: 5px 11px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: color .12s, border-color .12s; } .signout button:hover { color: var(--txt); border-color: rgba(255,255,255,0.16); } .nav-toggle-button, .nav-scrim { display: none; } .nav-toggle-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } .state-page { min-height: calc(100vh - 48px); display: grid; align-content: center; justify-items: start; gap: 12px; max-width: 620px; padding: 48px 0; } .state-page .state-code { color: var(--accent); font: 800 12px var(--mono); text-transform: uppercase; letter-spacing: .12em; } .state-page h1 { font-size: clamp(28px, 5vw, 48px); letter-spacing: -.035em; } .state-page p { color: var(--txt2); max-width: 560px; font-size: 15px; line-height: 1.65; } .state-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; } .auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; } .auth-card { width: min(460px, 100%); display: grid; gap: 24px; padding: 28px; border: 1px solid var(--panel-br); border-radius: 18px; background: var(--panel); box-shadow: 0 24px 70px rgba(0,0,0,.35); } .auth-card .brand { padding: 0; } .auth-card h1 { margin-top: 7px; font-size: 28px; } .auth-card p { margin-top: 6px; color: var(--txt2); line-height: 1.55; } .auth-form { display: grid; gap: 14px; } .auth-form .field-block { display: grid; gap: 6px; } .auth-form .field-block input { width: 100%; } .auth-form small { color: var(--txt3); font-size: 11px; } .auth-form .btn { justify-self: stretch; } .auth-status { min-height: 20px; color: var(--txt2); font-size: 12px; } .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; } .command-palette { width: min(660px, calc(100vw - 24px)); max-height: min(620px, calc(100vh - 40px)); margin: 9vh auto 0; padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 16px; background: #0f151f; color: var(--txt); box-shadow: 0 28px 90px rgba(0,0,0,.58); } .command-palette::backdrop { background: rgba(2,5,9,.72); backdrop-filter: blur(5px); } .command-search { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--panel-br); } .command-search > span { color: var(--txt3); font-size: 22px; } .command-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--txt); font: 500 15px inherit; } .command-search input::placeholder { color: var(--txt3); } .command-close { padding: 4px 7px; border: 1px solid var(--panel-br); border-radius: 6px; color: var(--txt3); font: 700 10px var(--mono); } .command-status { padding: 12px 16px; color: var(--txt3); font-size: 12px; } .saved-views { display: grid; gap: 8px; padding: 0 14px 12px; border-bottom: 1px solid var(--panel-br); } .saved-views-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .saved-views h3, .command-group > h3 { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .08em; } .save-view-form { display: flex; align-items: center; gap: 6px; } .save-view-form input { width: 150px; min-width: 0; padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; background: rgba(255,255,255,.035); color: var(--txt); font-size: 11px; } .save-view-form button, .saved-view-row button { padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; color: var(--txt2); font-size: 10px; } .saved-view-list { display: flex; flex-wrap: wrap; gap: 6px; } .saved-view-row { display: inline-flex; align-items: center; overflow: hidden; border: 1px solid var(--panel-br); border-radius: 8px; } .saved-view-row a { padding: 5px 8px; color: var(--txt2); font-size: 11px; } .saved-view-row button { border: 0; border-left: 1px solid var(--panel-br); border-radius: 0; color: var(--txt3); } .saved-views.empty .saved-view-list::after { content: 'No saved views yet'; color: var(--txt3); font-size: 11px; } .tag-result-form { display: grid; grid-template-columns: 1fr 150px 32px auto; align-items: center; gap: 7px; padding: 9px 14px; border-bottom: 1px solid var(--panel-br); } .tag-result-form label { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .08em; } .tag-result-form input:not(.tag-color) { min-width: 0; padding: 5px 7px; border: 1px solid var(--panel-br); border-radius: 7px; background: rgba(255,255,255,.035); color: var(--txt); font-size: 11px; } .tag-result-form .tag-color { width: 32px; height: 27px; padding: 2px; border: 1px solid var(--panel-br); border-radius: 7px; background: transparent; } .tag-result-form button { padding: 5px 8px; border: 1px solid var(--panel-br); border-radius: 7px; color: var(--txt2); font-size: 10px; } .tag-result-form button:disabled { opacity: .45; cursor: not-allowed; } .command-results { display: grid; gap: 3px; max-height: 430px; overflow-y: auto; padding: 0 7px 10px; } .command-group { display: grid; gap: 3px; } .command-group > h3 { padding: 8px 10px 2px; } .command-result-row { display: grid; grid-template-columns: minmax(0, 1fr) 36px; align-items: center; } .command-results a { display: grid; grid-template-columns: 78px 1fr; gap: 10px; align-items: center; min-width: 0; padding: 10px; border-radius: 9px; } .command-results a:hover, .command-results a.selected { background: var(--accent-dim); } .favorite-result { display: grid; place-content: center; width: 30px; height: 30px; border-radius: 8px; color: var(--txt3); font-size: 17px; } .favorite-result:hover, .favorite-result.active { color: var(--warn); background: var(--warnbg); } .command-type { color: var(--txt3); font: 800 9px var(--mono); text-transform: uppercase; letter-spacing: .07em; } .command-copy { display: grid; gap: 3px; min-width: 0; } .command-copy strong, .command-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .command-copy strong { font-size: 13px; } .command-copy small { color: var(--txt3); font-size: 11px; } .command-copy mark { border-radius: 2px; background: var(--warnbg); color: var(--warn); } .command-palette footer { display: flex; flex-wrap: wrap; gap: 14px; padding: 9px 14px; border-top: 1px solid var(--panel-br); color: var(--txt3); font-size: 10px; } @media (max-width: 820px) { body { padding-left: 0; } .wrap { padding-left: 16px; padding-right: 16px; } .context-bar { padding: 8px 14px 8px 58px; } .context-breadcrumb small { display: none; } .nav-toggle-button { position: fixed; top: 9px; left: 12px; z-index: 50; width: 36px; height: 30px; display: grid; place-content: center; gap: 4px; border: 1px solid var(--panel-br); border-radius: 8px; background: #111722; cursor: pointer; } .nav-toggle-button span { display: block; width: 15px; height: 1px; background: var(--txt2); } .app-sidebar { transform: translateX(-102%); transition: transform .18s ease; box-shadow: 18px 0 48px rgba(0,0,0,.45); } .nav-scrim { position: fixed; inset: 0; z-index: 25; background: rgba(0,0,0,.58); } body.nav-open .nav-scrim { display: block; } body.nav-open .app-sidebar { transform: translateX(0); } .skip-link { left: 56px; } } @media (max-width: 420px) { .context-filters { display: none; } .saved-views-heading { align-items: stretch; flex-direction: column; } .save-view-form input { width: auto; flex: 1; } .tag-result-form { grid-template-columns: 1fr 32px auto; } .tag-result-form label { grid-column: 1 / -1; } .scope-safety { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } header.page { padding-top: 22px; } header.page h1 { font-size: 23px; } .cards, .cards-3, .cards-2, .vitals { grid-template-columns: 1fr; } .panel { padding: 15px; } table { display: block; overflow-x: auto; } } header.page { padding: 30px 0 22px; display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; } header.page h1 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; } header.page p { color: var(--txt2); margin-top: 4px; font-size: 14px; } .server-line { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; color: var(--txt2); font-size: 13px; } .server-line b { color: var(--txt); font-weight: 600; } .header-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; } /* Breadcrumb / back link for drill-down pages */ .crumbs { display: flex; align-items: center; gap: 8px; padding-top: 26px; font-size: 13px; color: var(--txt3); } .crumbs a { color: var(--txt2); } .crumbs a:hover { color: var(--accent); } .crumbs .sep { color: var(--txt3); } .grid { display: grid; gap: 16px; } .cards { grid-template-columns: repeat(4, 1fr); } .cards-3 { grid-template-columns: repeat(3, 1fr); } .cards-2 { grid-template-columns: repeat(2, 1fr); } @media (max-width: 880px) { .cards, .cards-3, .cards-2 { grid-template-columns: repeat(2, 1fr); } } .panel { background: var(--panel); border: 1px solid var(--panel-br); border-radius: 16px; padding: 18px; backdrop-filter: blur(6px); } a.panel { display: block; transition: border-color .15s, transform .15s; } a.panel:hover { border-color: rgba(90,139,224,0.5); transform: translateY(-1px); } .panel h3 { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--txt3); font-weight: 700; } .stat { font-size: 28px; font-weight: 800; margin-top: 8px; letter-spacing: -0.02em; } .stat small { font-size: 14px; color: var(--txt2); font-weight: 500; } .bar { height: 7px; border-radius: 999px; background: rgba(255,255,255,0.07); margin-top: 12px; overflow: hidden; } .bar > i { display: block; height: 100%; border-radius: 999px; background: var(--accent); } .section { margin-top: 30px; } .section > h2 { font-size: 15px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; } .section > h2 .more { margin-left: auto; display: inline-flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 600; color: var(--accent); } .section > h2 .more a { color: var(--accent); } .cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; } @media (max-width: 880px) { .cols { grid-template-columns: 1fr; } } table { width: 100%; border-collapse: collapse; font-size: 14px; } th { text-align: left; color: var(--txt3); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; padding: 0 12px 10px; } td { padding: 12px; border-top: 1px solid rgba(255,255,255,0.05); } tr:hover td { background: rgba(255,255,255,0.02); } .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: var(--txt2); } .pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; } .pill::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; } .pill.ok { background: var(--okbg); color: var(--ok); } .pill.bad { background: var(--badbg); color: var(--bad); } .pill.warn { background: var(--warnbg); color: var(--warn); } .tag { padding: 2px 8px; border-radius: 6px; background: rgba(90,139,224,0.12); color: var(--accent); font-size: 12px; font-weight: 600; } .kv { display: flex; justify-content: space-between; padding: 9px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; gap: 16px; } .kv:first-of-type { border-top: 0; } .kv > span { color: var(--txt2); white-space: nowrap; } .kv > b { text-align: right; word-break: break-all; } .deploy { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .deploy:first-of-type { border-top: 0; } .deploy .when { margin-left: auto; color: var(--txt3); font-size: 12px; } .btn { background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 10px; padding: 9px 16px; font-weight: 700; font-size: 13.5px; cursor: pointer; font-family: inherit; white-space: nowrap; transition: filter .12s, transform .12s; } .btn:hover { filter: brightness(1.06); } .btn:active { transform: translateY(1px); } .btn.ghost { background: rgba(255,255,255,0.045); border: 1px solid var(--panel-br); color: var(--txt); } .btn.ghost:hover { background: rgba(255,255,255,0.075); filter: none; } .btn.danger { background: transparent; border: 1px solid var(--badbg); color: var(--bad); } .btn.danger:hover { background: var(--badbg); filter: none; } .btn.sm { padding: 6px 12px; font-size: 12px; } .data-item { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .data-item:first-of-type { border-top: 0; } .data-item .detail { color: var(--txt3); font-size: 12px; } .data-item .st { margin-left: auto; } .secret { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .secret:first-of-type { border-top: 0; } .secret .val { margin-left: auto; color: var(--txt3); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; letter-spacing: 2px; } /* Drill-down extras */ .spark { display: flex; align-items: flex-end; gap: 3px; height: 48px; margin-top: 12px; } .spark > i { flex: 1; background: linear-gradient(180deg, var(--accent), rgba(90,139,224,0.25)); border-radius: 3px 3px 0 0; min-height: 2px; } .logs { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.7; color: var(--txt2); max-height: 360px; overflow: auto; } .logs .ts { color: var(--txt3); } .logs .err { color: var(--bad); } .log-list { display: grid; gap: 10px; max-height: 680px; overflow: auto; padding-right: 4px; } .log-row { border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 12px 14px; } .log-row.warn { border-color: rgba(251,191,36,0.18); background: rgba(251,191,36,0.04); } .log-row.error { border-color: rgba(248,113,113,0.2); background: rgba(248,113,113,0.045); } .log-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; color: var(--txt3); font-size: 12px; margin-bottom: 9px; } .log-row pre { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--txt2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.55; } .timeline { display: grid; gap: 11px; } .timeline-row { display: grid; grid-template-columns: 92px 1fr auto; gap: 13px; align-items: start; border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 12px 14px; } .timeline-row .type { color: var(--txt3); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.07em; } .timeline-row .title { font-weight: 800; } .timeline-row .detail { color: var(--txt2); font-size: 13px; margin-top: 3px; overflow-wrap: anywhere; } .timeline-row .when { color: var(--txt3); font-size: 12px; white-space: nowrap; } .check-list { display: grid; gap: 10px; } .check { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; padding: 13px 0; border-top: 1px solid rgba(255,255,255,0.05); } .check:first-child { border-top: 0; padding-top: 0; } .check .mark { width: 12px; height: 12px; border-radius: 50%; margin-top: 4px; background: var(--ok); box-shadow: 0 0 0 4px var(--okbg); } .check.warn .mark { background: var(--warn); box-shadow: 0 0 0 4px var(--warnbg); } .check.fail .mark { background: var(--bad); box-shadow: 0 0 0 4px var(--badbg); } .check .name { font-weight: 800; } .check .detail { color: var(--txt2); font-size: 13px; margin-top: 3px; line-height: 1.45; } .port-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; } @media (max-width: 880px) { .port-grid { grid-template-columns: 1fr; } } .port-card { border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; background: rgba(255,255,255,0.025); padding: 13px 14px; min-width: 0; } .port-card .top { display: flex; align-items: center; gap: 8px; justify-content: space-between; } .port-card .listen { margin-top: 8px; font-weight: 800; overflow-wrap: anywhere; } .port-card .proc { color: var(--txt3); font-size: 12px; margin-top: 5px; overflow-wrap: anywhere; } .action-runner { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .action-runner select { background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 8px 10px; color: var(--txt); font-family: inherit; font-size: 13px; min-width: 150px; } .action-output { margin-top: 12px; white-space: pre-wrap; overflow: auto; max-height: 260px; border-radius: 12px; border: 1px solid rgba(255,255,255,0.07); background: rgba(0,0,0,0.22); padding: 12px; color: var(--txt2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.5; } .op-confirm { margin-top: 14px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .op-confirm-input { flex: 0 0 200px; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 8px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .op-confirm-input:focus { outline: none; border-color: var(--accent); } .note { color: var(--txt3); font-size: 12px; margin-top: 10px; } .row-actions { display: flex; gap: 8px; } .field { display: flex; gap: 8px; margin-top: 12px; } .field input { flex: 1; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 9px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .field input:focus { outline: none; border-color: var(--accent); } .empty { display: grid; place-items: center; gap: 6px; min-height: 132px; text-align: center; color: var(--txt3); border: 1px dashed rgba(255,255,255,0.12); border-radius: 14px; background: rgba(255,255,255,0.025); padding: 22px; } .empty strong { color: var(--txt); font-size: 14px; } .empty span { max-width: 540px; font-size: 13px; line-height: 1.5; } .empty.compact { min-height: 74px; margin-top: 10px; padding: 14px; } .form-grid { display: grid; grid-template-columns: minmax(180px, 0.7fr) minmax(280px, 1.4fr); gap: 14px; align-items: end; } .field-block { display: flex; flex-direction: column; gap: 7px; } .field-block.wide { grid-column: 1 / -1; } .field-block label, .select-filter span { color: var(--txt3); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.07em; } .field-block input, .field-block textarea, .select-filter select { width: 100%; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); border-radius: 10px; padding: 10px 12px; color: var(--txt); font-family: inherit; font-size: 14px; } .field-block textarea { resize: vertical; min-height: 92px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.5; } .field-block input:focus, .field-block textarea:focus, .select-filter select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(90,139,224,0.12); } .form-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .msg { color: var(--txt3); font-size: 13px; } .msg.ok { color: var(--ok); } .msg.bad { color: var(--bad); } .table-actions { text-align: right; white-space: nowrap; } .filters { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin: 16px 0; } .segmented { display: inline-flex; padding: 4px; border: 1px solid var(--panel-br); background: rgba(255,255,255,0.035); border-radius: 12px; gap: 2px; } .segmented button { appearance: none; border: 0; background: transparent; color: var(--txt2); border-radius: 9px; padding: 7px 12px; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; } .segmented button.active { background: rgba(90,139,224,0.18); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(90,139,224,0.18); } .select-filter { display: inline-flex; align-items: center; gap: 8px; } .select-filter select { min-width: 150px; padding: 8px 10px; } @media (max-width: 760px) { .form-grid { grid-template-columns: 1fr; } .filters { align-items: stretch; } .segmented, .select-filter, .select-filter select { width: 100%; } .segmented button { flex: 1; } } /* Honest action affordance: a copyable CLI command (static dashboard has no backend - the buttons would POST nowhere, so we show the exact command). */ .cmd { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 10px; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-br); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: var(--txt); white-space: nowrap; } .cmd::before { content: '$'; color: var(--txt3); } .cmd.accent { border-color: rgba(90,139,224,0.4); color: var(--accent); } .cmds { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } /* Server dashboard components */ .svc { display: flex; flex-wrap: wrap; gap: 10px; } .svc .item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,0.03); border: 1px solid var(--panel-br); font-size: 13px; font-weight: 500; } .key { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid rgba(255,255,255,0.05); font-size: 14px; } .key:first-of-type { border-top: 0; } .key .fp { margin-left: auto; color: var(--txt3); font-size: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; } .chart-panel { overflow: hidden; } .chart-panel.subtle { padding: 0; margin-bottom: 14px; background: transparent; border: 0; } svg.chart { display: block; width: 100%; height: auto; min-height: 150px; } svg.chart .chart-shell { fill: rgba(255,255,255,0.025); stroke: rgba(255,255,255,0.07); } svg.chart .chart-grid { stroke: rgba(255,255,255,0.08); stroke-width: 1; } svg.chart .chart-axis, svg.chart .chart-label { fill: var(--txt3); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } svg.chart .chart-value { fill: var(--txt); font-size: 12px; font-weight: 800; } svg.chart .chart-empty-title { fill: var(--txt); font-size: 15px; font-weight: 800; } svg.chart .chart-empty-sub { fill: var(--txt3); font-size: 12px; } svg.chart .bar-mark.ok rect { fill: var(--ok); opacity: 0.85; } svg.chart .bar-mark.warn rect { fill: var(--warn); opacity: 0.88; } svg.chart .bar-mark.bad rect { fill: var(--bad); opacity: 0.9; } svg.chart .spark-path { fill: none; stroke: var(--accent); stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; } svg.chart circle.ok { fill: var(--ok); } svg.chart circle.bad { fill: var(--bad); } svg.chart.disabled { opacity: 0.86; } /* ───────────── Health / vital signs (server metrics) ───────────── */ /* Overall status banner - at-a-glance "is the box OK?" verdict. */ .health-hero { --hue: var(--ok); --huebg: var(--okbg); display: flex; align-items: center; gap: 18px 28px; flex-wrap: wrap; margin-top: 8px; background: radial-gradient(700px 200px at 0% 0%, var(--huebg), transparent 70%), var(--panel); border: 1px solid var(--panel-br); border-radius: 18px; padding: 18px 22px; backdrop-filter: blur(6px); } .health-hero.warn { --hue: var(--warn); --huebg: var(--warnbg); } .health-hero.bad { --hue: var(--bad); --huebg: var(--badbg); } .health-hero .status { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; font-size: 17px; letter-spacing: -0.01em; color: var(--hue); } .health-hero .status .led { width: 13px; height: 13px; border-radius: 50%; background: var(--hue); box-shadow: 0 0 0 4px var(--huebg); animation: hb-pulse 2.4s ease-in-out infinite; } .health-hero .status small { display: block; color: var(--txt3); font-size: 12px; font-weight: 500; margin-top: 2px; letter-spacing: 0; } @keyframes hb-pulse { 0%, 100% { opacity: 1 } 50% { opacity: 0.5 } } .health-hero .hmeta { margin-left: auto; display: flex; flex-wrap: wrap; gap: 22px 26px; color: var(--txt2); font-size: 13px; } .health-hero .hmeta .item { display: flex; flex-direction: column; gap: 2px; } .health-hero .hmeta .item span { color: var(--txt3); font-size: 11px; text-transform: uppercase; letter-spacing: 0.07em; font-weight: 700; } .health-hero .hmeta .item b { color: var(--txt); font-weight: 600; font-size: 14px; } /* Radial gauges - the centerpiece read for CPU / memory / disk. */ .gauges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; } @media (max-width: 760px) { .gauges { grid-template-columns: 1fr; } } .gauge { --g: var(--ok); --gbg: var(--okbg); background: var(--panel); border: 1px solid var(--panel-br); border-radius: 18px; padding: 20px 20px 18px; backdrop-filter: blur(6px); display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; transition: border-color .15s, transform .15s; } .gauge:hover { border-color: color-mix(in srgb, var(--g) 45%, transparent); transform: translateY(-1px); } .gauge.warn { --g: var(--warn); --gbg: var(--warnbg); } .gauge.bad { --g: var(--bad); --gbg: var(--badbg); } .gauge .ghead { display: flex; align-items: center; gap: 8px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--txt3); font-weight: 700; } .gauge .ghead svg { width: 15px; height: 15px; color: var(--g); } .gauge .ring { position: relative; width: 172px; height: 172px; margin: 6px 0 2px; border-radius: 50%; background: conic-gradient(var(--g) calc(var(--pct) * 1%), rgba(255,255,255,0.07) 0); } .gauge .ring::after { content: ''; position: absolute; inset: 15px; border-radius: 50%; background: linear-gradient(160deg, #10151f, #0c1017); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.035); } .gauge .center { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; } .gauge .pct { font-size: 40px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; } .gauge .pct sup { font-size: 17px; font-weight: 700; color: var(--txt2); margin-left: 1px; top: -0.7em; } .gauge .punit { font-size: 11px; color: var(--txt3); font-weight: 600; margin-top: 7px; text-transform: uppercase; letter-spacing: 0.07em; } .gauge .gsub { color: var(--txt2); font-size: 14px; font-weight: 500; } .gauge .gsub b { color: var(--txt); font-weight: 700; } .gauge .gtag { display: inline-flex; align-items: center; gap: 6px; padding: 3px 11px; border-radius: 999px; background: var(--gbg); color: var(--g); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; } /* Vital-sign tiles - the secondary numbers (free RAM, uptime, etc.). */ .vitals { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; } @media (max-width: 880px) { .vitals { grid-template-columns: repeat(2, 1fr); } } .vital { background: var(--panel); border: 1px solid var(--panel-br); border-radius: 14px; padding: 14px 16px; } .vital .vlabel { display: flex; align-items: center; gap: 7px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.07em; color: var(--txt3); font-weight: 700; } .vital .vlabel svg { width: 13px; height: 13px; } .vital .vval { font-size: 21px; font-weight: 700; margin-top: 7px; letter-spacing: -0.01em; } .vital .vval small { font-size: 12.5px; color: var(--txt2); font-weight: 500; } .vital .vnote { font-size: 12px; color: var(--txt3); margin-top: 3px; } /* Tone-colored progress bars (shared with index health cards). */ .bar.ok > i { background: var(--ok); } .bar.warn > i { background: var(--warn); } .bar.bad > i { background: var(--bad); } /* Load trend chart - sparkline with capacity guide + axis labels. */ .chart { position: relative; } .chart .spark { height: 124px; align-items: flex-end; } .chart .spark > i { background: linear-gradient(180deg, var(--accent), rgba(90,139,224,0.22)); transition: height .6s ease; } .chart .spark > i.hot { background: linear-gradient(180deg, var(--warn), rgba(251,191,36,0.22)); } .chart .spark > i.peak { background: linear-gradient(180deg, var(--bad), rgba(248,113,113,0.25)); } .chart .xaxis { display: flex; justify-content: space-between; margin-top: 9px; color: var(--txt3); font-size: 11px; } .grid > *, .panel, header.page > *, .cols > * { min-width: 0; } @media (max-width: 420px) { .cards, .cards-3, .cards-2, .vitals, .gauges, .cols { grid-template-columns: minmax(0, 1fr); } .stat { max-width: 100%; font-size: 25px; overflow-wrap: anywhere; } .stat small { display: block; margin-top: 5px; letter-spacing: 0; } .header-actions { width: 100%; margin-left: 0; justify-content: flex-end; } .context-breadcrumb { overflow: hidden; } .context-breadcrumb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .timeline-row { grid-template-columns: 1fr; } .timeline-row .when { white-space: normal; } .field, .action-runner, .op-confirm { align-items: stretch; flex-direction: column; } .field input, .op-confirm-input, .action-runner select { flex: 1 1 auto; width: 100%; min-width: 0; } } </style><style data-stx-cloak>[x-cloak]{display:none !important}</style><style data-crosswind="generated"> /* ! Tailwind CSS Preflight | MIT License | https://tailwindcss.com */ *, ::before, ::after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: var(--border-color, currentColor); } ::before, ::after { --hw-content: ''; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; -moz-tab-size: 4; tab-size: 4; font-family: ui-sans-serif, system-ui, sans-serif; font-feature-settings: normal; font-variation-settings: normal; -webkit-tap-highlight-color: transparent; } body { margin: 0; line-height: inherit; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0; border-color: var(--border-color, inherit); border-collapse: collapse; } button, input, optgroup, select, textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0; padding: 0; } button, select { text-transform: none; } button, input:where([type='button']), input:where([type='reset']), input:where([type='submit']) { -webkit-appearance: button; background-color: transparent; background-image: none; } :-moz-focusring { outline: auto; } :-moz-ui-invalid { box-shadow: none; } progress { vertical-align: baseline; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [type='search'] { -webkit-appearance: textfield; outline-offset: -2px; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } summary { display: list-item; } blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } dialog { padding: 0; } textarea { resize: vertical; } input::placeholder, textarea::placeholder { opacity: 1; color: #9ca3af; } button, [role="button"] { cursor: pointer; } :disabled { cursor: default; } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } [hidden] { display: none; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } </style></head><body data-stx-auto><a data-stx-scope="stx_scope_nav_47" class="skip-link" href="#main-content">Skip to content</a><button class="nav-toggle-button" type="button" aria-label="Open navigation" aria-controls="primary-navigation" aria-expanded="false"><span></span><span></span><span></span></button><button class="nav-scrim" type="button" aria-label="Close navigation"></button><aside class="app-sidebar" id="primary-navigation" aria-label="Primary navigation"><a class="brand" href="/?env=production"><span class="dot"></span><span>ts-cloud</span></a><div class="sidebar-context"><span class="context-label">Project</span><strong>acme</strong></div><div class="environment-picker" aria-label="Environment"><span class="context-label">Environment</span><details><summary class="environment-current production"><span>PROD</span><strong>production</strong></summary></details></div><button class="command-trigger" type="button" aria-keyshortcuts="Meta+K Control+K"><span>Search resources</span><kbd>⌘ K</kbd></button><div class="nav-groups"><section class="nav-group"><h2>Overview</h2><a class="" href="/?env=production">Dashboard</a><a href="/server/activity?env=production">Activity</a></section><section class="nav-group"><h2>Applications</h2><a class="" href="/server/sites?env=production">Services</a><a class="" href="/server/deployments?env=production">Deployments</a><a class="" href="/server/logs?env=production">Logs</a><a class="" href="/integrations?env=production">Git integrations</a><a class="" href="/applications/new?env=production">Create application</a><a class="" href="/applications/compose?env=production">Compose applications</a></section><section class="nav-group"><h2>Operations</h2><a class="" href="/operations/queue?env=production">Deployment queue</a><a class="" href="/operations/previews?env=production">Preview environments</a><a class="" href="/operations/releases?env=production">Releases & promotion</a><a class="" href="/operations/regions?env=production">Regions & failover</a><a class="" href="/operations/maintenance?env=production">Maintenance & DR</a><a class="" href="/operations/workloads?env=production">Workloads</a><a class="" href="/operations/observability?env=production">Observability</a><a class="" href="/operations/alerts?env=production">Alerts & health</a><a href="/server/metrics?env=production">Metrics</a><a href="/server/services?env=production">Runtime services</a><a class="" href="/operations/jobs?env=production">Workers & schedules</a><a class="" href="/operations/configuration?env=production">Environment &amp; secrets</a><a class="" href="/data/backups?env=production">Backups &amp; recovery</a><a class="" href="/data/volumes?env=production">Persistent volumes</a><a href="/server/actions?env=production">Run operations</a></section><section class="nav-group"><h2>Infrastructure</h2><a class="" href="/data/services?env=production">Data services</a><a class="" href="/data/volumes?env=production">Persistent volumes</a><a href="/server/firewall?env=production">Network & firewall</a><a href="/server/ssh-keys?env=production">SSH keys</a><a class="" href="/server/fleet?env=production">Fleet inventory</a><a class="" href="/server/capacity?env=production">Capacity & placement</a><a href="/security?env=production">Security posture</a><a href="/server/terminal?env=production">Terminal</a></section><section class="nav-group"><h2>Organization</h2><a class="" href="/server/team?env=production">People & access</a><a class="" href="/account/automation?env=production">API & automation</a></section><section class="nav-group"><h2>Account</h2><a class="" href="/account/security?env=production">Sign-in & security</a></section></div><form method="post" action="/api/logout" class="signout"><button type="submit">Sign out</button></form></aside><dialog class="command-palette" aria-labelledby="command-title"><div class="command-search"><span aria-hidden="true">⌕</span><input type="search" placeholder="Search services, domains, deployments…" aria-label="Search resources" autocomplete="off"><button type="button" class="command-close" aria-label="Close search">Esc</button></div><h2 id="command-title" class="sr-only">Search resources and navigation</h2><div class="command-status" role="status">Start typing to search this project.</div><section class="saved-views" aria-labelledby="saved-views-title"><div class="saved-views-heading"><h3 id="saved-views-title">Saved views</h3><form class="save-view-form"><label class="sr-only" for="save-view-name">Saved view name</label><input id="save-view-name" maxlength="64" placeholder="Name this view" autocomplete="off"><button type="submit">Save current filters</button></form></div><div class="saved-view-list"></div></section><form class="tag-result-form"><label for="tag-result-name">Tag selected resource</label><input id="tag-result-name" maxlength="32" placeholder="customer-facing" pattern="[A-Za-z0-9][A-Za-z0-9 -]{0,31}" autocomplete="off"><input class="tag-color" type="color" value="#5a8be0" aria-label="Tag color"><button type="submit">Add tag</button></form><div class="command-results" role="listbox" aria-label="Search results"></div><footer><span>↑ ↓ navigate</span><span>Enter open</span><span>Esc close</span></footer></dialog><div class="context-bar" aria-label="Current scope"><div class="context-path"><div class="context-breadcrumb"><span>acme</span><i>/</i><strong>production</strong></div><div class="context-filters" aria-label="Active filters"></div></div><span class="scope-safety production">Production scope</span></div> <script data-stx-scoped>
84
84
  (function() {
85
85
  var { state, derived, effect, batch, onMount, onDestroy, defineStore, useStore, useFetch, useRef, useQuery, useMutation, useOptimistic, useDebounce, useDebouncedValue, useThrottle, useInterval, useTimeout, useToggle, useCounter, useClickOutside, useFocus, useAsync, useLocalStorage, useSessionStorage, useCookie, useReactiveProp, useEventListener, useWebSocket, useColorMode, useDark, useHead, useSeoMeta, definePageMeta, useRoute, useSearchParams, navigate, goBack, goForward, provide, ref, reactive, computed, watch, watchEffect, defineProps, withDefaults, defineEmits, defineExpose, defineSlots } = window.stx;
86
86
  var __destroyHooks = [];
@@ -423,7 +423,7 @@ var { opOutput, opShown, pending, typed, busy, confirmTok, confirmVerb, confirmD
423
423
 
424
424
 
425
425
  if (!window.stx._scopes) window.stx._scopes = {};
426
- window.stx._scopes['stx_scope_nav_38'] = { __destroyCallbacks: __destroyHooks };
426
+ window.stx._scopes['stx_scope_nav_47'] = { __destroyCallbacks: __destroyHooks };
427
427
  })();
428
428
  </script> <div class="wrap"><div class="crumbs"><a href="/serverless">Serverless</a><span class="sep">/</span> Deployments</div><header class="page"><div><h1>Deployments</h1><p>Every deploy publishes an immutable artifact; activation is atomic and rollback flips back instantly.</p></div><div class="header-actions"><button class="btn danger sm" type="button" @click="askOp('rollback', 'acme', 'roll back acme to the previous build', 'rollback')">Roll back</button><button class="btn sm" type="button" @click="askOp('redeploy', 'acme', 'redeploy acme', 'redeploy')">Redeploy</button></div></header><div class="section"><div class="panel"><table><thead><tr><th scope="col">Build</th><th scope="col">Status</th><th scope="col">Version</th><th scope="col">Deploy hooks</th><th scope="col">By</th><th scope="col">Took</th><th scope="col">When</th></tr></thead><tbody><tr><td class="mono">a4d63d2</td><td><span class="pill ok">success</span></td><td class="mono">v7</td><td class="mono" style="font-size:11px;color:var(--txt3)">composer install --no-dev · config:cache · route:cache · migrate --force</td><td style="color:var(--txt2)">chris</td><td class="mono">41s</td><td style="color:var(--txt3)">12m ago</td></tr><tr><td class="mono">9557430</td><td><span class="pill ok">success</span></td><td class="mono">v6</td><td class="mono" style="font-size:11px;color:var(--txt3)">config:cache · route:cache · migrate --force</td><td style="color:var(--txt2)">ci</td><td class="mono">38s</td><td style="color:var(--txt3)">2h ago</td></tr><tr><td class="mono">c38fc09</td><td><span class="pill ok">success</span></td><td class="mono">v5</td><td class="mono" style="font-size:11px;color:var(--txt3)">migrate --force</td><td style="color:var(--txt2)">ci</td><td class="mono">44s</td><td style="color:var(--txt3)">1d ago</td></tr><tr><td class="mono">5a2b284</td><td><span class="pill warn">rolled-back</span></td><td class="mono">v4</td><td class="mono" style="font-size:11px;color:var(--txt3)">-</td><td style="color:var(--txt2)">chris</td><td class="mono">12s</td><td style="color:var(--txt3)">1d ago</td></tr></tbody></table><div class="op-confirm panel" @show="pending() !== null" role="group" aria-labelledby="op-confirm-prompt" x-cloak><span id="op-confirm-prompt" x-cloak>Type <b class="mono" x-cloak>{{ confirmTok() }}</b> to {{ confirmVerb() }}:</span><input data-stx-ref="opConfirmInput" class="op-confirm-input" :value="typed()" @input="typed.set($event.target.value)" @keydown.enter="runOp()" placeholder="confirm" autocomplete="off" aria-labelledby="op-confirm-prompt"><button type="button" class="btn sm" :class="{ danger: confirmDanger() }" :disabled="!canRun()" @click="runOp()" x-cloak>{{ confirmLabel() }}</button><button type="button" class="btn ghost sm" :disabled="busy()" @click="cancelOp()">Cancel</button></div><pre class="action-output op-output" @show="opShown()" aria-live="polite" x-cloak>{{ opOutput() }}</pre><p class="note">Rollback restores the previous build's code and env and flips the live alias back instantly. Redeploy re-activates the current build without rebuilding.</p></div></div></div> <script data-stx-scoped>
429
429
  (function() {