cashmachine/cashmachine.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Duncan&rsquo;s Cash Machine</title>
    <link rel="stylesheet" type="text/css" href="../main.css" />
    <link rel="icon" href="https://www.duncanritchie.co.uk/favicon.ico" type="image/x-icon" />
    <link rel="icon" href="https://www.duncanritchie.co.uk/favicon-96x96.png" type="image/png" />
</head>
<body>
    <main>
        <h1>Duncan&rsquo;s Cash Machine</h1>
        <p class="explanation">This is a simple simulation of a cash machine, demonstrating browser alerts, if/else statements, and simple manipulation of JavaScript variables and HTML text.<br />
            Your starting PIN is 1234 and your starting balance is £1000.<br />
            This is a very generous cash machine because you can add to your balance by completing a quiz about JavaScript and Git.
            Answers are case-insensitive, but otherwise yours have to match mine exactly.<br />
            Click a button to withdraw cash, view your balance, play the quiz, or change your PIN.</p>
        <div id="cashMachine">
            <button class="cash-machine-button" onclick="launchPrompt()">Withdraw cash / View balance / Play quiz</button><button class="cash-machine-button" onclick="changePinPrompt()">Change PIN</button>
            <p id="Message"></p>
        </div>
    </main>
    <footer>
        <ul>
            <li>
                <a href="https://www.duncanritchie.co.uk" title="Duncan Ritchie&rsquo;s website">
                    Made by Duncan Ritchie
                </a>
            </li>
            <li>
                <a href="../" title="Duncan Ritchie&rsquo;s game page">
                    Games homepage
                </a>
            </li>
            <li>
                <a href="https://github.com/DuncanRitchie/jsChallenges/tree/main/cashmachine" title="Code on GitHub">
                    See the code
                </a>
            </li>
        </ul>
    </footer>
    <script src="cashmachine.js"></script>
</body>
</html>