Merge pull request #305 from jaredevantabor/tooltip-content

Tooltip content Audit on the UI

awx/ui/client/src/inventories-hosts/inventories/related/sources/sources.form.js

@@ -263,16 +263,9 @@ return {
             parseTypeName: 'envParseType',
             dataTitle: i18n._("Source Variables"),
             dataPlacement: 'right',
-            awPopOver: "<p>" + i18n._("Override variables found in openstack.yml and used by the inventory update script. For an example variable configuration ") +
+            awPopOver: i18n._(`Override variables found in openstack.yml and used by the inventory update script. For an example variable configuration
-                "<a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/openstack.yml\" target=\"_blank\">" +
+                <a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/openstack.yml\" target=\"_blank\">
-                i18n._("view openstack.yml in the Ansible github repo.") + "</a></p>" +
+                view openstack.yml in the Ansible github repo.</a> Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.`),
-                "<p>" + i18n._("Enter variables using either JSON or YAML syntax. Use the radio button to toggle between the two.") + "</p>" +
-                i18n._("JSON:") + "<br />\n" +
-                "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                i18n._("YAML:") + "<br />\n" +
-                "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n" +
-                "<p>" + i18n._("View JSON examples at ") + '<a href="http://www.json.org" target="_blank">www.json.org</a></p>' +
-                "<p>" + i18n._("View YAML examples at ") + '<a href="http://docs.ansible.com/YAMLSyntax.html" target="_blank">docs.ansible.com</a></p>',
             dataContainer: 'body',
             subForm: 'sourceSubForm'
         },
@@ -287,16 +280,9 @@ return {
             parseTypeName: 'envParseType',
             dataTitle: i18n._("Source Variables"),
             dataPlacement: 'right',
-            awPopOver: "<p>" + i18n._("Override variables found in openstack.yml and used by the inventory update script. For an example variable configuration ") +
+            awPopOver: i18n._(`Override variables found in cloudforms.ini and used by the inventory update script. For an example variable configuration
-                "<a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/cloudforms.ini\" target=\"_blank\">" +
+                <a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/cloudforms.ini\" target=\"_blank\">
-                i18n._("view openstack.yml in the Ansible github repo.") + "</a></p>" +
+                view cloudforms.ini in the Ansible github repo.</a> Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.`),
-                "<p>" + i18n._("Enter variables using either JSON or YAML syntax. Use the radio button to toggle between the two.") + "</p>" +
-                i18n._("JSON:") + "<br />\n" +
-                "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                i18n._("YAML:") + "<br />\n" +
-                "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n" +
-                "<p>" + i18n._("View JSON examples at ") + '<a href="http://www.json.org" target="_blank">www.json.org</a></p>' +
-                "<p>" + i18n._("View YAML examples at ") + '<a href="http://docs.ansible.com/YAMLSyntax.html" target="_blank">docs.ansible.com</a></p>',
             dataContainer: 'body',
             subForm: 'sourceSubForm'
         },
@@ -311,16 +297,9 @@ return {
             parseTypeName: 'envParseType',
             dataTitle: i18n._("Source Variables"),
             dataPlacement: 'right',
-            awPopOver: "<p>" + i18n._("Override variables found in openstack.yml and used by the inventory update script. For an example variable configuration ") +
+            awPopOver: i18n._(`Override variables found in foreman.ini and used by the inventory update script. For an example variable configuration
-                "<a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/foreman.ini\" target=\"_blank\">" +
+                <a href=\"https://github.com/ansible/ansible/blob/devel/contrib/inventory/foreman.ini\" target=\"_blank\">
-                i18n._("view openstack.yml in the Ansible github repo.") + "</a></p>" +
+                view foreman.ini in the Ansible github repo.</a> Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.`),
-                "<p>" + i18n._("Enter variables using either JSON or YAML syntax. Use the radio button to toggle between the two.") + "</p>" +
-                i18n._("JSON:") + "<br />\n" +
-                "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                i18n._("YAML:") + "<br />\n" +
-                "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n" +
-                "<p>" + i18n._("View JSON examples at ") + '<a href="http://www.json.org" target="_blank">www.json.org</a></p>' +
-                "<p>" + i18n._("View YAML examples at ") + '<a href="http://docs.ansible.com/YAMLSyntax.html" target="_blank">docs.ansible.com</a></p>',
             dataContainer: 'body',
             subForm: 'sourceSubForm'
         },

