mirror of
https://github.com/ansible/awx.git
synced 2026-03-29 06:45:09 -02:30
Update style to match latest mockup
This commit is contained in:
committed by
Jake McDermott
parent
5c10ce3082
commit
3096a58272
@@ -2,6 +2,7 @@
|
|||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
||||||
&-controls {
|
&-controls {
|
||||||
|
color: @at-gray-dark-4x;
|
||||||
border: 1px solid @at-gray-dark-2x;
|
border: 1px solid @at-gray-dark-2x;
|
||||||
border-top-left-radius: 4px;
|
border-top-left-radius: 4px;
|
||||||
border-top-right-radius: 4px;
|
border-top-right-radius: 4px;
|
||||||
@@ -9,29 +10,34 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-controlIcon {
|
&-controlIcon {
|
||||||
font-size: 16px;
|
font-size: 12px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-expand {
|
&-expand {
|
||||||
background-color: @at-gray-light-2x;
|
color: @at-gray-dark-4x;
|
||||||
|
background-color: @at-gray-light;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
padding: 0 10px;
|
padding: 0 20px 0 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-lineNumber {
|
&-lineNumber {
|
||||||
background-color: @at-gray-light-2x;
|
color: @at-gray-dark-4x;
|
||||||
|
background-color: @at-gray-light;
|
||||||
|
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
border-right: 1px solid gray;
|
border-right: 1px solid @at-gray-dark;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-content {
|
&-content {
|
||||||
padding-left: 5px;
|
padding-left: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-timestamp {
|
&-timestamp {
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-output {
|
&-output {
|
||||||
|
|||||||
@@ -55,6 +55,7 @@ function parseLine (event) {
|
|||||||
|
|
||||||
const { stdout } = event;
|
const { stdout } = event;
|
||||||
const lines = stdout.split('\r\n');
|
const lines = stdout.split('\r\n');
|
||||||
|
const isTruncated = (event.end_line - event.start_line) > lines.length;
|
||||||
|
|
||||||
let ln = event.start_line;
|
let ln = event.start_line;
|
||||||
|
|
||||||
@@ -63,17 +64,32 @@ function parseLine (event) {
|
|||||||
|
|
||||||
const time = getTime(event, i);
|
const time = getTime(event, i);
|
||||||
const group = getGroup(event, i);
|
const group = getGroup(event, i);
|
||||||
|
const isLastLine = i === lines.length - 1;
|
||||||
|
|
||||||
|
if (isTruncated && isLastLine) {
|
||||||
|
return `${html}${createRow(ln, line, time, group)}${createTruncatedRow()}`;
|
||||||
|
}
|
||||||
|
|
||||||
return `${html}${createRow(ln, line, time, group)}`;
|
return `${html}${createRow(ln, line, time, group)}`;
|
||||||
}, '');
|
}, '');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function createTruncatedRow () {
|
||||||
|
return `
|
||||||
|
<tr class="">
|
||||||
|
<td class="at-Stdout-expand"></td>
|
||||||
|
<td class="at-Stdout-lineNumber text-center"><i class="fa fa-long-arrow-down"></i></td>
|
||||||
|
<td class="at-Stdout-content"></td>
|
||||||
|
<td class="at-Stdout-timestamp"></td>
|
||||||
|
</tr>`;
|
||||||
|
}
|
||||||
|
|
||||||
function createRow (ln, content, time, group) {
|
function createRow (ln, content, time, group) {
|
||||||
content = hasAnsi(content) ? ansi.toHtml(content) : content;
|
content = hasAnsi(content) ? ansi.toHtml(content) : content;
|
||||||
|
|
||||||
let expand = '';
|
let expand = '';
|
||||||
if (group.parent) {
|
if (group.parent) {
|
||||||
expand = '<i class="fa fa-caret-down" ng-click="vm.toggle(group.level)"></i>';
|
expand = '<i class="fa fa-chevron-down" ng-click="vm.toggle(group.level)"></i>';
|
||||||
}
|
}
|
||||||
|
|
||||||
return `
|
return `
|
||||||
|
|||||||
@@ -7,16 +7,28 @@
|
|||||||
<div class="col-md-8">
|
<div class="col-md-8">
|
||||||
<at-panel class="at-Stdout">
|
<at-panel class="at-Stdout">
|
||||||
<div class="at-Stdout-controls">
|
<div class="at-Stdout-controls">
|
||||||
<div class="pull-left"><i class="at-Stdout-controlIcon fa fa-minus-circle"></i></div>
|
<div class="pull-left"><i class="at-Stdout-controlIcon fa fa-minus"></i></div>
|
||||||
<div class="pull-right"><i class="at-Stdout-controlIcon fa fa-arrow-circle-down"></i></div>
|
<div class="pull-right"><i class="at-Stdout-controlIcon fa fa-arrow-down"></i></div>
|
||||||
<div class="at-u-clear"></div>
|
<div class="at-u-clear"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<pre class="at-Stdout-output">
|
<pre class="at-Stdout-output"><table>
|
||||||
<table>
|
<thead>
|
||||||
<tbody ng-bind-html="vm.html"></tbody>
|
<tr>
|
||||||
</table>
|
<th class="at-Stdout-expand"> </th>
|
||||||
</pre>
|
<th class="at-Stdout-lineNumber"></th>
|
||||||
|
<th class="at-Stdout-content"></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody ng-bind-html="vm.html"></tbody>
|
||||||
|
<tfoot>
|
||||||
|
<tr>
|
||||||
|
<td class="at-Stdout-expand"> </td>
|
||||||
|
<td class="at-Stdout-lineNumber"></td>
|
||||||
|
<td class="at-Stdout-content"></td>
|
||||||
|
<td class="at-Stdout-backToTop"><i class="fa fa-caret-up"></i> <span>Back to Top</span></td>
|
||||||
|
</tr>
|
||||||
|
</tfoot></table></pre>
|
||||||
</at-panel>
|
</at-panel>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user