mirror/librenms-librenms
1
0
Fork 0
mirror of https://github.com/librenms/librenms.git synced 2024-10-07 16:52:45 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add media query to cahnge the size of the thumbnails

Browse Source 
This prevent the scrollbar on graph.inc.php
Tweaked the graphs sizing to fit better on the screen
This commit is contained in:
Louis Bailleul
2015-11-23 11:23:04 +00:00
parent 12e37a20ee
commit 8f2ddb243d
2 changed files with 50 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
html/css/styles.css
View File

@@ -1765,6 +1765,43 @@ tr.search:nth-child(odd) {
label {
font-weight: normal;
}
.nav>li>a.dropdown-toggle {
padding: 15px 6px;
}
@media only screen and (max-width: 480px) {
.thumbnail_graph_table b { font-size : 6px;}
.thumbnail_graph_table img {
max-width: 45px;
max-height: 50px;
}
}
@media only screen and (max-width: 720px) and (min-width: 481px) {
.thumbnail_graph_table b { font-size : 8px;}
.thumbnail_graph_table img {
max-width: 60px;
max-height: 55px;
}
}
@media only screen and (max-width: 800px) and (min-width: 721px) {
.thumbnail_graph_table b { font-size : 8px;}
.thumbnail_graph_table img {
max-width: 75px;
max-height: 60px;
}
}
@media only screen and (max-width: 1024px) and (min-width: 801px) {
.thumbnail_graph_table b { font-size : 9px;}
.thumbnail_graph_table img {
max-width: 105px;
max-height: 70px;
}
}
@media only screen and (min-width: 1024px) {
}

16
html/pages/graphs.inc.php
View File

@@ -85,7 +85,7 @@ else {
$thumb_array = array('sixhour' => '6 Hours', 'day' => '24 Hours', 'twoday' => '48 Hours', 'week' => 'One Week', 'twoweek' => 'Two Weeks',
'month' => 'One Month', 'twomonth' => 'Two Months','year' => 'One Year', 'twoyear' => 'Two Years');
echo('<table width=100%><tr>');
echo('<table width=100% class="thumbnail_graph_table"><tr>');
foreach ($thumb_array as $period => $text) {
$graph_array['from'] = $config['time'][$period];
@@ -112,11 +112,21 @@ else {
$graph_array['width'] = $graph_width;
if($_SESSION['screen_width']) {
$graph_array['width'] = ($_SESSION['screen_width'] - ($_SESSION['screen_width']/12));
if($_SESSION['screen_width'] > 800) {
$graph_array['width'] = ($_SESSION['screen_width'] - ($_SESSION['screen_width']/10));
}
else {
$graph_array['width'] = ($_SESSION['screen_width'] - ($_SESSION['screen_width']/4));
}
}
if($_SESSION['screen_height']) {
$graph_array['height'] = ($_SESSION['screen_height'] - ($_SESSION['screen_height']/2));
if($_SESSION['screen_height'] > 960 ) {
$graph_array['height'] = ($_SESSION['screen_height'] - ($_SESSION['screen_height']/2));
}
else {
$graph_array['height'] = ($_SESSION['screen_height'] - ($_SESSION['screen_height']/1.5));
}
}
echo("<hr />");