Spaces:
Sleeping
Sleeping
File size: 2,804 Bytes
097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d 6340f89 097168d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sentinel Arbitrage Engine</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
<script src="https://unpkg.com/[email protected]"></script>
<style>
:root { font-family: 'SF Mono', 'Consolas', 'Menlo', monospace; }
body { background-color: #111927; color: #E5E7EB; font-size: 14px; }
.container { max-width: 1280px; margin: 1.5rem auto; padding: 0 1rem; }
header { text-align: center; margin-bottom: 1.5rem; }
h1 { color: #38BDF8; margin-bottom: 0; }
table { width: 100%; border-collapse: collapse; }
th { background-color: #374151; text-align: left; }
td, th { padding: 0.75rem 1rem; border-bottom: 1px solid #374151; }
.buy { color: #34D399; } .sell { color: #F87171; }
.risk-low { color: #34D399; } .risk-medium { color: #FBBF24; } .risk-high { color: #F87171; }
.status-bar { font-size: 14px; color: #9CA3AF; text-align: right; margin-bottom: 1rem; }
tbody tr { animation: fadeIn 0.5s ease-out; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
</style>
</head>
<body>
<main class="container">
<header>
<h1>Sentinel Arbitrage Engine</h1>
</header>
<div class="status-bar grid">
<div>Engine Status: <span style="color: #34D399;">ONLINE</span></div>
<div id="pnl-ticker" style="text-align: right;">Simulated P/L: $0.00</div>
</div>
<article data-theme="dark" style="padding: 0; overflow-x: auto;">
<table>
<thead>
<tr>
<th>Time (UTC)</th>
<th>Pair</th>
<th>Oracle 1 (Pyth)</th>
<th>Oracle 2 (Agg.)</th>
<th>Discrepancy</th>
<th>AI Risk</th>
<th>AI Strategy</th>
</tr>
</thead>
<!-- This table body will be completely replaced every 2 seconds -->
<tbody
id="opportunities-table"
hx-get="/api/signals"
hx-trigger="load, every 2s"
hx-swap="innerHTML">
<tr id="placeholder-row">
<td colspan="7" style="text-align:center; padding: 2rem;" aria-busy="true">
Awaiting first signal from engine...
</td>
</tr>
</tbody>
</table>
</article>
</main>
</body>
</html> |