76 lines
2.0 KiB
HTML
76 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Door Control</title>
|
|
<link rel="icon" href="img/favicon.png" type="img/png">
|
|
<link rel="apple-touch-icon" href="img/icon.png">
|
|
<script defer src="script.js"></script>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<nav class="app-bar">
|
|
<button id="open-setting-screen-button"><img src="img/settings2.png"></button>
|
|
<button id="close-setting-screen-button"><img src="img/home.png"></button>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Screen -->
|
|
<section class="screen-container main-screen">
|
|
<h1 class="app-bar">Main Door</h1>
|
|
|
|
<div id="message-container">
|
|
</div>
|
|
|
|
<div id="button-block">
|
|
|
|
<div class="button-container" id="delay-unlock-button">
|
|
<p>
|
|
<span id="show-delay"></span>
|
|
<span>Delay Unlock</span>
|
|
</p>
|
|
<img class="button-icon" src="img/clockwise.png" alt="Unlock Button">
|
|
</div>
|
|
|
|
<div class="button-container" id="unlock-button">
|
|
<p>Unlock Now</p>
|
|
<img class="button-icon" src="img/unlock.png" alt="Unlock Button">
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
<!-- Settings Screen -->
|
|
<section class="screen-container setting-screen"">
|
|
<h1 class="app-bar">Settings</h1>
|
|
|
|
<form class="settings-form">
|
|
<ul>
|
|
<li>
|
|
<label for="device-id">Device ID</label>
|
|
<input type="text" id="device-id" name="deviceID">
|
|
</li>
|
|
<li>
|
|
<label for="api-key">API Key</label>
|
|
<input type="text" id="api-key" name="apiKey">
|
|
</li>
|
|
<li>
|
|
<label for="delay-time">Delay</label>
|
|
<input type="number" min="0" id="delay-time" name="delayTime">
|
|
</li>
|
|
<li>
|
|
<button type="button" id="save-settings-button" name="saveSettings">Save</button>
|
|
</li>
|
|
</ul>
|
|
</form>
|
|
</section>
|
|
|
|
</body>
|
|
|
|
</html>
|