48 lines
1.5 KiB
HTML
48 lines
1.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}404 - Not Found{% endblock %}
|
|
{% block description %}The page you are looking for does not exist.{% endblock %}
|
|
|
|
{% block head %}
|
|
<link rel="stylesheet" href="/static/css/404.css">
|
|
<link rel="stylesheet" href="/static/css/cap.css">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<section>
|
|
<h1>404</h1>
|
|
<p>
|
|
It seems like the thing you are looking for is not here :[
|
|
<br><br>
|
|
while you're here, why not play some snake? (use wasd to move, not mobile compatable :<)
|
|
</p>
|
|
<canvas id="snakeCanvas"></canvas>
|
|
</section>
|
|
<section class="flex-row">
|
|
<section class="min-width">
|
|
<h2>Submit score</h2>
|
|
<form id="snakeForm">
|
|
<input type="text" id="name" placeholder="Your name" required>
|
|
<cap-widget id="cap" data-cap-api-endpoint="https://cap.alfieking.dev/57d36430b9cb/api/"></cap-widget>
|
|
<button type="submit" id="submit">Submit</button>
|
|
</form>
|
|
</section>
|
|
<section class="max-width" id="snakeLeaderboardSection">
|
|
<h2>Leaderboard</h2>
|
|
<ul id="snakeLeaderboard">
|
|
{% for score in scores %}
|
|
<li>
|
|
<span>{{ score.position }}</span>
|
|
<span>{{ score.name }}</span>
|
|
<span>{{ score.score }}</span>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script src="/static/js/snake.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/@cap.js/widget"></script>
|
|
{% endblock %} |