66 lines
4.4 KiB
HTML
66 lines
4.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>{% block title %}Artifex{% endblock %}</title>
|
|
<style>
|
|
:root { --bg: #f6f2ea; --panel: #fffdfa; --line: #d8cfc2; --ink: #162033; --muted: #685f55; --accent: #284c7e; --danger: #9f2d2d; --warn: #9b681c; --ok: #23704a; }
|
|
* { box-sizing: border-box; }
|
|
body { margin: 0; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--ink); background: var(--bg); }
|
|
a { color: var(--accent); text-decoration: none; }
|
|
a:hover { text-decoration: underline; }
|
|
.shell { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
|
|
nav { border-right: 1px solid var(--line); background: #ede6da; padding: 1.25rem; position: sticky; top: 0; height: 100vh; }
|
|
nav h1 { font-size: 1.15rem; letter-spacing: .12em; margin: 0 0 1.5rem; }
|
|
nav a { display: block; padding: .55rem .65rem; border-radius: 8px; color: var(--ink); }
|
|
nav a:hover { background: rgba(40, 76, 126, .09); text-decoration: none; }
|
|
main { padding: 1.5rem; max-width: 1480px; width: 100%; }
|
|
header.page { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; }
|
|
h2, h3 { margin-bottom: .4rem; }
|
|
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
|
|
.card, .panel { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 1rem; margin-bottom: 1rem; box-shadow: 0 1px 0 rgba(0,0,0,.03); }
|
|
.metric { font-size: 2rem; font-weight: 760; line-height: 1; }
|
|
.muted { color: var(--muted); }
|
|
.badge { display: inline-block; padding: .18rem .45rem; border-radius: 999px; border: 1px solid var(--line); background: #f4efe6; font-size: .75rem; font-weight: 700; letter-spacing: .04em; }
|
|
.badge.COMPLETE, .badge.PASS, .badge.HEALTHY, .badge.APPROVED { color: var(--ok); border-color: rgba(35,112,74,.35); }
|
|
.badge.FAILED, .badge.FAIL, .badge.DEGRADED, .badge.REJECTED { color: var(--danger); border-color: rgba(159,45,45,.35); }
|
|
.badge.RUNNING, .badge.PAUSED, .badge.WATCH, .badge.PENDING { color: var(--warn); border-color: rgba(155,104,28,.35); }
|
|
table { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
|
|
th, td { text-align: left; padding: .65rem .75rem; border-bottom: 1px solid var(--line); vertical-align: top; }
|
|
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); background: #f1eadf; }
|
|
tr:last-child td { border-bottom: 0; }
|
|
button, .button { border: 1px solid var(--accent); color: white; background: var(--accent); border-radius: 8px; padding: .45rem .7rem; cursor: pointer; font-weight: 650; }
|
|
button.secondary, .button.secondary { color: var(--ink); background: transparent; border-color: var(--line); }
|
|
.actions { display: flex; gap: .4rem; flex-wrap: wrap; }
|
|
pre { white-space: pre-wrap; word-break: break-word; background: #201d19; color: #f8f2e8; padding: .8rem; border-radius: 10px; max-height: 360px; overflow: auto; }
|
|
.timeline { border-left: 3px solid var(--line); margin-left: .5rem; padding-left: 1rem; }
|
|
.node { margin: .5rem 0; }
|
|
@media (max-width: 860px) { .shell { grid-template-columns: 1fr; } nav { position: static; height: auto; } nav a { display: inline-block; } main { padding: 1rem; } }
|
|
</style>
|
|
{% block head %}{% endblock %}
|
|
</head>
|
|
<body>
|
|
<div class="shell">
|
|
<nav aria-label="Primary navigation">
|
|
<h1>ARTIFEX</h1>
|
|
<a href="/">Dashboard</a>
|
|
<a href="/projects/">Projects</a>
|
|
<a href="/model-studio/">Model Studio</a>
|
|
<a href="/trading-studio/">Trading Studio</a>
|
|
<a href="/agents/">Agents</a>
|
|
<a href="/progeny/">Progeny</a>
|
|
<a href="/steward/">Steward</a>
|
|
<a href="/roadmap/">Roadmap</a>
|
|
<a href="/scenario-lab/">Scenario Lab</a>
|
|
<a href="/approvals/">Approvals</a>
|
|
<a href="/resources/">Resources</a>
|
|
<a href="/activity/">Activity</a>
|
|
<a href="/admin/">Settings</a>
|
|
</nav>
|
|
<main id="main">
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
</div>
|
|
</body>
|
|
</html>
|