From 0ddccb7cd1d8b7a8f143ff400cc523c487f0b76d Mon Sep 17 00:00:00 2001
From: Franco Fichtner <franco@opnsense.org>
Date: Thu, 26 May 2016 21:17:36 +0200
Subject: [PATCH] ui: tooltip placement and button alignment; closes #959

---
 src/etc/inc/services.inc           |  7 +++----
 src/opnsense/www/js/opnsense_ui.js | 10 ++++------
 src/www/interfaces.php             |  4 ++--
 src/www/status_habackup.php        |  4 ----
 src/www/system_certmanager.php     | 10 +++++-----
 src/www/system_usermanager.php     |  4 ++--
 6 files changed, 16 insertions(+), 23 deletions(-)

diff --git a/src/etc/inc/services.inc b/src/etc/inc/services.inc
index c07270e1f..1920d08f1 100644
--- a/src/etc/inc/services.inc
+++ b/src/etc/inc/services.inc
@@ -2820,10 +2820,10 @@ function get_service_status_icon($service, $withtext = true, $smallicon = false)
     $output = "";
     if (get_service_status($service)) {
         $statustext = gettext("Running");
-        $output .= '<span class="btn btn-success"><span class="glyphicon glyphicon-play" title="'.sprintf(gettext('%s Service is'),$service['name']).' '.$statustext.'" data-toggle="tooltip" data-placement="bottom" ></span></span>&nbsp;';
+        $output .= '<span class="btn btn-success glyphicon glyphicon-play" title="'.sprintf(gettext('%s Service is'),$service['name']).' '.$statustext.'" data-toggle="tooltip"></span>' . PHP_EOL;
     } else {
         $statustext = gettext("Stopped") ;
-        $output .= '<span class="btn btn-danger"><span class="glyphicon glyphicon-stop" title="'.sprintf(gettext('%s Service is'),$service['name']).' '.$statustext.'" data-toggle="tooltip" data-placement="bottom" ></span></span>&nbsp;';
+        $output .= '<span class="btn btn-danger glyphicon glyphicon-stop" title="'.sprintf(gettext('%s Service is'),$service['name']).' '.$statustext.'" data-toggle="tooltip"></span>' . PHP_EOL;
     }
     return $output;
 }
@@ -2834,8 +2834,7 @@ function get_service_control_links($service, $addname = false)
     $service_title = $addname ? $service['name'] . ' ' : '';
 
     $template  = '<span data-service_id="%s" data-service_action="%s" data-service="%s" ';
-    $template .= 'data-toggle="tooltip" data-placement="bottom" title="%s" ';
-    $template .= 'class="btn btn-default %s %s"></span>' . PHP_EOL;
+    $template .= 'data-toggle="tooltip" title="%s" class="btn btn-default %s %s"></span>' . PHP_EOL;
 
     $output = '';
 
