72 lines
2.9 KiB
HTML
72 lines
2.9 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<title>RPG Dices</title>
|
||
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
|
|
<link rel="stylesheet" href="style.css">
|
||
|
|
<script src="js/libs/sidebar/sidebar.js"></script>
|
||
|
|
<link href="js/libs/sidebar/sidebar.css" type="text/css" rel="stylesheet" />
|
||
|
|
<style>
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<label id="sidebar-toggle" class="sidebar-toggle" for="sidebar-toggle-input"><img src="./assets/menu.svg"></label>
|
||
|
|
<input id="sidebar-toggle-input" type="checkbox" role="button">
|
||
|
|
<div id="sidebar">
|
||
|
|
<label id="sidebar-toggle-close" class="sidebar-toggle text-fresh float-right" for="sidebar-toggle-input"><img
|
||
|
|
src="./assets/close.svg"></label>
|
||
|
|
<ul class="menu">
|
||
|
|
<li onclick="resetDices()"><img src="./assets/dices.svg"> Reset Dices</li>
|
||
|
|
<li onclick="clearHistory()"><img src="./assets/history.svg"> Clear History</li>
|
||
|
|
<li onclick="exportData()"><img src="./assets/export.svg"> Export Data</li>
|
||
|
|
<li><label><img src="./assets/import.svg"> Import Data
|
||
|
|
<input id="importFile" type="file" accept="application/json" />
|
||
|
|
</label>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<ul class="menu">
|
||
|
|
<li onclick="toggleDarkMode()"><img id="dark-mode-icon" src="./assets/dark.svg"><span id="dark-mode-text">Dark Mode</span></li>
|
||
|
|
</ul>
|
||
|
|
<script>
|
||
|
|
Sidebar();
|
||
|
|
</script>
|
||
|
|
</div>
|
||
|
|
<div class="container">
|
||
|
|
<div class="dices-container">
|
||
|
|
<div class="dices" id="dices"></div>
|
||
|
|
|
||
|
|
<div class="form" id="form">
|
||
|
|
<input min="1" value="1" type="number" id="inputCount">
|
||
|
|
D
|
||
|
|
<select value="6" id="inputSides" onchange="updateCustom()">
|
||
|
|
<option>4</option>
|
||
|
|
<option>6</option>
|
||
|
|
<option>8</option>
|
||
|
|
<option>10</option>
|
||
|
|
<option>12</option>
|
||
|
|
<option>20</option>
|
||
|
|
<option>100</option>
|
||
|
|
<option value="">custom</option>
|
||
|
|
</select>
|
||
|
|
<input class="hidden" min="2" value="2" type="number" id="inputCustom">
|
||
|
|
+
|
||
|
|
<input value="0" type="number" id="inputAddition">
|
||
|
|
<input value="" type="color" id="inputColor">
|
||
|
|
<button onclick="addDiceForm()"><img src="./assets/roll.svg"> Add Dice</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="history-container">
|
||
|
|
<div class="menu">
|
||
|
|
<button id="roll-button" onclick="rollSelected()"><img src="./assets/roll.svg"> Roll</button>
|
||
|
|
<button id="history-button" onclick="clearHistory()"><img src="./assets/history.svg"> Clear History</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="history" id="history"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="script.js"></script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|