add password form to account,

fix form input grid styling
This commit is contained in:
Arthur Lu 2023-10-31 18:13:40 +00:00
parent 9b3a1e8cad
commit a736c3019e
2 changed files with 18 additions and 1 deletions

View File

@ -9,6 +9,7 @@
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/nav.css"> <link rel="stylesheet" href="css/nav.css">
<link rel="stylesheet" href="css/form.css">
<script src="scripts/account.js" type="module"></script> <script src="scripts/account.js" type="module"></script>
<script src="scripts/chart.js" type="module"></script> <script src="scripts/chart.js" type="module"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
@ -62,6 +63,19 @@
<p id="vmid">VMID Range:</p> <p id="vmid">VMID Range:</p>
<p id="nodes">Nodes:</p> <p id="nodes">Nodes:</p>
</div> </div>
<div class="w3-card w3-padding">
<h3>Password</h3>
<form id="password-form">
<div class="input-grid" style="grid-template-columns: auto auto 1fr;">
<label for="new-password">New Password</label>
<input class="w3-input w3-border" type="password" id="new-password">
<span></span>
<label for="confirm-password">Confirm Password</label>
<input class="w3-input w3-border" type="password" id="confirm-password">
<span></span>
</div>
</form>
</div>
<div class="w3-card w3-padding"> <div class="w3-card w3-padding">
<h3>Cluster Resources</h3> <h3>Cluster Resources</h3>
<div id="resource-container"></div> <div id="resource-container"></div>

View File

@ -1,5 +1,4 @@
.input-grid { .input-grid {
float: left;
display: grid; display: grid;
column-gap: 10px; column-gap: 10px;
row-gap: 5px; row-gap: 5px;
@ -34,6 +33,10 @@ fieldset > *:last-child {
margin-bottom: 8px; margin-bottom: 8px;
} }
fieldset > .input-grid {
float: left;
}
body:not(:-moz-handler-blocked) fieldset { body:not(:-moz-handler-blocked) fieldset {
display: table-cell; display: table-cell;
} }