mirror of
https://github.com/ansible/awx.git
synced 2026-01-15 03:40:42 -03:30
Update style to match latest mockup
This commit is contained in:
parent
5c10ce3082
commit
3096a58272
@ -2,6 +2,7 @@
|
||||
font-family: monospace;
|
||||
|
||||
&-controls {
|
||||
color: @at-gray-dark-4x;
|
||||
border: 1px solid @at-gray-dark-2x;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
@ -9,29 +10,34 @@
|
||||
}
|
||||
|
||||
&-controlIcon {
|
||||
font-size: 16px;
|
||||
font-size: 12px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
&-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 {
|
||||
background-color: @at-gray-light-2x;
|
||||
color: @at-gray-dark-4x;
|
||||
background-color: @at-gray-light;
|
||||
|
||||
padding-right: 5px;
|
||||
border-right: 1px solid gray;
|
||||
border-right: 1px solid @at-gray-dark;
|
||||
}
|
||||
|
||||
&-content {
|
||||
padding-left: 5px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
&-timestamp {
|
||||
padding-left: 20px;
|
||||
font-size: 12px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
&-output {
|
||||
|
||||
@ -55,6 +55,7 @@ function parseLine (event) {
|
||||
|
||||
const { stdout } = event;
|
||||
const lines = stdout.split('\r\n');
|
||||
const isTruncated = (event.end_line - event.start_line) > lines.length;
|
||||
|
||||
let ln = event.start_line;
|
||||
|
||||
@ -63,17 +64,32 @@ function parseLine (event) {
|
||||
|
||||
const time = getTime(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)}`;
|
||||
}, '');
|
||||
}
|
||||
|
||||
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) {
|
||||
content = hasAnsi(content) ? ansi.toHtml(content) : content;
|
||||
|
||||
let expand = '';
|
||||
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 `
|
||||
|
||||
@ -7,16 +7,28 @@
|
||||
<div class="col-md-8">
|
||||
<at-panel class="at-Stdout">
|
||||
<div class="at-Stdout-controls">
|
||||
<div class="pull-left"><i class="at-Stdout-controlIcon fa fa-minus-circle"></i></div>
|
||||
<div class="pull-right"><i class="at-Stdout-controlIcon fa fa-arrow-circle-down"></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-down"></i></div>
|
||||
<div class="at-u-clear"></div>
|
||||
</div>
|
||||
|
||||
<pre class="at-Stdout-output">
|
||||
<table>
|
||||
<tbody ng-bind-html="vm.html"></tbody>
|
||||
</table>
|
||||
</pre>
|
||||
<pre class="at-Stdout-output"><table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="at-Stdout-expand"> </th>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user