From f4efad714f248498eeaca40b21cf3ab87405a426 Mon Sep 17 00:00:00 2001
From: Chris Houseknecht <chouse@ansible.com>
Date: Sat, 22 Mar 2014 18:36:39 -0400
Subject: [PATCH] More tweaks to pop-over formating.

---
 awx/ui/static/js/forms/JobTemplates.js         | 16 ++++++++--------
 awx/ui/static/js/helpers/Hosts.js              |  4 ++--
 awx/ui/static/less/ansible-ui.less             | 16 +++++++++++++++-
 awx/ui/static/lib/ansible/generator-helpers.js |  2 +-
 4 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/awx/ui/static/js/forms/JobTemplates.js b/awx/ui/static/js/forms/JobTemplates.js
index 0ae218142e..eac75d070e 100644
--- a/awx/ui/static/js/forms/JobTemplates.js
+++ b/awx/ui/static/js/forms/JobTemplates.js
@@ -223,10 +223,10 @@ angular.module('JobTemplateFormDefinition', [])
                 column: 2,
                 awPopOver: "<p>Create a callback URL a host can use to contact Tower and request a configuration update " +
                     "using the job template.  The URL will look like the following:</p>\n" +
-                    "<p class=\"code-breakable\">http://your.server.com:999/api/v1/job_templates/1/callback/</p>" +
+                    "<pre>http://your.server.com:999/api/v1/job_templates/1/callback/</pre>" +
                     "<p>The request from the host must be a POST. Here is an example using curl:</p>\n" +
-                    "<p class=\"code-breakable\">curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
-                    "http://your.server.com:999/api/v1/job_templates/1/callback/</p>\n" +
+                    "<pre>curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
+                    "http://your.server.com:999/api/v1/job_templates/1/callback/</pre>\n" +
                     "<p>Note the requesting host must be defined in your inventory. If ansible fails to locate the host either by name or IP address " +
                     "in one of your defined inventories, the request will be denied.</p>" +
                     "<p>Successful requests will result in an entry on the Jobs tab, where the results and history can be viewed.</p>",
@@ -243,11 +243,10 @@ angular.module('JobTemplateFormDefinition', [])
                 ngShow: "allow_callbacks",
                 column: 2,
                 required: false,
-                'class': 'span12',
                 awPopOver: "<p>Using this URL a host can contact Tower and request a configuration update using the job " +
                     "template. The request from the host must be a POST. Here is an example using curl:</p>\n" +
-                    "<p class=\"code-breakable\">curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
-                    "http://your.server.com:999/api/v1/job_templates/1/callback/</p>\n" +
+                    "<pre>curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
+                    "http://your.server.com:999/api/v1/job_templates/1/callback/</pre>\n" +
                     "<p>Note the requesting host must be defined in your inventory. If ansible fails to locate the host either by name or IP address " +
                     "in one of your defined inventories, the request will be denied.</p>" +
                     "<p>Successful requests will result in an entry on the Jobs tab, where the results and history can be viewed.</p>",
@@ -263,9 +262,10 @@ angular.module('JobTemplateFormDefinition', [])
                 column: 2,
                 awPopOver: "<p>When contacting the Tower server using the callback URL, the calling host must authenticate by including " +
                     "this key in the POST data of the request. Here's an example using curl:</p>\n" +
-                    "<p class=\"code-breakable\">curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
-                    "http://your.server.com:999/api/v1/job_templates/1/callback/</p>\n",
+                    "<pre>curl --data \"host_config_key=5a8ec154832b780b9bdef1061764ae5a\" " +
+                    "http://your.server.com:999/api/v1/job_templates/1/callback/</pre>\n",
                 dataPlacement: 'right',
+                dataTitle: "Host Config Key",
                 dataContainer: "body"
             }
         },
diff --git a/awx/ui/static/js/helpers/Hosts.js b/awx/ui/static/js/helpers/Hosts.js
index 2165711644..dfe508b2e7 100644
--- a/awx/ui/static/js/helpers/Hosts.js
+++ b/awx/ui/static/js/helpers/Hosts.js
@@ -88,7 +88,7 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H
                             return -1 * (a - b);
                         });
                     title = "Recent Jobs";
-                    html = "<table class=\"table table-condensed host-flyout\" style=\"width: 100%\">\n";
+                    html = "<table class=\"table table-condensed flyout\" style=\"width: 100%\">\n";
                     html += "<thead>\n";
                     html += "<tr>\n";
                     html += "<th>ID</td>\n";
@@ -106,7 +106,7 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H
                             "aw-tool-tip=\"" + job.status.charAt(0).toUpperCase() + job.status.slice(1) +
                             ". Click for details\" data-placement=\"top\"><i class=\"fa icon-job-" +
                             job.status + "\"></i></a></td>\n";
-                        html += "<td><a href=\"/#/jobs/" + job.id + "/job_events/?host=" + encodeURI(host.name) + "\">Events</a> " +
+                        html += "<td><a href=\"/#/jobs/" + job.id + "/job_events/?host=" + encodeURI(host.name) + "\">Events</a><br />" +
                             "<a href=\"/#/jobs/" + job.id + "/job_host_summaries/?host_name=" + encodeURI(host.name) + "\">Hosts</a></td>\n";
                         html += "<td class=\"break\">" + ellipsis(job.name) + "</td>\n";
                         html += "</tr>\n";
diff --git a/awx/ui/static/less/ansible-ui.less b/awx/ui/static/less/ansible-ui.less
index c74effc6c8..a4c33424fa 100644
--- a/awx/ui/static/less/ansible-ui.less
+++ b/awx/ui/static/less/ansible-ui.less
@@ -73,6 +73,10 @@ body.modal-open {
     text-overflow: ellipsis;
 }
 
+blockquote {
+    font-size: 14px;
+}
+
 .group-name {
     display: inline-block;
     width: 85%;
@@ -203,9 +207,19 @@ textarea {
 }
 
 /* TB tooltip overrides */
-  .popover-content, .popover-content {
+  .popover-content {
       width: 100%;
   }
+  h3.popover-title, .popover-content, .popover-content blockquote {
+      font-size: 12px;
+  }
+  .flyout thead> tr> th, .flyout tbody> tr> td {
+      font-size: 12px; 
+  }
+  .popover-title {
+      padding-top: 5px;
+      padding-bottom: 5px;
+  }
   .popover {
       z-index: 2000;
       max-width: 325px;
diff --git a/awx/ui/static/lib/ansible/generator-helpers.js b/awx/ui/static/lib/ansible/generator-helpers.js
index 21eba90f9e..51b51b9693 100644
--- a/awx/ui/static/lib/ansible/generator-helpers.js
+++ b/awx/ui/static/lib/ansible/generator-helpers.js
@@ -38,7 +38,7 @@ angular.module('GeneratorHelpers', ['GeneratorHelpers'])
                 break;
             case 'awPopOver':
                 // construct the entire help link
-                result = "<a id=\"awp-" + fld + "\" href=\"\" aw-pop-over=\'" + value + "<div class=\"popover-footer\"><span class=\"key\">esc</span> or click to exit</div>\' ";
+                result = "<a id=\"awp-" + fld + "\" href=\"\" aw-pop-over=\'" + value + "<div class=\"popover-footer\"><span class=\"key\">esc</span> or click to close</div>\' ";
                 result += (obj.dataPlacement) ? "data-placement=\"" + obj.dataPlacement + "\" " : "";
                 result += (obj.dataContainer) ? "data-container=\"" + obj.dataContainer + "\" " : "";
                 result += (obj.dataTitle) ? "data-title=\"" + obj.dataTitle + "\" " : "";