<!doctype html> <html class="no-js" lang=""> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>SNAILS</title> <link rel="stylesheet" href="css/style.css" /> <meta name="description" content="Snails are your friends, they help you make decisions" /> <meta property="og:title" content="SNAILS" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://snailrace.app" /> <meta property="og:image" content="https://snailrace.app/icon.png" /> <link rel="icon" href="/favicon.ico" sizes="any" /> <link rel="apple-touch-icon" href="icon.png" /> <link rel="preload" href="static/SNAIL.png" /> <link rel="preload" href="static/snail.mp3" as="audio" type="audio/mp3" /> <link rel="manifest" href="site.webmanifest" /> <meta name="theme-color" content="#fafafa" /> <script defer src="js/snailscript.js" type="application/javascript" ></script> </head> <body> <main id="track"> <aside class="top-controls"> <button id="restart_race" onclick="api.resetCreatorState(false)">New Race</button> <button id="restart_race_but_not_aggressively" onclick="api.resetCreatorState(true)">New Race (Keep Snails)</button> </aside> <!-- Snails go here :3 --> </main> <template id="snail_track"> <section class="lane"> <figure class="snail"> <img class="snail-image" src="static/SNAIL.png" alt="Snail (Placeholder)" /> </figure> <span class="lane-description"></span> <img src="static/FinishLine.png" width="30" height="100" class="lane-end" alt="" role="presentation" /> </section> </template> <template id="snail_namer"> <div class="snail-input-row"> <input class="snail_name_input" type="text" value="" placeholder="Name your snail" /> <button class="remove-snail fill danger">Remove</button> </div> </template> <div class="assets"> <audio src="static/snail.mp3" loop id="audio_track"></audio> </div> <div class="dialog-container" aria-labelledby="aria-dialog-title" role="dialog" aria-modal="true" id="dialog_setup" > <div class="backdrop coverage"></div> <div class="dialog-inner coverage"> <div class="dialog-content-wrapper"> <div class="dialog-content shadow"> <h2 id="aria-dialog-title" class="dialog-title list-spacing">SNAILS</h2> <p class="list-spacing"> Snails are your friends, and help you make decisions </p> <div id="dialog_input_list" class="dialog-inputs list-spacing"> <div class="snail-input-row"> <input class="snail_name_input" name="snail_0" id="snail_0" type="text" value="" placeholder="Name your snail" /> <button class="remove-snail fill danger">Remove</button> </div> </div> <div class="controls"> <button id="button_race_snails">Race Those Snails</button> <button id="button_add_snail">Another Snail</button> <!-- <div class="hello_vspace_micheal_here"></div>--> <!-- <button id="button_speed_opt">x2</button>--> <!-- <button id="button_mute">Mute</button>--> </div> </div> </div> </div> </div> </body> </html>