fixed standard out layout for non playbook run jobs

This commit is contained in:
John Mitchell
2016-06-21 15:14:45 -04:00
parent 41baa7d28d
commit 3642a1f4de
7 changed files with 79 additions and 55 deletions

View File

@@ -5,7 +5,7 @@
@import '../shared/layouts/one-plus-one.less'; @import '../shared/layouts/one-plus-one.less';
@breakpoint-md: 1200px; @breakpoint-md: 1200px;
@breakpoint-sm: 420px; @breakpoint-sm: 623px;
.JobDetail-tasks.section{ .JobDetail-tasks.section{
margin-top:40px; margin-top:40px;

View File

@@ -36,7 +36,7 @@
flex: 1 1; flex: 1 1;
height: @height; height: @height;
width: 100%; width: 100%;
max-wdith: 50%; max-width: 50%;
margin-right: 0px; margin-right: 0px;
.Panel{ .Panel{
height: 100%; height: 100%;

View File

@@ -16,12 +16,12 @@
<div class="StandardOut-details"> <div class="StandardOut-details">
<div class="StandardOut-detailsRow" ng-show="job.module_name"> <div class="StandardOut-detailsRow" ng-show="job.module_name">
<div class="StandardOut-detailsLabel">Name</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Name</div>
<div class="StandardOut-detailsContent">{{ job.module_name }}</div> <div class="StandardOut-detailsContent">{{ job.module_name }}</div>
</div> </div>
<div class="StandardOut-detailsRow"> <div class="StandardOut-detailsRow">
<div class="StandardOut-detailsLabel">STATUS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STATUS</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<i class="fa icon-job-{{ job.status }}"></i> <i class="fa icon-job-{{ job.status }}"></i>
<span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span> <span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span>
@@ -29,33 +29,33 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.started"> <div class="StandardOut-detailsRow" ng-show="job.started">
<div class="StandardOut-detailsLabel">STARTED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STARTED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.started | longDate }} {{ job.started | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">FINISHED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">FINISHED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.finished | longDate }} {{ job.finished | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">ELAPSED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">ELAPSED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.elapsed }} seconds {{ job.elapsed }} seconds
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.module_args"> <div class="StandardOut-detailsRow" ng-show="job.module_args">
<div class="StandardOut-detailsLabel">Module Args</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Module Args</div>
<div class="StandardOut-detailsContent">{{ job.module_args }}</div> <div class="StandardOut-detailsContent">{{ job.module_args }}</div>
</div> </div>
<div class="StandardOut-detailsRow"> <div class="StandardOut-detailsRow">
<div class="StandardOut-detailsLabel">Inventory</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Inventory</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a href="{{ inventory_url }}" <a href="{{ inventory_url }}"
aw-tool-tip="The inventory this command ran on." aw-tool-tip="The inventory this command ran on."
@@ -64,7 +64,7 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="credential_name"> <div class="StandardOut-detailsRow" ng-show="credential_name">
<div class="StandardOut-detailsLabel">Credential</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Credential</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a href="{{ credential_url }}" <a href="{{ credential_url }}"
aw-tool-tip="The credential used to run this command." aw-tool-tip="The credential used to run this command."
@@ -73,7 +73,7 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="created_by"> <div class="StandardOut-detailsRow" ng-show="created_by">
<div class="StandardOut-detailsLabel">Launched By</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Launched By</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a href="/#/users/{{ created_by.id }}" <a href="/#/users/{{ created_by.id }}"
aw-tool-tip="The user who ran this command." aw-tool-tip="The user who ran this command."
@@ -84,19 +84,19 @@
<!-- since zero is a falsy value, you need ng-show such that <!-- since zero is a falsy value, you need ng-show such that
the number is >= 0 --> the number is >= 0 -->
<div class="StandardOut-detailsRow" ng-show="forks >= 0"> <div class="StandardOut-detailsRow" ng-show="forks >= 0">
<div class="StandardOut-detailsLabel">Forks</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Forks</div>
<div class="StandardOut-detailsContent">{{ forks }}</div> <div class="StandardOut-detailsContent">{{ forks }}</div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="limit"> <div class="StandardOut-detailsRow" ng-show="limit">
<div class="StandardOut-detailsLabel">Limit</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Limit</div>
<div class="StandardOut-detailsContent">{{ limit }}</div> <div class="StandardOut-detailsContent">{{ limit }}</div>
</div> </div>
<!-- since zero is a falsy value, you need ng-show such that <!-- since zero is a falsy value, you need ng-show such that
the number is >= 0 --> the number is >= 0 -->
<div class="StandardOut-detailsRow" ng-show="verbosity >= 0"> <div class="StandardOut-detailsRow" ng-show="verbosity >= 0">
<div class="StandardOut-detailsLabel">Verbosity</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">Verbosity</div>
<div class="StandardOut-detailsContent">{{ verbosity }}</div> <div class="StandardOut-detailsContent">{{ verbosity }}</div>
</div> </div>
</div> </div>

View File

@@ -16,7 +16,7 @@
<div class="StandardOut-details"> <div class="StandardOut-details">
<div class="StandardOut-detailsRow" ng-show="inventory_source_name"> <div class="StandardOut-detailsRow" ng-show="inventory_source_name">
<div class="StandardOut-detailsLabel">NAME</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">NAME</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a href="{{inv_manage_group_link}}"> <a href="{{inv_manage_group_link}}">
{{ inventory_source_name }} {{ inventory_source_name }}
@@ -25,7 +25,7 @@
</div> </div>
<div class="StandardOut-detailsRow"> <div class="StandardOut-detailsRow">
<div class="StandardOut-detailsLabel">STATUS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STATUS</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<i class="fa icon-job-{{ job.status }}"></i> <i class="fa icon-job-{{ job.status }}"></i>
<span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span> <span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span>
@@ -33,42 +33,42 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="{{job.license_error !== null}}"> <div class="StandardOut-detailsRow" ng-show="{{job.license_error !== null}}">
<div class="StandardOut-detailsLabel">LICENSE ERROR</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">LICENSE ERROR</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.license_error }} {{ job.license_error }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.started"> <div class="StandardOut-detailsRow" ng-show="job.started">
<div class="StandardOut-detailsLabel">STARTED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STARTED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.started | longDate }} {{ job.started | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">FINISHED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">FINISHED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.finished | longDate }} {{ job.finished | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">ELAPSED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">ELAPSED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.elapsed }} seconds {{ job.elapsed }} seconds
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.launch_type"> <div class="StandardOut-detailsRow" ng-show="job.launch_type">
<div class="StandardOut-detailsLabel">LAUNCH TYPE</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">LAUNCH TYPE</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.launch_type }} {{ job.launch_type }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="credential_name"> <div class="StandardOut-detailsRow" ng-show="credential_name">
<div class="StandardOut-detailsLabel">CREDENTIAL</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">CREDENTIAL</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a ui-sref="credentials.edit({credential_id: credential})"> <a ui-sref="credentials.edit({credential_id: credential})">
{{ credential_name }} {{ credential_name }}
@@ -77,7 +77,7 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="inventory_source_name"> <div class="StandardOut-detailsRow" ng-show="inventory_source_name">
<div class="StandardOut-detailsLabel">GROUP</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">GROUP</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a href="{{inv_manage_group_link}}"> <a href="{{inv_manage_group_link}}">
{{ inventory_source_name }} {{ inventory_source_name }}
@@ -86,28 +86,28 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="source"> <div class="StandardOut-detailsRow" ng-show="source">
<div class="StandardOut-detailsLabel">SOURCE</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">SOURCE</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ source }} {{ source }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="source_regions"> <div class="StandardOut-detailsRow" ng-show="source_regions">
<div class="StandardOut-detailsLabel">REGIONS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">REGIONS</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ source_regions }} {{ source_regions }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="{{ job.overwrite !== null }}"> <div class="StandardOut-detailsRow" ng-show="{{ job.overwrite !== null }}">
<div class="StandardOut-detailsLabel">OVERWRITE</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">OVERWRITE</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.overwrite }} {{ job.overwrite }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="{{ job.overwrite_vars !== null }}"> <div class="StandardOut-detailsRow" ng-show="{{ job.overwrite_vars !== null }}">
<div class="StandardOut-detailsLabel">OVERWRITE VARS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">OVERWRITE VARS</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.overwrite_vars }} {{ job.overwrite_vars }}
</div> </div>

