Add 2 css class graph - minigraph for bg color and other (#10318)

* Add 2 class for graph / mini graph (styles.css)

Add 2 class for graph / mini graph (styles.css) 
for changing bg color and more (mini graph port / device) (graph port / general)

* Update styles.css

Add 2 class for graph / mini graph (styles.css) 
for changing bg color and more (mini graph port / device) (graph port / general)

* Add class CSS for mini graph 

Add class CSS for mini graph

* Update graph.inc.php

Change graph.inc.php, add css class / overlib

* restore original bg #f5f5f5 .graph-all-common

restore original bg #f5f5f5 .graph-all-common

* Update ports.inc.php

correct extra \

* Update graph.inc.php

* Update ports.inc.php

* Update ports.inc.php

* Update graph.inc.php

* Comment line 88 URL.php, because description of location enlarge too much overlib devices's title

* Update Url.php

* Update Url.php

Line 88 -> re ident to pass travis...

html/css/styles.css

@@ -348,6 +348,17 @@ A.purple:visited, a.purple, .purple { color: #740074; }
   color: #555;
 }
 
+.graph-all-common {
+  display: block;
+  padding: 1px;
+  margin: 2px;
+  min-height:180px;
+  max-height:180px;
+  text-align: center;
+  float: left;
+  background-color: #f5f5f5;
+}
+
 .tablehead {
   font-weight: bold;
   font-size: 13px;
@@ -1542,6 +1553,21 @@ tr.search:nth-child(odd) {
   margin: 2px;
 }
 
+.minigraph-div {
+  display: block;
+  padding: 3px;
+  margin: 3px;
+  min-width: 183px;
+  max-width: 183px;
+  min-height: 90px;
+  max-height: 90px;
+  text-align: center;
+  float: left;
+  background-color: #e9e9e9;
+  border: solid 1px;
+  border-color: #e9e9e9;
+}
+
 .example-sports .league-name {
   margin: 0 20px 5px 20px;
   padding: 3px 0;

includes/html/pages/device/ports.inc.php

@@ -104,12 +104,10 @@ if ($vars['view'] == 'minigraphs') {
     // FIXME - FIX THIS. UGLY.
     foreach (dbFetchRows('select * from ports WHERE device_id = ? AND `disabled` = 0 ORDER BY ifIndex', array($device['device_id'])) as $port) {
         $port = cleanPort($port, $device);
-        echo "<div style='display: block; padding: 3px; margin: 3px; min-width: 183px; max-width:183px; min-height:90px; max-height:90px; text-align: center; float: left; background-color: #e9e9e9;'>
+        echo "<div class='minigraph-div'><div style='font-weight: bold;'>".makeshortif($port['ifDescr'])."</div>
-            <div style='font-weight: bold;'>".makeshortif($port['ifDescr']).'</div>
+            <a href=\"'.generate_port_url($port).'\" onmouseover=\"return overlib('<div class=\'overlib-content\'>\
-            <a href="'.generate_port_url($port)."\" onmouseover=\"return overlib('\
+      	    <div class=\'overlib-text\'>".$device['hostname']." - ".$port['ifDescr']."</div>\
-            <div style=\'background-color: #ffffff;\'>\
+            <span class=\'overlib-title\'>".$port['ifAlias']."</span>\
-            <div style=\'font-size: 16px; padding:5px; font-weight: bold; color: #555;\'>".$device['hostname'].' - '.$port['ifDescr'].'</div>\
-            '.$port['ifAlias']." \
             <img src=\'graph.php?type=".$graph_type.'&amp;id='.$port['port_id'].'&amp;from='.$from.'&amp;to='.$config['time']['now']."&amp;width=450&amp;height=150\'>\
             </div>\
             ', CENTER, LEFT, FGCOLOR, '#e5e5e5', BGCOLOR, '#e5e5e5', WIDTH, 400, HEIGHT, 150);\" onmouseout=\"return nd();\"  >"."<img src='graph.php?type=".$graph_type.'&amp;id='.$port['port_id'].'&amp;from='.$from.'&amp;to='.$config['time']['now']."&amp;width=180&amp;height=45&amp;legend=no'>

includes/html/pages/ports/graph.inc.php

@@ -55,7 +55,7 @@ foreach ($ports as $port) {
         $graph_array['height'] = 119;
         $graph =  generate_lazy_graph_tag($graph_array);
 
-        echo "<div style='display: block; padding: 1px; margin: 2px; min-width: ".$width_div.'px; max-width:'.$width_div."px; min-height:180px; max-height:180px; text-align: center; float: left; background-color: #f5f5f5;'>";
+        echo "<div class='graph-all-common' style='min-width: ".$width_div.'px;max-width:'.$width_div."px;'>";
         echo overlib_link($link, $graph, $overlib_content);
         echo '</div>';
     }