diff --git a/src/opnsense/www/js/opnsense_ui.js b/src/opnsense/www/js/opnsense_ui.js
index a9f134500..5a99a82b0 100644
--- a/src/opnsense/www/js/opnsense_ui.js
+++ b/src/opnsense/www/js/opnsense_ui.js
@@ -138,17 +138,15 @@ function mapDataToFormUI(data_get_map) {
  */
 function updateServiceStatusUI(status) {
 
-    var status_html = '';
+    var status_html = '<span class="glyphicon glyphicon-play btn ';
 
     if (status == "running") {
-        status_html += '<span class="btn btn-success">' ;
+        status_html += 'btn-success' ;
     } else if (status == "stopped") {
-        status_html += '<span class="btn btn-danger">' ;
-    } else {
-        status_html += '<span class="btn">' ;
+        status_html += 'btn-danger' ;
     }
 
-    status_html += '<span class="glyphicon glyphicon-play"  data-placement="bottom"></span> </span>&nbsp;';
+    status_html += '"></span>';
 
     $('#service_status_container').html(status_html);
 }
diff --git a/src/www/interfaces.php b/src/www/interfaces.php
index 766f8c118..eabe1a781 100644
--- a/src/www/interfaces.php
+++ b/src/www/interfaces.php
@@ -1896,7 +1896,7 @@ include("head.inc");
                                 endforeach;
                               endif;?>
                             </select>
-                            <button type="button" class="btn btn-sm" id="btn_show_add_gateway" title="<?=gettext("add a new one.");?>"  data-toggle="tooltip" data-placement="right" ><span class="glyphicon glyphicon-plus"></span></button>
+                            <button type="button" class="btn btn-sm" id="btn_show_add_gateway" title="<?=gettext("add a new one.");?>"  data-toggle="tooltip"><span class="glyphicon glyphicon-plus"></span></button>
                             <div class="hidden" id="addgateway">
                               <br/>
                               <table class="table table-striped table-condensed">
@@ -2476,7 +2476,7 @@ include("head.inc");
                                 endforeach;
                               endif;?>
                             </select>
-                            <button type="button" class="btn btn-sm" id="btn_show_add_gatewayv6" title="<?=gettext("add a new one.");?>"  data-toggle="tooltip" data-placement="right" ><span class="glyphicon glyphicon-plus"></span></button>
+                            <button type="button" class="btn btn-sm" id="btn_show_add_gatewayv6" title="<?=gettext("add a new one.");?>"  data-toggle="tooltip"><span class="glyphicon glyphicon-plus"></span></button>
                             <div class="hidden" for="help_for_gatewayv6">
                               <?=gettext("If this interface is an Internet connection, select an existing Gateway from the list or add a new one using the link above."); ?><br />
                               <?=gettext("On local LANs the upstream gateway should be \"none\"."); ?>
diff --git a/src/www/status_habackup.php b/src/www/status_habackup.php
index 8bdf52e4a..7654873a0 100644
--- a/src/www/status_habackup.php
+++ b/src/www/status_habackup.php
@@ -238,7 +238,6 @@ include("head.inc");
                                             data-service_id="<?=!empty($service['id']) ? $service['id'] : "";?>"
                                             data-service_name="<?=$service['name'];?>"
                                             data-toggle="tooltip"
-                                            data-placement="bottom"
                                             title="<?=sprintf(gettext('Restart %sService'), $service['name']);?>"
                                             class="btn btn-xs btn-default xmlrpc_srv_status_act glyphicon glyphicon-refresh">
                                         </span>
@@ -247,7 +246,6 @@ include("head.inc");
                                             data-service_id="<?=!empty($service['id']) ? $service['id'] : "";?>"
                                             data-service_name="<?=$service['name'];?>"
                                             data-toggle="tooltip"
-                                            data-placement="bottom"
                                             title="<?=sprintf(gettext('Stop %sService'), $service['name']);?>"
                                             class="btn btn-xs btn-default xmlrpc_srv_status_act glyphicon glyphicon-stop">
                                         </span>
@@ -258,7 +256,6 @@ include("head.inc");
                                             data-service_id="<?=!empty($service['id']) ? $service['id'] : "";?>"
                                             data-service_name="<?=$service['name'];?>"
                                             data-toggle="tooltip"
-                                            data-placement="bottom"
                                             title="<?=sprintf(gettext('Start %sService'), $service['name']);?>"
                                             class="btn btn-xs btn-default xmlrpc_srv_status_act glyphicon glyphicon-play">
                                         </span>
@@ -298,7 +295,6 @@ include("head.inc");
                                             data-service_action="restart_all"
                                             data-service_name="all"
                                             data-toggle="tooltip"
-                                            data-placement="bottom"
                                             title="<?=gettext('Restart all services');?>"
                                             class="btn btn-xs btn-default xmlrpc_srv_status_act glyphicon glyphicon-refresh">
                                         </span>
diff --git a/src/www/system_certmanager.php b/src/www/system_certmanager.php
index b6f8e3129..a4f45374b 100644
--- a/src/www/system_certmanager.php
+++ b/src/www/system_certmanager.php
@@ -1273,19 +1273,19 @@ $( document ).ready(function() {
 <?php
                 endif; ?>
 
-                  <a href="#" class="btn btn-default btn-xs act_info" data-id="<?=$i;?>" data-toggle="tooltip" data-placement="left" title="<?=gettext("show certificate info");?>">
+                  <a href="#" class="btn btn-default btn-xs act_info" data-id="<?=$i;?>" data-toggle="tooltip" title="<?=gettext("show certificate info");?>">
                     <span class="glyphicon glyphicon-info-sign"></span>
                   </a>
 
-                  <a href="system_certmanager.php?act=exp&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left" title="<?=gettext("export ca");?>">
+                  <a href="system_certmanager.php?act=exp&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("export ca");?>">
                       <span class="glyphicon glyphicon-download"></span>
                   </a>
 
-                  <a href="system_certmanager.php?act=key&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left" title="<?=gettext("export key");?>">
+                  <a href="system_certmanager.php?act=key&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("export key");?>">
                     <span class="glyphicon glyphicon-download"></span>
                   </a>
 
-                  <a href="system_certmanager.php?act=p12&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left" title="<?=gettext("export ca cert+user cert+user cert key in .p12 format");?>">
+                  <a href="system_certmanager.php?act=p12&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("export ca cert+user cert+user cert key in .p12 format");?>">
                       <span class="glyphicon glyphicon-download"></span>
                   </a>
 <?php
@@ -1297,7 +1297,7 @@ $( document ).ready(function() {
 <?php
                   endif;
                   if (isset($cert['csr'])) :?>
-                  <a href="system_certmanager.php?act=csr&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left" title="<?=gettext("update csr");?>">
+                  <a href="system_certmanager.php?act=csr&amp;id=<?=$i;?>" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("update csr");?>">
                     <span class="glyphicon glyphicon-edit"></span>
                   </a>
 <?php
diff --git a/src/www/system_usermanager.php b/src/www/system_usermanager.php
index 057bddfa7..4a0bac0fc 100644
--- a/src/www/system_usermanager.php
+++ b/src/www/system_usermanager.php
@@ -662,11 +662,11 @@ $( document ).ready(function() {
                             </td>
                             <td class="text-center">
                               <br />
-                              <a href="javascript:move_selected('notgroups','groups')" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left"  title="<?=gettext("add groups"); ?>">
+                              <a href="javascript:move_selected('notgroups','groups')" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("Add groups"); ?>">
                                   <span class="glyphicon glyphicon-arrow-right"></span>
                               </a>
                               <br /><br />
-                              <a href="javascript:move_selected('groups','notgroups')" class="btn btn-default btn-xs" data-toggle="tooltip" data-placement="left"  title="<?=gettext("remove groups"); ?>">
+                              <a href="javascript:move_selected('groups','notgroups')" class="btn btn-default btn-xs" data-toggle="tooltip" title="<?=gettext("Remove groups"); ?>">
                                   <span class="glyphicon glyphicon-arrow-left"></span>
                               </a>
                             </td>