fixed styling of tooltips, specifically websocket tooltip

awx/ui/static/js/main-menu/web-socket-status.partial.html

@@ -1,7 +1,6 @@
 <button
     aw-tool-tip="{{socketTip}}"
     tip-watch="socketTip"
-    data-popover-title="Live Events"
     data-placement="bottom"
     data-trigger="hover"
     data-container="body"

awx/ui/static/js/shared/directives.js

@@ -485,7 +485,8 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Job
                     html: true,
                     title: attrs.awToolTip,
                     container: 'body',
-                    trigger: 'hover focus'
+                    trigger: 'hover focus',
+                    template: '<div class="Tooltip tooltip" role="tooltip"><div class="Tooltip-arrow tooltip-arrow"></div><div class="Tooltip-inner tooltip-inner"></div></div>'
                 });
 
                 if (attrs.tipWatch) {

awx/ui/static/js/tooltip/tooltip.block.less

@@ -0,0 +1,7 @@
+/** @define Tooltip */
+
+@import "shared/branding/colors.less";
+.Tooltip-inner {
+    white-space: pre-wrap;
+    word-break: break-word;
+}