Add stats to MainApp, dark theme, new font.

src/components/login.js

@@ -7,7 +7,7 @@ export default (player) => {
 		return (
 			<div className="login">
 				<div className="wrapper">
-					<input type="text" placeholder="Token ID" value={input} className="nes-input"
+					<input type="text" placeholder="Token ID" value={input} className="nes-input is-dark"
 						onChange={evt => setInput(evt.target.value)} />
 					<button className="nes-btn is-primary"
 						onClick={

src/components/mainapp.js

@@ -1,18 +1,34 @@
 import React from "react";
+import { useState } from "react";
 import PropTypes from "prop-types";
 
-export default () => {
+export default (player) => {
 	function MainApp(props) {
+		const [ playerStats, setPlayerStats ] = useState(null);
+		const token = localStorage.getItem("token");
+		if (playerStats === null)
+			player.player(token).then((res) => setPlayerStats(res));
 		return (
 			<div className="main">
 				<header>
-					<p>Questable</p>
-					<button
+					<h1 className="nes-text is-primary">Questable</h1>
+					<button className="nes-btn is-error"
 						onClick={() => {
 							props.setLoggedIn(false);
 							localStorage.removeItem("token");
 						}}>Logout</button>
 				</header>
+				<div className="body">
+					<div className="stats lists">
+						{ playerStats === null ? "Loading" :
+							<ul className="nes-list is-circle">
+								<li> XP: {playerStats.xp} </li>
+								<li> Quests: {playerStats.quests_completed}/{playerStats.total_quests} </li>
+								<li> Side Quests: {playerStats.side_quests_completed}/{playerStats.total_side_quests} </li>
+							</ul>
+						}
+					</div>
+				</div>
 			</div>
 		);
 	}