View File

@@ -15,12 +15,12 @@
<div class="StandardOut-details"> <div class="StandardOut-details">
<div class="StandardOut-detailsRow" ng-show="job.name"> <div class="StandardOut-detailsRow" ng-show="job.name">
<div class="StandardOut-detailsLabel">NAME</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">NAME</div>
<div class="StandardOut-detailsContent">{{ job.name }}</div> <div class="StandardOut-detailsContent">{{ job.name }}</div>
</div> </div>
<div class="StandardOut-detailsRow"> <div class="StandardOut-detailsRow">
<div class="StandardOut-detailsLabel">STATUS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STATUS</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<i class="fa icon-job-{{ job.status }}"></i> <i class="fa icon-job-{{ job.status }}"></i>
<span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span> <span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span>
@@ -28,28 +28,28 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.started"> <div class="StandardOut-detailsRow" ng-show="job.started">
<div class="StandardOut-detailsLabel">STARTED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STARTED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.started | longDate }} {{ job.started | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">FINISHED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">FINISHED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.finished | longDate }} {{ job.finished | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">ELAPSED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">ELAPSED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.elapsed }} seconds {{ job.elapsed }} seconds
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.launch_type"> <div class="StandardOut-detailsRow" ng-show="job.launch_type">
<div class="StandardOut-detailsLabel">LAUNCH TYPE</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">LAUNCH TYPE</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.launch_type }} {{ job.launch_type }}
</div> </div>
@@ -59,7 +59,7 @@
<div class="StandardOut-detailsLabel">EXTRA VARS</div> <div class="StandardOut-detailsLabel">EXTRA VARS</div>
</div> </div>
<div ng-show="job.extra_vars"> <div class="StandardOut-extraVarsContainer" ng-show="job.extra_vars">
<textarea rows="6" ng-model="variables" name="variables" class="StandardOut-extraVars" id="pre-formatted-variables"></textarea> <textarea rows="6" ng-model="variables" name="variables" class="StandardOut-extraVars" id="pre-formatted-variables"></textarea>
</div> </div>

