new create page logic

This commit is contained in:
Alec
2021-11-08 23:38:41 -05:00
parent f861339884
commit 226b0c25e2
16 changed files with 656 additions and 12 deletions

View File

@@ -15,16 +15,49 @@
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="../styles/GLOBAL.css">
<link rel="stylesheet" href="../styles/create.css">
<link rel="stylesheet" href="../styles/modal.css">
</head>
<body>
<div id="add-role-modal-background" class="modal-background" style="display: none"></div>
<div id="add-role-modal" class="modal" style="display: none">
<form id="add-role-form">
<div>
<label for="role-name">Role Name</label>
<input id="role-name" type="text" placeholder="Name your role..."/>
</div>
<div>
<label for="role-description">Description</label>
<textarea style="resize:none" id="role-description" rows="10" cols="30" placeholder="Describe your role..."></textarea>
</div>
</form>
<button id="close-modal-button">Close</button>
</div>
<h1>Create A Game</h1>
<h3>
Creating a game gives you the moderator role. You will not be dealt a card. You will know everyone's role and can
remove any player from the game. You can also play/pause the optional timer and, if desired, delegate your moderator
role to any other player.
Creating a game gives you the moderator role with certain special permissions. You will not be dealt a card.
</h3>
<div id="custom-roles-container">
<label for="add-card-to-deck-form">Custom Roles</label>
<form id="add-card-to-deck-form"></form>
<button id="custom-role-btn">Create Custom Role</button>
</div>
<div id="deck-container">
<label for="deck">Game Deck: 0 Players</label>
<div id="deck"></div>
</div>
<form id="game-form">
<div>
<label for="game-time">Timer (Optional)</label>
<div id="game-time">
<label for="game-hours">Hours (max 5)</label>
<input type="number" id="game-hours" name="game-hours"
min="0" max="5" placeholder="e.g. 1"/>
<label for="game-hours">Minutes</label>
<input type="number" id="game-minutes" name="game-minutes"
min="0" max="60" placeholder="e.g. 30"/>
</div>
</div>
<input id="create-game" type="submit" value="Create"/>
</form>
<script type="module">
import { create } from "../scripts/create.js";