small style improvements

This commit is contained in:
Arthur Lu 2023-05-02 03:42:58 +00:00
parent 4d4edaa025
commit d351fdfb67
3 changed files with 22 additions and 20 deletions

View File

@ -26,23 +26,25 @@
<main> <main>
<section class="w3-container"> <section class="w3-container">
<h2>Account</h2> <h2>Account</h2>
<div class="flex row wrap w3-card"> <div class="w3-card w3-padding">
<p id="username">Username: </p> <div class="flex row wrap">
<p id="pool">Pool: </p> <p id="username">Username: </p>
<p id="vmid">VMID Range: </p> <p id="pool">Pool: </p>
</div> <p id="vmid">VMID Range: </p>
<div class="w3-card"> </div>
<table id="resource-table" class="w3-table w3-table-all" style="overflow-x: auto;"> <div class="">
<thead> <table id="resource-table" class="w3-table w3-table-all" style="overflow-x: auto;">
<tr class="w3-black"> <thead>
<th>Resource</th> <tr class="w3-black">
<th>Used</th> <th>Resource</th>
<th>Free</th> <th>Used</th>
<th>Total</th> <th>Free</th>
</tr> <th>Total</th>
</thead> </tr>
<tbody></tbody> </thead>
</table> <tbody></tbody>
</table>
</div>
</div> </div>
</section> </section>
</main> </main>

View File

@ -32,7 +32,7 @@ async function populateInstances () {
instances.sort((a, b) => (a.vmid > b.vmid) ? 1 : -1); instances.sort((a, b) => (a.vmid > b.vmid) ? 1 : -1);
instanceContainer.innerHTML = ` instanceContainer.innerHTML = `
<div class="w3-row w3-hide-small w3-border-bottom"> <div class="w3-row w3-hide-small w3-border-bottom w3-border-black">
<div class="w3-col l1 m2"> <div class="w3-col l1 m2">
<p>VM ID</p> <p>VM ID</p>
</div> </div>

View File

@ -9,7 +9,7 @@ export class Instance extends HTMLElement {
shadowRoot.innerHTML = ` shadowRoot.innerHTML = `
<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">
<div class="w3-row w3-border-bottom"> <div class="w3-row">
<div class="w3-col l1 m2 s6"> <div class="w3-col l1 m2 s6">
<p id="instance-id"></p> <p id="instance-id"></p>
</div> </div>