tronnet/ProxmoxAAS-Dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

reduce div nesting in instances

Browse Source 
Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2023-05-15 20:41:31 +00:00
parent 9eb8aaa4be
commit bbc67fa6fb
1 changed files with 26 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
scripts/index.js
View File

@ -198,35 +198,34 @@ async function handleInstanceAdd () {
export class Instance { export class Instance {
constructor () { constructor () {
let shadowRoot = document.createElement("div"); let shadowRoot = document.createElement("div");
shadowRoot.classList.add("w3-row");
shadowRoot.innerHTML = ` shadowRoot.innerHTML = `
<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> <div class="w3-col l2 m3 s6">
<div class="w3-col l2 m3 s6"> <p id="instance-name"></p>
<p id="instance-name"></p> </div>
</div> <div class="w3-col l1 m2 w3-hide-small">
<div class="w3-col l1 m2 w3-hide-small"> <p id="instance-type"></p>
<p id="instance-type"></p> </div>
</div> <div class="w3-col l2 m3 s6 flex row nowrap">
<div class="w3-col l2 m3 s6 flex row nowrap"> <img id="instance-status-icon">
<img id="instance-status-icon"> <p id="instance-status"></p>
<p id="instance-status"></p> </div>
</div> <div class="w3-col l2 w3-hide-medium w3-hide-small">
<div class="w3-col l2 w3-hide-medium w3-hide-small"> <p id="node-name"></p>
<p id="node-name"></p> </div>
</div> <div class="w3-col l2 w3-hide-medium w3-hide-small flex row nowrap">
<div class="w3-col l2 w3-hide-medium w3-hide-small flex row nowrap"> <img id="node-status-icon">
<img id="node-status-icon"> <p id="node-status"></p>
<p id="node-status"></p> </div>
</div> <div class="w3-col l2 m2 s6 flex row nowrap" style="height: 1lh; margin-top: 15px; margin-bottom: 15px;">
<div class="w3-col l2 m2 s6 flex row nowrap" style="height: 1lh; margin-top: 15px; margin-bottom: 15px;"> <img id="power-btn" class="clickable">
<img id="power-btn" class="clickable"> <img id="console-btn" class="clickable">
<img id="console-btn" class="clickable"> <img id="configure-btn" class="clickable">
<img id="configure-btn" class="clickable"> <img id="delete-btn" class="clickable">
<img id="delete-btn" class="clickable">
</div>
</div> </div>
`; `;