You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

62 lines
2.1 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>System Success - System Design Game</title>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap" rel="stylesheet"/>
<link rel="stylesheet" href="static/success.css">
</head>
<body>
<div id="page-container">
<div id="sd-header">
<h1 class="header-text">System Design Game</h1>
</div>
<div id="main-content" class="success-main-content">
<div class="success-container">
<h2 class="success-title">🏆 Mission Accomplished</h2>
<p class="success-subtitle">
Your architecture scaled successfully and met all performance targets. Well done!
</p>
<div class="failure-metrics">
<div class="metric-item">
<div class="metric-label">Target RPS</div>
<div class="metric-value">10,000</div>
</div>
<div class="metric-item">
<div class="metric-label">Achieved RPS</div>
<div class="metric-value success">10,417</div>
</div>
<div class="metric-item">
<div class="metric-label">Max Latency</div>
<div class="metric-value">200ms</div>
</div>
<div class="metric-item">
<div class="metric-label">Actual Latency</div>
<div class="metric-value success">87ms</div>
</div>
</div>
<div class="error-log">
<div>[INFO] System initialized and scaled successfully</div>
<div>[INFO] Load balancer handled traffic with 0% errors</div>
<div>[INFO] Cache hit ratio: 97%</div>
<div>[SUCCESS] SLA met - all objectives achieved</div>
</div>
<div class="action-buttons">
<button onclick="retryLevel()" class="action-button retry-button">
Replay Level
</button>
<a href="/game-modes" class="action-button menu-button">
Main Menu
</a>
</div>
</div>
</div>
</div>
</body>
</html>