From 9ca387861a4d37ce275d84b21eb6b62eec36b5a2 Mon Sep 17 00:00:00 2001
From: jerome <jerome@lauraly.com>
Date: Tue, 8 Apr 2014 03:43:10 +0200
Subject: [PATCH] - Disable zooming. - Change dropdown menu appearance. - fix
 status display on mobile.

---
 src/templates/main.tpl.html          | 25 +++++++++-------
 src/templates/server/status.tpl.html | 43 ++++++++++++++++------------
 static/css/style.css                 | 28 +++++++++++++++++-
 3 files changed, 65 insertions(+), 31 deletions(-)
diff --git a/src/templates/main.tpl.html b/src/templates/main.tpl.html
index 5615e375..4d7c1533 100755
--- a/src/templates/main.tpl.html
+++ b/src/templates/main.tpl.html
@@ -4,7 +4,7 @@
   <head>
     <meta charset="utf-8">
     <title>{title}</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, minimum-scale=1">
     <meta name="description" content="">
     <meta name="author" content="">
 	{auto_refresh}
@@ -46,7 +46,7 @@
     <!-- container -->
     <div class="container-fluid">
         <div class="page-header">
-            <h1>{subtitle}<small>&nbsp;</small></h1>
+            <h1>{subtitle}</h1>
         </div>
         <div class="row-fluid">
 			{html_sidebar}
@@ -72,15 +72,6 @@
 
 <!--%tpl_main_menu-->
           <div class="nav-collapse">
-			<ul class="nav pull-right">
-              <li class="dropdown">
-                <a href="#" class="dropdown-toggle" data-toggle="dropdown">{label_usermenu} <b class="caret"></b></a>
-                <ul class="dropdown-menu">
-                  <li><a href="{url_profile}"><i class="icon-cog"></i>&nbsp;{label_profile}</a></li>
-                  <li><a href="{url_logout}"><i class="icon-off"></i>&nbsp;{label_logout}</a></li>
-                </ul>
-              </li>
-			</ul>
             <ul class="nav">
 				<!--%tpl_repeat_menu-->
                 <li class="{active}">
@@ -92,6 +83,18 @@
                     <a href="http://www.phpservermonitor.org/" target="_blank">{label_help}</a>
                 </li>
             </ul>
+			<ul class="nav pull-right">
+              <li class="dropdown visible-desktop">
+                <a href="#" class="dropdown-toggle" data-toggle="dropdown">{label_usermenu} <b class="caret"></b></a>
+                <ul class="dropdown-menu">
+                  <li><a href="{url_profile}"><i class="icon-cog"></i>&nbsp;{label_profile}</a></li>
+                  <li><a href="{url_logout}"><i class="icon-off"></i>&nbsp;{label_logout}</a></li>
+                </ul>
+              </li>
+			  <li class="hidden-desktop divider"></li>
+			  <li class="hidden-desktop"><a href="{url_profile}">{label_profile}</a></li>
+              <li class="hidden-desktop"><a href="{url_logout}">{label_logout}</a></li>
+			</ul>
           </div>
 <!--%%tpl_main_menu-->
 
diff --git a/src/templates/server/status.tpl.html b/src/templates/server/status.tpl.html
index b8065ec4..69627280 100755
--- a/src/templates/server/status.tpl.html
+++ b/src/templates/server/status.tpl.html
@@ -2,7 +2,6 @@
 <style type="text/css">
 	body {
 		background: {bg};
-		padding: 30px 20px;
 	}
 
 	.page-header {
@@ -18,19 +17,23 @@
 		margin-bottom: 10px;
 	}
 
+	.offline, .online {
+		width: 100%;
+	}
+
+	.entity-container {
+		float: left;
+		width: 100%;
+		max-width: 320px;
+	}
+	
 	.entity {
 		padding: 10px;
 		box-shadow: 0px 0px 5px #666;
 		border-radius: 3px;
-		margin-bottom: 20px;
-		width: 300px;
-		cursor: pointer;
-	}
-
-	.offline {
-		width: 325px;
-		float: left;
 		margin-right: 20px;
+		margin-bottom: 20px;
+		cursor: pointer;
 	}
 
 	.offline .entity {
@@ -49,26 +52,28 @@
 		background: {online_bg};
 		color: {online_fg};
 		border: 2px solid {online_fg};
-		float: left;
-		margin-right: 20px;
 	}
 </style>
 <div class="offline">
 	<!--%tpl_repeat_servers_offline-->
-	<div class="entity {class_warning}" onclick="window.location.href='{url_view}'">
-		<h2>{label}</h2>
-		<p>{label_last_online}: {last_online_nice}</p>
-		<p>{label_last_check}: {last_checked_nice}</p>
+	<div class="entity-container">
+		<div class="entity {class_warning}" onclick="window.location.href='{url_view}'">
+			<h2>{label}</h2>
+			<p>{label_last_online}: {last_online_nice}</p>
+			<p>{label_last_check}: {last_checked_nice}</p>
+		</div>
 	</div>
 	<!--%%tpl_repeat_servers_offline-->
 	{servers_offline}
 </div>
 <div class="online">
 	<!--%tpl_repeat_servers_online-->
-	<div class="entity" onclick="window.location.href='{url_view}'">
-		<h2>{label}</h2>
-		<p>{label_last_online}: {last_checked_nice}</p>
-		<p>{label_rtime}: {rtime}s</p>
+	<div class="entity-container">
+		<div class="entity" onclick="window.location.href='{url_view}'">
+			<h2>{label}</h2>
+			<p>{label_last_online}: {last_checked_nice}</p>
+			<p>{label_rtime}: {rtime}s</p>
+		</div>
 	</div>
 	<!--%%tpl_repeat_servers_online-->
 	{servers_online}
diff --git a/static/css/style.css b/static/css/style.css
index 564288b0..fb8e3e41 100755
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -1,5 +1,5 @@
 body {
-	padding-top: 70px;
+	padding-top: 40px;
     padding-left: 0px;
     padding-right: 0px;
 }
@@ -15,6 +15,18 @@ body {
 	margin: 5px 0;
 	min-width: 100px;
 }
+.navbar .nav .divider {
+	height: 1px;
+	overflow: hidden;
+	background-color: #444;
+}
+
+@media (min-width: 980px) {
+	.hidden-desktop {
+		display: none !important;
+	}
+}
+
 @media (max-width: 979px) {
 	.sidebar-nav .nav-list {
 		padding: 0;
@@ -26,7 +38,21 @@ body {
 		float: left;
 		margin-right: 15px;
 	}
+	.navbar .brand {
+		margin-left: -10px;
+	}
+	.visible-desktop {
+		display: none !important;
+	}
 }
+
+@media (max-width: 479px) {
+	.container-fluid {
+		padding-left: 10px;
+		padding-right: 10px;
+	}
+}
+
 body.install{
     padding-top:20px;
 }
