diff options
Diffstat (limited to 'main.html')
| -rw-r--r-- | main.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/main.html b/main.html new file mode 100644 index 0000000..b3f2f0a --- /dev/null +++ b/main.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html lang="en" data-theme="light"> + <head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Match Up!</title> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/notyf@3/notyf.min.css"> + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@1.0.4/css/bulma.min.css"> + <link rel="stylesheet" href="index.css"> + </head> + <body> + <section class="section"> + <nav class="navbar" role="navigation" aria-label="main navigation"> + <div class="navbar-brand"> + <div class="navbar-item"> + <img src="icon.png"> + </div> + <div class="navbar-item"> + Match Up + </div> + </div> + <div class="navbar-end"> + <div class="field is-grouped is-grouped-right"> + <button class="button is-medium is-dark" id="timer-dec">-</button> + <input class="input is-medium is-dark" id="timer-display" type="text" readonly></input> + <button class="button is-medium is-dark" id="timer-inc">+</button> + <button class="button is-medium is-dark" id="timer-start">Start</button> + <button class="button is-medium is-dark" id="timer-stop">Stop</button> + </div> + </div> + </nav> + <div class="container"> + <section class="section"> + <table class="table is-fullwidth"> + <thead> + <tr><th colspan="5"><div id="game_description"></div></th></tr> + <tr> + <th>Court</th> + <th colspan='2' style="text-align: center;">Team 1</th> + <th colspan='2' style="text-align: center;">Team 2</th> + </tr> + </thead> + <tbody id="game_list"></tbody> + </table> + </section> + <section class="section"> + <div class="field is-grouped is-grouped-centered"> + <button class="button is-medium is-dark" id="propose">Propose</button> + <div class="select is-medium is-dark"> + <select name="skill" id="skill"> + <option value="10">All Levels</option> + <option value="5">2 Levels</option> + <option value="3">3 Levels</option> + <option value="1">Skill Based</option> + </select> + </div> + <button class="button is-medium is-dark" id="confirm">Confirm</button> + <button class="button is-medium is-danger" id="reset">Reset</button> + </div> + </section> + <section class="section"> + <h1 class="title">Courts</h1> + <div id="court_list" class="button-grid"></div> + </section> + <section class="section"> + <h1 class="title">Regulars</h1> + <div id="regular_list" class="button-grid"></div> + </section> + <section class="section"> + <h1 class="title">Guests</h1> + <div id="guest_list" class="button-grid"></div> + </section> + <section class="section"> + <h1 class="title">Player Update</h1> + <div id="player-load" class="file is-danger has-name is-boxed"> + <label class="file-label"> + <input class="file-input" type="file" name="players" accept=".csv"/> + <span class="file-cta"> + <span class="file-icon"> + <i class="fas fa-cloud-upload-alt"></i> + </span> + <span class="file-label"> Update players... </span> + </span> + <span class="file-name"> No file selected... </span> + </label> + </div> + </section> + </div> + </section> + <script src="index.js" type="module"></script> + <script src="timer.js"></script> + <script src="https://cdn.jsdelivr.net/npm/notyf@3/notyf.min.js"></script> + </body> + <footer class="footer"> + <div class="content has-text-centered"> + <p> + <strong>Match Up</strong> made with ❤️ by <a href="https://karanj.com">Karan</a>. The source code is licensed <a href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">CC BY-SA 4.0</a>. Logo from <a href="https://www.flaticon.com/free-icons/shuttle-cock" title="shuttle cock icons">Flaticon</a>. + </p> + </div> + </footer> +</html>
\ No newline at end of file |