View File

@@ -16,7 +16,7 @@
<div class="StandardOut-details"> <div class="StandardOut-details">
<div class="StandardOut-detailsRow" ng-show="project_name"> <div class="StandardOut-detailsRow" ng-show="project_name">
<div class="StandardOut-detailsLabel">NAME</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">NAME</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a ui-sref="projects.edit({id: job.project})"> <a ui-sref="projects.edit({id: job.project})">
{{ project_name }} {{ project_name }}
@@ -25,7 +25,7 @@
</div> </div>
<div class="StandardOut-detailsRow"> <div class="StandardOut-detailsRow">
<div class="StandardOut-detailsLabel">STATUS</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STATUS</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<i class="fa icon-job-{{ job.status }}"></i> <i class="fa icon-job-{{ job.status }}"></i>
<span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span> <span class="StandardOut-statusText StandardOut--capitalize">{{ job.status }}</span>
@@ -33,35 +33,35 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.started"> <div class="StandardOut-detailsRow" ng-show="job.started">
<div class="StandardOut-detailsLabel">STARTED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">STARTED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.started | longDate }} {{ job.started | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">FINISHED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">FINISHED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.finished | longDate }} {{ job.finished | longDate }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.finished"> <div class="StandardOut-detailsRow" ng-show="job.finished">
<div class="StandardOut-detailsLabel">ELAPSED</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">ELAPSED</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
{{ job.elapsed }} seconds {{ job.elapsed }} seconds
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="job.launch_type"> <div class="StandardOut-detailsRow" ng-show="job.launch_type">
<div class="StandardOut-detailsLabel">LAUNCH TYPE</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">LAUNCH TYPE</div>
<div class="StandardOut-detailsContent StandardOut--capitalize"> <div class="StandardOut-detailsContent StandardOut--capitalize">
{{ job.launch_type }} {{ job.launch_type }}
</div> </div>
</div> </div>
<div class="StandardOut-detailsRow" ng-show="project_name"> <div class="StandardOut-detailsRow" ng-show="project_name">
<div class="StandardOut-detailsLabel">PROJECT</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">PROJECT</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a ui-sref="projects.edit({id: job.project})"> <a ui-sref="projects.edit({id: job.project})">
{{ project_name }} {{ project_name }}
@@ -70,7 +70,7 @@
</div> </div>
<div class="StandardOut-detailsRow" ng-show="credential_name"> <div class="StandardOut-detailsRow" ng-show="credential_name">
<div class="StandardOut-detailsLabel">CREDENTIAL</div> <div class="StandardOut-detailsLabel col-lg-2 col-md-2 col-sm-2 col-xs-3">CREDENTIAL</div>
<div class="StandardOut-detailsContent"> <div class="StandardOut-detailsContent">
<a ui-sref="credentials.edit({credential_id: credential})"> <a ui-sref="credentials.edit({credential_id: credential})">
{{ credential_name }} {{ credential_name }}

