first

public/stats.html

@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="styles.css" />
+  </head>
+  <body>
+    <main class="stats-layout">
+      <section class="panel panel-main">
+        <header class="stats-header">
+          <a href="index.html" class="btn">back</a>
+        </header>
+        <ul></ul>
+        <div class="stats-grid-large">
+          <article class="stat-card">
+            <p>rounds played</p>
+            <strong id="sTotalRounds">0</strong>
+          </article>
+          <article class="stat-card">
+            <p>top wpm</p>
+            <strong id="sBestWpm">0</strong>
+          </article>
+          <article class="stat-card">
+            <p>base accuracy</p>
+            <strong id="sBestAcc">0%</strong>
+          </article>
+          <article class="stat-card">
+            <p>average wpm</p>
+            <strong id="sAvgWpm">0</strong>
+          </article>
+          <article class="stat-card">
+            <p>average accuracy</p>
+            <strong id="sAvgAcc">0%</strong>
+          </article>
+        </div>
+
+        <section class="results" style="margin-top: 1rem">
+          <h2>recents</h2>
+          <ul></ul>
+          <ul id="historyList" class="history-list"></ul>
+        </section>
+      </section>
+    </main>
+
+    <script src="stats.js"></script>
+  </body>
+</html>