diff --git a/awx/ui/client/legacy-styles/lists.less b/awx/ui/client/legacy-styles/lists.less
index d1633a67d1..351bf3988b 100644
--- a/awx/ui/client/legacy-styles/lists.less
+++ b/awx/ui/client/legacy-styles/lists.less
@@ -43,7 +43,7 @@ table, tbody {
border-top-right-radius: 5px;
}
-.List-tableHeader--actions {
+.List-tableHeader--info, .List-tableHeader--actions {
text-align: right;
}
@@ -387,6 +387,21 @@ table, tbody {
border-left: 4px solid transparent;
}
+.List-infoCell {
+ display: flex;
+ justify-content: flex-end;
+ font-size: 0.8em;
+ cursor: pointer;
+}
+
+.List-infoCell a {
+ color: @default-icon;
+}
+
+.List-infoCell a:hover, .List-infoCell a:focus {
+ color: @default-interface-txt;
+}
+
@media (max-width: 991px) {
.List-searchWidget + .List-searchWidget {
margin-top: 20px;
diff --git a/awx/ui/client/src/partials/job-template-details.html b/awx/ui/client/src/partials/job-template-details.html
new file mode 100644
index 0000000000..0f23f741c6
--- /dev/null
+++ b/awx/ui/client/src/partials/job-template-details.html
@@ -0,0 +1,3 @@
+
diff --git a/awx/ui/client/src/shared/list-generator/list-generator.factory.js b/awx/ui/client/src/shared/list-generator/list-generator.factory.js
index 529e7e23e0..9f66266bc0 100644
--- a/awx/ui/client/src/shared/list-generator/list-generator.factory.js
+++ b/awx/ui/client/src/shared/list-generator/list-generator.factory.js
@@ -492,6 +492,21 @@ export default ['$location', '$compile', '$rootScope', 'Attr', 'Icon',
column-custom-class="${customClass}">
`;
+ if(list.fields.info) {
+ customClass = list.fields.name.modalColumnClass || '';
+ html += ``;
+ }
}
if (options.mode === 'select') {
html += "";
diff --git a/awx/ui/client/src/templates/main.js b/awx/ui/client/src/templates/main.js
index 7bc7dab18b..00b8d2381a 100644
--- a/awx/ui/client/src/templates/main.js
+++ b/awx/ui/client/src/templates/main.js
@@ -342,9 +342,16 @@ angular.module('templates', [surveyMaker.name, templatesList.name, jobTemplatesA
delete list.fields.smart_status;
delete list.fields.labels;
delete list.fieldActions;
- list.fields.name.columnClass = "col-md-11";
+ list.fields.name.columnClass = "col-md-8";
list.iterator = 'job_template';
list.name = 'job_templates';
+ list.fields.info = {
+ ngInclude: "'/static/partials/job-template-details.html'",
+ type: 'template',
+ columnClass: 'col-md-3',
+ label: '',
+ nosort: true
+ };
return list;
}