updated log-UI for small screens

src/ansibleguy-webui/aw/static/css/aw.css

@@ -589,6 +589,7 @@ td div hr {
 
 .aw-execution-logs {
     white-space: pre-wrap;
+    word-break: break-word;
     padding: 1% 1.5%;
     color: var(--awSoftWhite);
     background-color: var(--awLogs);

src/ansibleguy-webui/aw/static/css/aw_mobile.css

@@ -68,6 +68,11 @@
     .aw-responsive-med {
         display: none;
     }
+
+    .aw-execution-logs {
+        font-size: small;
+    }
+
 }
 
 @media only screen and (max-width: 500px) {  /* mobile devices */
@@ -107,7 +112,6 @@
     .aw-responsive-med {
         display: none;
     }
-
 }
 
 @include media-breakpoint-between(xs,sm){

src/ansibleguy-webui/aw/static/js/jobs/logs.js

@@ -57,22 +57,23 @@ function addLogLines($this) {
 }
 
 function updateApiTableDataJobLogs(row, row2, entry) {
+    row.innerHTML = document.getElementById('aw-api-data-tmpl-row').innerHTML;
     row.setAttribute("id_job", entry.job);
     row.setAttribute("id_execution", entry.id);
     row2.setAttribute("id_execution", entry.id);
 
-    row.insertCell(0).innerHTML = shortExecutionStatus(entry);
-    row.insertCell(1).innerText = entry.job_name;
+    row.cells[0].innerHTML = shortExecutionStatus(entry);
+    row.cells[1].innerText = entry.job_name;
     if (entry.job_comment == "") {
-        row.insertCell(2).innerText = "-";
+        row.cells[2].innerText = "-";
     } else {
-        row.insertCell(2).innerText = entry.job_comment;
+        row.cells[2].innerText = entry.job_comment;
     }
 
     let actionsTemplate = document.getElementById("aw-api-data-tmpl-actions").innerHTML;
     actionsTemplate = actionsTemplate.replaceAll('${ID}', entry.id);
     actionsTemplate = actionsTemplate.replaceAll('${JOB_ID}', entry.job);
-    row.insertCell(3).innerHTML = actionsTemplate;
+    row.cells[3].innerHTML = actionsTemplate;
 
     let logsTemplates = document.getElementById("aw-api-data-tmpl-logs").innerHTML;
     logsTemplates = logsTemplates.replaceAll('${ID}', entry.id);

src/ansibleguy-webui/aw/templates/jobs/logs.html

@@ -14,8 +14,14 @@
         <tr>
             <th>Run</th>
             <th>Job</th>
-            <th>Comment</th>
-            <th>Show Logs</th>
+            <th class="aw-responsive-med">Comment</th>
+            <th>Actions</th>
+        </tr>
+        <tr id="aw-api-data-tmpl-row" hidden="hidden">
+            <td></td>
+            <td></td>
+            <td class="aw-responsive-med"></td>
+            <td></td>
         </tr>
     </table>
     <div id="aw-api-data-tmpl-actions" hidden="hidden">