About dialog

Made cow centered on small viewport. Added resizable option to Modal module. The About dialog is no longer resizable.

awx/ui/static/js/helpers/AboutAnsible.js

@@ -68,10 +68,12 @@ angular.module('AboutAnsibleHelpModal', ['RestServices', 'Utilities','ModalDialo
                         width: 700,
                         height: 380,
                         minWidth: 300,
+                        resizable: false,
                         // title:  , //'<img src="static/img/tower_login_logo.png">' ,//'About Ansible',
                         callback: 'DialogReady',
                         onOpen: function(){
                             $('#dialog-ok-button').focus();
+                            $('#about-modal-dialog').scrollTop(0);
                         }
                     });
                 });

awx/ui/static/less/ansible-ui.less

@@ -133,7 +133,6 @@ a:focus {
   max-width: 340px;
   background-color: white;
   border-style: none;
-
 }
 
 

awx/ui/static/lib/ansible/Modal.js

@@ -49,6 +49,7 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
                 callback = params.callback,
                 beforeDestroy = params.beforeDestroy,
                 closeOnEscape = (params.closeOnEscape === undefined) ? false : params.closeOnEscape,
+                resizable = (params.resizable === undefined) ? true : params.resizable,
                 buttons,
                 id = params.id,
                 x, y, wh, ww;
@@ -87,6 +88,7 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
                 minWidth: minWidth,
                 title: title,
                 closeOnEscape: closeOnEscape,
+                resizable: resizable,
                 create: function () {
                     // Fix the close button
                     $('.ui-dialog[aria-describedby="' + id + '"]').find('.ui-dialog-titlebar button').empty().attr({'class': 'close'}).text('x');

awx/ui/static/partials/cowsay-about.html

@@ -1,8 +1,9 @@
 
 <div id="about-dialog-body">
     <div class="row">
-        <div class="col-sm-5 col-xs-12 text-center">
-            <pre id='cowsay' style="text-align:left;">
+        <div class="col-xs-12 col-sm-5">
+            <div style="width: 340px; margin: 0 auto;">
+<pre id="cowsay">
  ________________
 /  Tower Version \
 \<span id='about-modal-version'></span>/
@@ -12,9 +13,10 @@
             (__)\     A)\/\
                 ||----w |
                 ||     ||
-            </pre>
+</pre>
+            </div>
         </div>
-        <div  class="col-sm-7 col-xs-12 text-center">
+        <div  class="col-xs-12 col-sm-7 text-center">
             <img id="about-modal-titlelogo" src="static/img/ansible_tower_logo_minimalc.png"><br>
             <p>Copyright 2014.  All rights reserved.</p>
             <p>Ansible is a registered trademark of Ansible, Inc.</p>