Optimized the Dashboard CSS/HTML

Signed-off-by: Roman Schmerold (BNoiZe) <bnoize@froxlor.org>

templates/Sparkle/admin/index/index.tpl

@@ -4,7 +4,8 @@ $header
 			<img src="templates/{$theme}/assets/img/icons/domains_big.png" alt="" />
 			{$lng['panel']['dashboard']}
 		</h2>
-		<section class="dboardcanvas" id="statsbox">
+		<div class="grid-g">
+			<div class="grid-u-1-2">
 			<div class="canvasbox">
 				<input type="hidden" id="customers" class="circular" data-used="{$overview['number_customers']}" data-available="{$userinfo['customers']}">
 				<canvas id="customers-canvas" width="120" height="76"></canvas><br/>
@@ -163,9 +164,9 @@ $header
 			</div>
 			</if>
 			
-		</section>
-		
+		</div>
 		
+		<div class="grid-u-1-2">
 		<if Settings::Get('admin.show_news_feed') == '1'>
 		<section class="dboarditem dboarditemnews" id="newsfeed">
 			<table>
@@ -252,7 +253,8 @@ $header
 				</if>
 		</tbody>
 		</table>
-	<section class="clear"></section>
+		</div>
+		</div>
 
 	</article>
 $footer

templates/Sparkle/assets/css/main.css

@@ -682,28 +682,15 @@ select[multiple="multiple"] {
 }
 
 .dboarditem {
-	float:left;
-	width:48%;
-	margin-top:15px;
-	margin-right:0;
-	margin-bottom:15px;
-	margin-left:15px;
+	width: 100%;
 	padding:0;
+	margin-bottom: 20px;
 }
 
 .dboarditemnews {
 	border:1px solid #d1d5d8;
 }
 
-.dboardcanvas {
-	float:left;
-	width:48%;
-	margin-top:15px;
-	margin-right:0;
-	margin-bottom:15px;
-	margin-left:15px;
-}
-
 .dboarditemfull {
 	position:relative;
 	overflow:hidden;
@@ -1022,3 +1009,49 @@ div.left {
 div.right {
 	float: right;
 }
+
+/* GRID */
+.grid-g {
+	letter-spacing: -0.31em;
+	*letter-spacing: normal;
+	*word-spacing: -0.43em;
+	text-rendering: optimizespeed;
+	padding-top: 35px;
+}
+
+.opera-only :-o-prefocus,
+.grid-g {
+	word-spacing: -0.43em;
+}
+
+
+.grid-u {
+	display: inline-block;
+	zoom: 1; *display: inline;
+	letter-spacing: normal;
+	word-spacing: normal;
+	vertical-align: top;
+	text-rendering: auto;
+}
+
+
+.grid-u-1,.grid-u-1-2 {
+	display: inline-block;
+	zoom: 1; *display: inline; 
+	letter-spacing: normal;
+	word-spacing: normal;
+	vertical-align: top;
+	text-rendering: auto;
+}
+
+.grid-u-1 {
+	display:block;
+}
+
+.grid-u-1-2 {
+	width: 50%;
+}
+
+.grid-offset-1-2 {
+	margin-left: 50%;
+}