View File

@@ -1,8 +1,10 @@
@import "../shared/branding/colors.default.less"; @import "../shared/branding/colors.default.less";
@import "awx/ui/client/src/shared/layouts/one-plus-two.less"; @import "../shared/layouts/one-plus-one.less";
/** @define StandardOut */ /** @define StandardOut */
@breakpoint-md: 900px;
standard-out-log { standard-out-log {
flex: 5; flex: 5;
display: flex; display: flex;
@@ -13,8 +15,9 @@ standard-out-log {
padding: 0 20px 0 20px; padding: 0 20px 0 20px;
font-family: Menlo,Monaco,Consolas,"Courier New",monospace; font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
} }
.StandardOut-container { .StandardOut-container {
.OnePlusTwo-container; .OnePlusOne-container(100%, @breakpoint-md);
&.fullscreen { &.fullscreen {
.StandardOut-rightPanel { .StandardOut-rightPanel {
@@ -24,14 +27,18 @@ standard-out-log {
} }
.StandardOut-leftPanel { .StandardOut-leftPanel {
.OnePlusTwo-left--panel(590px); .OnePlusOne-panel--left(100%, @breakpoint-md);
max-width: 600px;
@media (max-width: @breakpoint-md - 1px) {
max-width: 100%;
}
} }
.StandardOut-rightPanel { .StandardOut-rightPanel {
.OnePlusTwo-right--panel(590px); .OnePlusOne-panel--right(100%, @breakpoint-md);
max-width: 100%;
@media (min-width: 900px) { @media (max-width: @breakpoint-md - 1px) {
max-width: 50%; padding-right: 15px;
} }
.Panel { .Panel {
@@ -45,7 +52,7 @@ standard-out-log {
} }
.StandardOut-panelHeader { .StandardOut-panelHeader {
.OnePlusTwo-panelHeader .OnePlusOne-panelHeader
} }
.StandardOut-consoleOutput { .StandardOut-consoleOutput {
@@ -64,11 +71,16 @@ standard-out-log {
} }
.StandardOut-details { .StandardOut-details {
.OnePlusTwo-left--details; display: flex;
flex-wrap: wrap;
flex-direction: row;
padding-top: 25px;
} }
.StandardOut-detailsRow { .StandardOut-detailsRow {
.OnePlusTwo-left--detailsRow; width: 100%;
display: flex;
margin: 0 -15px;
} }
.StandardOut-detailsRow + .StandardOut-detailsRow { .StandardOut-detailsRow + .StandardOut-detailsRow {
@@ -76,15 +88,27 @@ standard-out-log {
} }
.StandardOut-detailsRow--extraVars { .StandardOut-detailsRow--extraVars {
margin-bottom: 10px; margin: 20px 0;
width: 100%;
}
.StandardOut-extraVarsContainer {
width: 100%;
padding-right: 15px;
} }
.StandardOut-detailsLabel { .StandardOut-detailsLabel {
.OnePlusTwo-left--detailsLabel; flex: 2.5 0 auto;
text-transform: uppercase;
color: @default-interface-txt;
} }
.StandardOut-detailsContent { .StandardOut-detailsContent {
.OnePlusTwo-left--detailsContent; width: 40%;
flex: 1 0 auto;
padding: 0px 29px;
text-transform: none;
word-wrap: break-word;
} }
.StandardOut-statusText { .StandardOut-statusText {