From ab915b6ed70c203d73a4399cd72a817d2b781759 Mon Sep 17 00:00:00 2001
From: psychobunny <psycho.bunny@hotmail.com>
Date: Tue, 30 Sep 2014 17:02:53 -0400
Subject: [PATCH] first pass advanced/database

---
 public/less/admin/admin.less             |   1 +
 public/less/admin/advanced/database.less |   6 ++
 src/views/admin/advanced/database.tpl    | 105 ++++++++++++-----------
 3 files changed, 62 insertions(+), 50 deletions(-)
 create mode 100644 public/less/admin/advanced/database.less

diff --git a/public/less/admin/admin.less b/public/less/admin/admin.less
index a1918ad3e9..24822a43b0 100644
--- a/public/less/admin/admin.less
+++ b/public/less/admin/admin.less
@@ -10,6 +10,7 @@
 @import "./appearance/customise";
 @import "./appearance/themes";
 @import "./extend/plugins";
+@import "./advanced/database";
 
 .admin {
 	padding-top: 70px;
diff --git a/public/less/admin/advanced/database.less b/public/less/admin/advanced/database.less
new file mode 100644
index 0000000000..c81ef613cc
--- /dev/null
+++ b/public/less/admin/advanced/database.less
@@ -0,0 +1,6 @@
+.database-info {
+	span {
+		display:inline-block;
+		width:220px;
+	}
+}
\ No newline at end of file
diff --git a/src/views/admin/advanced/database.tpl b/src/views/admin/advanced/database.tpl
index c51f63a798..e08daac3f7 100644
--- a/src/views/admin/advanced/database.tpl
+++ b/src/views/admin/advanced/database.tpl
@@ -1,54 +1,59 @@
+<div class="database">
+	<div class="col-sm-9">
+		<!-- IF redis -->
+		<div class="panel panel-default">
+			<div class="panel-heading"><i class="fa fa-hdd-o"></i> Redis</div>
+			<div class="panel-body">
+				<div class="database-info">
+					<span>Redis Version</span> <span class="text-right">{redis_version}</span><br/>
+					<hr/>
+					<span>Uptime in Seconds</span> <span class="text-right formatted-number">{uptime_in_seconds}</span><br/>
+					<span>Uptime in Days</span> <span class="text-right">{uptime_in_days}</span><br/>
+					<hr/>
+					<span>Connected Clients</span> <span class="text-right">{connected_clients}</span><br/>
+					<span>Connected Slaves</span> <span class="text-right">{connected_slaves}</span><br/>
+					<span>Blocked Clients</span> <span class="text-right">{blocked_clients}</span><br/>
+					<hr/>
 
+					<span>Used Memory</span> <span class="text-right">{used_memory_human}</span><br/>
+					<span>Memory Fragmentation Ratio</span> <span class="text-right">{mem_fragmentation_ratio}</span><br/>
+					<hr/>
+					<span>Total Connections Received</span> <span class="text-right formatted-number">{total_connections_received}</span><br/>
+					<span>Total Commands Processed</span> <span class="text-right formatted-number">{total_commands_processed}</span><br/>
+					<span>Instantaneous Ops. Per Second</span> <span class="text-right formatted-number">{instantaneous_ops_per_sec}</span><br/>
+					<hr/>
+					<span>Keyspace Hits</span> <span class="text-right formatted-number">{keyspace_hits}</span><br/>
+					<span>Keyspace Misses</span> <span class="text-right formatted-number">{keyspace_misses}</span><br/>
+				</div>
+			</div>
+		</div>
+		<!-- ENDIF redis -->
 
-<!-- IF redis -->
-<h1><i class="fa fa-hdd-o"></i> Redis</h1>
-<hr />
-<div id="admin-redis-info">
-	<span>Redis Version</span> <span class="text-right">{redis_version}</span><br/>
-	<hr/>
-	<span>Uptime in Seconds</span> <span class="text-right formatted-number">{uptime_in_seconds}</span><br/>
-	<span>Uptime in Days</span> <span class="text-right">{uptime_in_days}</span><br/>
-	<hr/>
-	<span>Connected Clients</span> <span class="text-right">{connected_clients}</span><br/>
-	<span>Connected Slaves</span> <span class="text-right">{connected_slaves}</span><br/>
-	<span>Blocked Clients</span> <span class="text-right">{blocked_clients}</span><br/>
-	<hr/>
+		<!-- IF mongo -->
+		<div class="panel panel-default">
+			<div class="panel-heading"><i class="fa fa-hdd-o"></i> Mongo</div>
+			<div class="panel-body">
+				<div class="database-info">
+					<span>Collections</span> <span class="text-right formatted-number">{collections}</span><br/>
+					<span>Objects</span> <span class="text-right formatted-number">{objects}</span><br/>
+					<span>Avg. Object Size</span> <span class="text-right">{avgObjSize} kb</span><br/>
+					<hr/>
+					<span>Data Size</span> <span class="text-right">{dataSize} mb</span><br/>
+					<span>Storage Size</span> <span class="text-right">{storageSize} mb</span><br/>
+					<span>Index Size</span> <span class="text-right">{indexSize} mb</span><br/>
+					<span>File Size</span> <span class="text-right">{fileSize} mb</span><br/>
+				</div>
+			</div>
+		</div>
+		<!-- ENDIF mongo -->
 
-	<span>Used Memory</span> <span class="text-right">{used_memory_human}</span><br/>
-	<span>Memory Fragmentation Ratio</span> <span class="text-right">{mem_fragmentation_ratio}</span><br/>
-	<hr/>
-	<span>Total Connections Received</span> <span class="text-right formatted-number">{total_connections_received}</span><br/>
-	<span>Total Commands Processed</span> <span class="text-right formatted-number">{total_commands_processed}</span><br/>
-	<span>Instantaneous Ops. Per Second</span> <span class="text-right formatted-number">{instantaneous_ops_per_sec}</span><br/>
-	<hr/>
-	<span>Keyspace Hits</span> <span class="text-right formatted-number">{keyspace_hits}</span><br/>
-	<span>Keyspace Misses</span> <span class="text-right formatted-number">{keyspace_misses}</span><br/>
+		<div class="panel panel-default">
+			<div class="panel-heading"><i class="fa fa-hdd-o"></i> Raw Info</div>
+			<div class="panel-body">
+				<div class="highlight">
+					<pre>{raw}</pre>
+				</div>
+			</div>
+		</div>
+	</div>
 </div>
-<hr />
-<h3>Raw Info </h3>
-<div class="highlight">
-<pre>{raw}</pre>
-</div>
-<!-- ENDIF redis -->
-
-<!-- IF mongo -->
-<h1><i class="fa fa-hdd-o"></i> Mongo</h1>
-<hr />
-<div id="admin-redis-info">
-
-	<span>Collections</span> <span class="text-right formatted-number">{collections}</span><br/>
-	<span>Objects</span> <span class="text-right formatted-number">{objects}</span><br/>
-	<span>Avg. Object Size</span> <span class="text-right">{avgObjSize} kb</span><br/>
-	<hr/>
-	<span>Data Size</span> <span class="text-right">{dataSize} mb</span><br/>
-	<span>Storage Size</span> <span class="text-right">{storageSize} mb</span><br/>
-	<span>Index Size</span> <span class="text-right">{indexSize} mb</span><br/>
-	<span>File Size</span> <span class="text-right">{fileSize} mb</span><br/>
-
-</div>
-<hr />
-<h3>Raw Info </h3>
-<div class="highlight">
-<pre>{raw}</pre>
-</div>
-<!-- ENDIF mongo -->