awx/ui/client/src/inventories-hosts/inventories/standard-inventory/inventory.form.js

@@ -82,7 +82,7 @@ function(i18n, InventoryCompletedJobsList) {
             instance_groups: {
                 label: i18n._('Instance Groups'),
                 type: 'custom',
-                awPopOver: "<p>" + i18n._("Select the Instance Groups for this Inventory to run on.") + "</p>",
+                awPopOver: i18n._('Select the Instance Groups for this Inventory to run on. Refer to the Ansible Tower documentation for more detail.'),
                 dataTitle: i18n._('Instance Groups'),
                 dataPlacement: 'right',
                 dataContainer: 'body',
@@ -95,14 +95,8 @@ function(i18n, InventoryCompletedJobsList) {
                 class: 'Form-formGroup--fullWidth',
                 rows: 6,
                 "default": "---",
-                awPopOver: "<p>" + i18n._("Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two.") + "</p>" +
+                awPopOver: i18n._('Enter inventory variables using either JSON or YAML syntax. Use the radio button to toggle between the two. Refer to the Ansible Tower documentation for example syntax.'),
-                    "JSON:<br />\n" +
+                dataTitle: i18n._('Variables'),
-                    "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                    "YAML:<br />\n" +
-                    "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n" +
-                    '<p>' + i18n.sprintf(i18n._('View JSON examples at %s'), '<a href="http://www.json.org" target="_blank">www.json.org</a>') + '</p>' +
-                    '<p>' + i18n.sprintf(i18n._('View YAML examples at %s'), '<a href="http://docs.ansible.com/YAMLSyntax.html" target="_blank">docs.ansible.com</a>') + '</p>',
-                dataTitle: i18n._('Inventory Variables'),
                 dataPlacement: 'right',
                 dataContainer: 'body',
                 ngDisabled: '!(inventory_obj.summary_fields.user_capabilities.edit || canAdd)' // TODO: get working

awx/ui/client/src/inventory-scripts/inventory-scripts.form.js

@@ -59,8 +59,7 @@ export default ['i18n', function(i18n) {
                 ngDisabled: '!(inventory_script_obj.summary_fields.user_capabilities.edit || canAdd)',
                 ngTrim: false,
                 rows: 10,
-                awPopOver: "<p>" + i18n._("Drag and drop your custom inventory script file here or create one in the field to import your custom inventory.") + " " +
+                awPopOver: i18n._('Drag and drop your custom inventory script file here or create one in the field to import your custom inventory. Refer to the Ansible Tower documentation for example syntax.'),
-                                    "<br><br> " + i18n.sprintf(i18n._("Script must begin with a hashbang sequence: i.e.... %s"), "#!/usr/bin/env python") + "</p>",
                 dataTitle: i18n._('Custom Script'),
                 dataPlacement: 'right',
                 dataContainer: "body"

awx/ui/client/src/notifications/notificationTemplates.form.js

@@ -97,8 +97,7 @@ export default ['i18n', function(i18n) {
                 label: i18n._('Recipient List'),
                 type: 'textarea',
                 rows: 3,
-                awPopOver: '<p>' + i18n._('Type an option on each line.') + '</p>'+
+                awPopOver: i18n._('Enter one email address per line to create a recipient list for this type of notification.'),
-                            '<p>' + i18n._('For example:') + '<br>alias1@email.com<br>\n alias2@email.com<br>\n',
                 dataTitle: i18n._('Recipient List'),
                 dataPlacement: 'right',
                 dataContainer: "body",
@@ -140,8 +139,7 @@ export default ['i18n', function(i18n) {
                 label: i18n._('Destination Channels'),
                 type: 'textarea',
                 rows: 3,
-                awPopOver: '<p>' + i18n._('Type an option on each line. The pound symbol (#) is not required.') + '</p>'+
+                awPopOver: i18n._('Enter one Slack channel per line. The pound symbol (#) is not required.'),
-                            '<p>' + i18n._('For example:') + '<br>engineering<br>\n #support<br>\n',
                 dataTitle: i18n._('Destination Channels'),
                 dataPlacement: 'right',
                 dataContainer: "body",
@@ -157,8 +155,7 @@ export default ['i18n', function(i18n) {
                 label: i18n._('Destination Channels'),
                 type: 'textarea',
                 rows: 3,
-                awPopOver: '<p>' + i18n._('Type an option on each line. The pound symbol (#) is not required.') + '</p>'+
+                awPopOver: i18n._('Enter one HipChat channel per line. The pound symbol (#) is not required.'),
-                            '<p>' + i18n._('For example:') + '<br>engineering<br>\n #support<br>\n',
                 dataTitle: i18n._('Destination Channels'),
                 dataPlacement: 'right',
                 dataContainer: "body",
@@ -198,8 +195,7 @@ export default ['i18n', function(i18n) {
                 label: i18n._('Source Phone Number'),
                 dataTitle: i18n._('Source Phone Number'),
                 type: 'text',
-                awPopOver: '<p>' + i18n._('Number associated with the "Messaging Service" in Twilio.') + '</p>'+
+                awPopOver: i18n._('Enter the number associated with the "Messaging Service" in Twilio in the format +18005550199.'),
-                            '<p>' + i18n.sprintf(i18n._('This must be of the form %s.'), '<code>+18005550199</code>') + '</p>',
                 awRequiredWhen: {
                     reqExpression: "twilio_required",
                     init: "false"
@@ -213,8 +209,7 @@ export default ['i18n', function(i18n) {
                 dataTitle: i18n._('Destination SMS Number'),
                 type: 'textarea',
                 rows: 3,
-                awPopOver: '<p>' + i18n._('Type an option on each line.') + '</p>'+
+                awPopOver: i18n._('Enter one phone number per line to specify where to route SMS messages.'),
-                            '<p>' + i18n._('For example:') + '<br><code>+12125552368</code><br>\n<code>+19105556162</code><br>\n',
                 dataPlacement: 'right',
                 dataContainer: "body",
                 awRequiredWhen: {
@@ -297,8 +292,7 @@ export default ['i18n', function(i18n) {
                 dataTitle: i18n._('Notification Color'),
                 type: 'select',
                 ngOptions: 'color for color in hipchatColors track by color',
-                awPopOver: '<p>' + i18n.sprintf(i18n._('Color can be one of %s.'), '<code>yellow</code>, <code>green</code>, <code>red</code>, ' +
+                awPopOver: i18n._('Specify a notification color. Acceptable colors are: yellow, green, red purple, gray or random.'),
-                           '<code>purple</code>, <code>gray</code>, <code>random</code>') + '\n',
                 awRequiredWhen: {
                     reqExpression: "hipchat_required",
                     init: "false"
@@ -336,13 +330,7 @@ export default ['i18n', function(i18n) {
                     reqExpression: "webhook_required",
                     init: "false"
                 },
-                awPopOver: '<p>' + i18n._('Specify HTTP Headers in JSON format') + '</p>' +
+                awPopOver: i18n._('Specify HTTP Headers in JSON format. Refer to the Ansible Tower documentation for example syntax.'),
-                           '<p>' + i18n._('For example:') + '<br><pre>\n' +
-                           '{\n' +
-                           '  "X-Auth-Token": "828jf0",\n' +
-                           '  "X-Ansible": "Is great!"\n' +
-                           '}\n' +
-                           '</pre></p>',
                 dataPlacement: 'right',
                 ngShow: "notification_type.value == 'webhook' ",
                 subForm: 'typeSubForm',
@@ -374,9 +362,8 @@ export default ['i18n', function(i18n) {
                 label: i18n._('Destination Channels or Users'),
                 type: 'textarea',
                 rows: 3,
-                awPopOver: '<p>' + i18n._('Type an option on each line. The pound symbol (#) is not required.') + '</p>'+
+                awPopOver: i18n._('Enter one IRC channel or username per line. The pound symbol (#) for channels, and the at (@) symbol for users, are not required.'),
-                            '<p>' + i18n._('For example:') + '<br>' + i18n.sprintf(i18n._('%s or %s'), '#support', 'support') + '<br>\n ' + i18n.sprintf(i18n._('%s or %s'), '@username', 'username') + '<br>\n',
+                dataTitle: i18n._('Destination Channels or Users'),
-                dataTitle: i18n._('Destination Channels'),
                 dataPlacement: 'right',
                 dataContainer: "body",
                 awRequiredWhen: {

awx/ui/client/src/templates/job_templates/job-template.form.js

@@ -51,11 +51,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     "default": 0,
                     required: true,
                     column: 1,
-                    awPopOver: "<p>" + i18n.sprintf(i18n._("When this template is submitted as a job, setting the type to %s will execute the playbook, running tasks " +
+                    awPopOver: i18n._('For job templates, select run to execute the playbook. Select check to only check playbook syntax, test environment setup, and report problems without executing the playbook.'),
-                        " on the selected hosts."), "<em>run</em>") + "</p> <p>" +
-                        i18n.sprintf(i18n._("Setting the type to %s will not execute the playbook."), "<em>check</em>") + " " +
-                        i18n.sprintf(i18n._("Instead, %s will check playbook " +
-                        " syntax, test environment setup and report problems."), "<code>ansible</code>") + "</p>",
                     dataTitle: i18n._('Job Type'),
                     dataPlacement: 'right',
                     dataContainer: "body",
@@ -139,7 +135,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                             field-is-disabled="!(job_template_obj.summary_fields.user_capabilities.edit || canAddJobTemplate)">
                         </multi-credential>`,
                     required: true,
-                    awPopOver: "<p>" + i18n._("Select credentials that allow {{BRAND_NAME}} to access the nodes this job will be ran against. You can only select one credential of each type.<br /><br />You must select either a machine (SSH) credential or \"Prompt on launch\".  \"Prompt on launch\" requires you to select a machine credential at run time.<br /><br />If you select credentials AND check the \"Prompt on launch\" box, you make the selected credentials the defaults that can be updated at run time.") + "</p>",
+                    awPopOver: i18n._('Select credentials that allow Tower to access the nodes this job will be ran against. You can only select one credential of each type. For machine credentials (SSH), checking  "Prompt on launch" without selecting credentials will require you to select a machine credential at run time. If you select credentials and check "Prompt on launch", the selected credential(s) become the defaults that can be updated at run time.'),
                     dataTitle: i18n._('Credentials'),
                     dataPlacement: 'right',
                     dataContainer: "body",
@@ -158,10 +154,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     spinner: true,
                     'class': "input-small",
                     column: 1,
-                    awPopOver: '<p>' + i18n.sprintf(i18n._('The number of parallel or simultaneous processes to use while executing the playbook. Inputting no value will use ' +
+                    awPopOver: i18n._('The number of parallel or simultaneous processes to use while executing the playbook. Value defaults to 0. Refer to the Ansible documentation for details about the configuration file.'),
-                        'the default value from the %sansible configuration file%s.'), '' +
-                        '<a id="ansible_forks_docs" href=\"http://docs.ansible.com/intro_configuration.html#the-ansible-configuration-file\" ' +
-                        ' target=\"_blank\">', '</a>') +'</p>',
                     placeholder: 'DEFAULT',
                     dataTitle: i18n._('Forks'),
                     dataPlacement: 'right',
@@ -172,10 +165,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     label: i18n._('Limit'),
                     type: 'text',
                     column: 1,
-                    awPopOver: "<p>" + i18n.sprintf(i18n._("Provide a host pattern to further constrain the list of hosts that will be managed or affected by the playbook. " +
+                    awPopOver: i18n._('Provide a host pattern to further constrain the list of hosts that will be managed or affected by the playbook. Multiple patterns are allowed. Refer to Ansible documentation for more information and examples on patterns.'),
-                        "Multiple patterns can be separated by %s %s or %s"), "&#59;", "&#58;", "&#44;") + "</p><p>" +
-                        i18n.sprintf(i18n._("For more information and examples see " +
-                        "%sthe Patterns topic at docs.ansible.com%s."), "<a href=\"http://docs.ansible.com/intro_patterns.html\" target=\"_blank\">", "</a>") + "</p>",
                     dataTitle: i18n._('Limit'),
                     dataPlacement: 'right',
                     dataContainer: "body",
@@ -218,9 +208,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     'elementClass': 'Form-textInput',
                     ngOptions: 'tag.label for tag in job_tag_options track by tag.value',
                     column: 2,
-                    awPopOver: "<p>" + i18n._("Provide a comma separated list of tags.") + "</p>\n" +
+                    awPopOver: i18n._('Tags are useful when you have a large playbook, and you want to run a specific part of a play or task. Use commas to separate multiple tags. Refer to Ansible Tower documentation for details on the usage of tags.'),
-                        "<p>" + i18n._("Tags are useful when you have a large playbook, and you want to run a specific part of a play or task.") + "</p>" +
-                        "<p>" + i18n._("Consult the Ansible documentation for further details on the usage of tags.") + "</p>",
                     dataTitle: i18n._("Job Tags"),
                     dataPlacement: "right",
                     dataContainer: "body",
@@ -237,9 +225,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     'elementClass': 'Form-textInput',
                     ngOptions: 'tag.label for tag in skip_tag_options track by tag.value',
                     column: 2,
-                    awPopOver: "<p>" + i18n._("Provide a comma separated list of tags.") + "</p>\n" +
+                    awPopOver: i18n._('Skip tags are useful when you have a large playbook, and you want to skip specific parts of a play or task. Use commas to separate multiple tags. Refer to Ansible Tower documentation for details on the usage of tags.'),
-                        "<p>" + i18n._("Skip tags are useful when you have a large playbook, and you want to skip specific parts of a play or task.") + "</p>" +
-                        "<p>" + i18n._("Consult the Ansible documentation for further details on the usage of tags.") + "</p>",
                     dataTitle: i18n._("Skip Tags"),
                     dataPlacement: "right",
                     dataContainer: "body",
@@ -282,9 +268,9 @@ function(NotificationsList, CompletedJobsList, i18n) {
                         label: i18n._('Enable Privilege Escalation'),
                         type: 'checkbox',
                         column: 2,
-                        awPopOver: "<p>" + i18n.sprintf(i18n._("If enabled, run this playbook as an administrator. This is the equivalent of passing the %s option to the %s command."), '<code>--become</code>', '<code>ansible-playbook</code>') + " </p>",
+                        awPopOver: i18n._('If enabled, run this playbook as an administrator.'),
                         dataPlacement: 'right',
-                        dataTitle: i18n._('Become Privilege Escalation'),
+                        dataTitle: i18n._('Enable Privilege Escalation'),
                         dataContainer: "body",
                         labelClass: 'stack-inline',
                         ngDisabled: '!(job_template_obj.summary_fields.user_capabilities.edit || canAddJobTemplate)'
@@ -363,12 +349,7 @@ function(NotificationsList, CompletedJobsList, i18n) {
                     rows: 6,
                     "default": "---",
                     column: 2,
-                    awPopOver: "<p>" + i18n.sprintf(i18n._("Pass extra command line variables to the playbook. This is the %s or %s command line parameter " +
+                    awPopOver: i18n._('Pass extra command line variables to the playbook. Provide key/value pairs using either YAML or JSON. Refer to the Ansible Tower documentation for example syntax.'),
-                        "for %s. Provide key/value pairs using either YAML or JSON."), '<code>-e</code>', '<code>--extra-vars</code>', '<code>ansible-playbook</code>') + "</p>" +
-                        "JSON:<br />\n" +
-                        "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                        "YAML:<br />\n" +
-                        "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n",
                     dataTitle: i18n._('Extra Variables'),
                     dataPlacement: 'right',
                     dataContainer: "body",

awx/ui/client/src/templates/survey-maker/shared/question-definition.form.js

@@ -42,8 +42,7 @@ export default ['i18n', function(i18n){
             realName: 'variable',
             type: 'custom',
             control:'<label class="prepend-asterisk" for="variable"><span class="Form-inputLabel" translate> ANSWER VARIABLE NAME</span>'+
-                '<a id="awp-variable" href="" aw-pop-over="<p>The suggested format for variable names is lowercase and underscore-separated. Also note that this field cannot accept variable names with spaces.</p><p>For example: <br>foo_bar<br>'+
+                '<a id="awp-variable" href="" aw-pop-over="The suggested format for variable names is lowercase and underscore-separated (for example, foo_bar, user_id, host_name, etc.). Variable names with spaces are not allowed." '+
-                'user_id<br>host_name<br><div class=&quot;popover-footer&quot;><span class=&quot;key&quot;>esc</span> or click to close</div>" '+
                 'data-placement="right" data-container="body" popover-title="Answer Variable Name" class="help-link" data-original-title="" title="" tabindex="-1"><i class="fa fa-question-circle"></i></a> </label>'+
                 '<div><input type="text" ng-model="variable" name="variable" id="survey_question_variable" class="form-control Form-textInput ng-pristine ng-invalid ng-invalid-required" required="" aw-survey-variable-name>'+
                 '<div class="error ng-hide" id="survey_question-variable-required-error" ng-show="survey_question_form.variable.$dirty && survey_question_form.variable.$error.required" translate>Please enter an answer variable name.</div>'+
@@ -62,7 +61,10 @@ export default ['i18n', function(i18n){
             defaultText: i18n._('Choose an answer type'),
             ngOptions: 'answer_types.name for answer_types in answer_types track by answer_types.type',
             required: true,
-
+            awPopOver: i18n._('Choose an answer type or format you want as the prompt for the user. Refer to the Ansible Tower Documentation for more additional information about each option.'),
+            dataTitle: i18n._('Answer Type'),
+            dataPlacement: 'right',
+            dataContainer: "body",
             column: 2,
             ngChange: 'typeChange()',
             class: 'Form-formGroup--singleColumn'
@@ -76,12 +78,6 @@ export default ['i18n', function(i18n){
 
             ngRequired: "type.type=== 'multiselect' || type.type=== 'multiplechoice' " ,
             ngShow: 'type.type=== "multiselect" || type.type=== "multiplechoice" ',
-            awPopOver: '<p>Type an option on each line.</p>'+
-                        '<p>For example the following input:<br><br>Apple<br>\n Banana<br>\n Cherry<br><br>would be displayed as:</p>\n'+
-                        '<ol><li>Apple</li><li>Banana</li><li>Cherry</li></ol>',
-            dataTitle: i18n._('Multiple Choice Options'),
-            dataPlacement: 'right',
-            dataContainer: "body",
             column: 2,
             class: 'Form-formGroup--singleColumn'
         },

awx/ui/client/src/templates/workflows.form.js

@@ -77,12 +77,7 @@ export default ['NotificationsList', 'i18n', function(NotificationsList, i18n) {
                     rows: 6,
                     "default": "---",
                     column: 2,
-                    awPopOver: "<p>" + i18n.sprintf(i18n._("Pass extra command line variables to the playbook. This is the %s or %s command line parameter " +
+                    awPopOver:i18n._('Pass extra command line variables to the playbook. This is the -e or --extra-vars command line parameter for ansible-playbook. Provide key/value pairs using either YAML or JSON. Refer to the Ansible Tower documentaton for example syntax.'),
-                        "for %s. Provide key/value pairs using either YAML or JSON."), "<code>-e</code>", "<code>--extra-vars</code>", "<code>ansible-playbook</code>") + "</p>" +
-                        "JSON:<br />\n" +
-                        "<blockquote>{<br />&emsp;\"somevar\": \"somevalue\",<br />&emsp;\"password\": \"magic\"<br /> }</blockquote>\n" +
-                        "YAML:<br />\n" +
-                        "<blockquote>---<br />somevar: somevalue<br />password: magic<br /></blockquote>\n",
                     dataTitle: i18n._('Extra Variables'),
                     dataPlacement: 'right',
                     dataContainer: "body",