fix(static): Switch log items from div/span to ul/li

TaserudConsulting · Jun 8, 2024 · 2283003 · 2283003
1 parent 84d796b
commit 2283003
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/static/index.html b/static/index.html
@@ -39,11 +39,11 @@ <h1 @click="selectedServer = null">goprocmgr</h1>
                     <div x-show="!selectedServer" id="frontpage" x-text="serverList.length === 0 ? 'No servers configured yet :)' : 'Select a server to view its logs :)'"></div>
                     <div x-show="selectedServer && !getServer(selectedServer)?.running" id="frontpage">Server "<span x-text="selectedServer"></span>" is currently not started :)</div>
                     <div x-show="selectedServer && getServer(selectedServer)?.running">
-                        <div id="logs-wrapper">
+                        <ul id="logs-wrapper">
                             <template x-for="line in [...getServer(selectedServer)?.logs ?? []].reverse()">
-                                <div :class="{ 'stdout': line.output === 'stdout', 'stderr': line.output === 'stderr' }" x-text="line.message"></div>
+                                <li :class="{ 'stdout': line.output === 'stdout', 'stderr': line.output === 'stderr' }" x-text="line.message"></li>
                             </template>
-                        </div>
+                        </ul>
                     </div>
                 </div>
             </div>

diff --git a/static/style.css b/static/style.css
@@ -117,17 +117,20 @@ body {
     height: 100%;
 }
 
-#app div#content div#logs-wrapper {
-    height: 100%;
+#app div#content ul#logs-wrapper {
     font-size: 0.8rem;
+    height: 100%;
+    list-style: none;
+    margin: 0;
     overflow: auto;
+    padding: 0;
 }
 
-#app div#content div#logs-wrapper div.stdout {
+#app div#content ul#logs-wrapper li.stdout {
     background-color: var(--stdout-bg-color);
 }
 
-#app div#content div#logs-wrapper div.stderr {
+#app div#content ul#logs-wrapper li.stderr {
     background-color: var(--stderr-bg-color);
 }