web/webtools
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added a countdown timer

Browse source
This commit is contained in:
Leon Mika 2026-01-16 22:12:30 +11:00
parent 70a782d0e4
commit 89a6b4d062
6 changed files with 115 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

27
site/mental-arithmatic/index.html
View file

@ -2,25 +2,44 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content">
<title>Mental Arithmatic - Tools</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
<link rel="stylesheet" href="./style.css">
<script src="./scripts/main.js" type="module"></script>
</head>
<body>
<div id="welcome-card" class="container" data-controller="welcome"
<div id="welcome-card" class="container welcome-card" data-controller="welcome"
data-action="endGame@window->welcome#gameEnded">
<header>
<hgroup>
<h1>Mental Arithmatic</h1>
<h1>Fear of All Sums</h1>
<p>A simple mental arithmetic game</p>
</hgroup>
<main>
<button data-action="click->welcome#startGame">Start Game</button>
<article class="game-variant">
<h3>Simple Sums</h3>
<p>A two number sum with each term up to two digits.</p>
<footer>
<button data-action="click->welcome#startGame">Start Game</button>
<div class="high-scores" data-welcome-target="simpleHighScores"></div>
</footer>
</article>
</main>
</header>
</div>
<div id="countdown-card" class="container game-card hidden" data-controller="countdown"
data-action="startCountdown@window->countdown#start">
<header>
<span>2:00</span>
<span>0</span>
</header>
<main>
<div class="countdown-timer" data-countdown-target="countdown">3</div>
<input class="fake" type="number" data-countdown-target="fakeinput" value="0">
</main>
</div>
<div id="game-card" class="container game-card hidden" data-controller="game"
data-action="startGame@window->game#start">
<header>