improve styling for login box and alert box,

delete modal dialog alert box on close

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2023-04-28 23:53:38 +00:00
parent fd26f81e30
commit b959d3b872
2 changed files with 6 additions and 5 deletions

View File

@ -22,7 +22,7 @@
</nav>
</header>
<main>
<div class="w3-card w3-margin w3-container w3-display-middle">
<div class="w3-card w3-margin w3-container w3-display-middle w3-padding">
<h2 class="w3-center">Proxmox VE Login</h2>
<form>
<label for="username"><b>Username</b></label>
@ -36,9 +36,6 @@
</div>
</form>
</div>
<div class="w3-container w3-center w3-margin">
<output id="status"> </output>
</div>
</main>
</body>
</html>

View File

@ -52,12 +52,16 @@ export function alert (message) {
`;
let dialog = document.createElement("dialog");
dialog.classList.add("w3-card-4");
dialog.classList.add("w3-card");
dialog.classList.add("w3-container");
dialog.append(form);
document.body.append(dialog);
dialog.showModal();
dialog.addEventListener("close", () => {
dialog.parentElement.removeChild(dialog);
})
}
customElements.define("dialog-form", Dialog);