Merge branch 'dev'0.4.0

10 files changed, 324 insertions, 39 deletions

diff --git a/public/install.php b/public/install.php
index 672bb4418..930241496 100644
--- a/public/install.php
+++ b/public/install.php
@@ -168,9 +168,8 @@ function saveStep3 () {
 	if (!empty ($_POST)) {
 		if (empty ($_POST['host']) ||
 		    empty ($_POST['user']) ||
-		    empty ($_POST['pass']) ||
 		    empty ($_POST['base'])) {
-			return false;
+			$_SESSION['bd_error'] = true;
 		}
 
 		$_SESSION['bd_host'] = $_POST['host'];
@@ -196,7 +195,10 @@ function saveStep3 () {
 		$res = checkBD ();
 
 		if ($res) {
+			$_SESSION['bd_error'] = false;
 			header ('Location: index.php?step=4');
+		} else {
+			$_SESSION['bd_error'] = true;
 		}
 	}
 }
@@ -275,11 +277,13 @@ function checkStep3 () {
 	      isset ($_SESSION['bd_user']) &&
 	      isset ($_SESSION['bd_pass']) &&
 	      isset ($_SESSION['bd_name']);
+	$conn = !isset ($_SESSION['bd_error']) || !$_SESSION['bd_error'];
 
 	return array (
 		'bd' => $bd ? 'ok' : 'ko',
+		'conn' => $conn ? 'ok' : 'ko',
 		'conf' => $conf ? 'ok' : 'ko',
-		'all' => $bd && $conf ? 'ok' : 'ko'
+		'all' => $bd && $conn && $conf ? 'ok' : 'ko'
 	);
 }
 function checkBD () {
@@ -358,8 +362,8 @@ function printStep1 () {
 	<p class="alert alert-error"><span class="alert-head"><?php echo _t ('damn'); ?></span> <?php echo _t ('minz_is_nok', LIB_PATH . '/minz'); ?></p>
 	<?php } ?>
 
-	<?php $version = curl_version(); ?>
 	<?php if ($res['curl'] == 'ok') { ?>
+	<?php $version = curl_version(); ?>
 	<p class="alert alert-success"><span class="alert-head"><?php echo _t ('ok'); ?></span> <?php echo _t ('curl_is_ok', $version['version']); ?></p>
 	<?php } else { ?>
 	<p class="alert alert-error"><span class="alert-head"><?php echo _t ('damn'); ?></span> <?php echo _t ('curl_is_nok'); ?></p>
@@ -467,6 +471,8 @@ function printStep3 () {
 ?>
 	<?php $s3 = checkStep3 (); if ($s3['all'] == 'ok') { ?>
 	<p class="alert alert-success"><span class="alert-head"><?php echo _t ('ok'); ?></span> <?php echo _t ('bdd_conf_is_ok'); ?></p>
+	<?php } elseif ($s3['conn'] == 'ko') { ?>
+	<p class="alert alert-error"><span class="alert-head"><?php echo _t ('damn'); ?></span> <?php echo _t ('bdd_conf_is_ko'); ?></p>
 	<?php } ?>
 
 	<form action="index.php?step=3" method="post">
diff --git a/public/scripts/endless_mode.js b/public/scripts/endless_mode.js
new file mode 100644
index 000000000..489b69f30
--- /dev/null
+++ b/public/scripts/endless_mode.js
@@ -0,0 +1,31 @@
+var url_load_more = "";
+var load = false;
+
+function init_load_more() {
+	url_load_more = $("a#load_more").attr("href");
+	
+	$("#load_more").click (function () {
+		load_more_posts ();
+		
+		return false;
+	});
+}
+
+function load_more_posts () {
+	load = true;
+	$("#load_more").addClass("loading");
+	$.get (url_load_more, function (data) {
+		$("#stream .flux:last").after($("#stream .flux", data));
+		$(".pagination").html($(".pagination", data).html());
+		
+		init_load_more();
+		init_posts();
+		
+		$("#load_more").removeClass("loading");
+		load = false;
+	});
+}
+
+$(document).ready (function () {
+	init_load_more();
+});
\ No newline at end of file
diff --git a/public/scripts/jquery.lazyload.min.js b/public/scripts/jquery.lazyload.min.js
new file mode 100644
index 000000000..79663d7bb
--- /dev/null
+++ b/public/scripts/jquery.lazyload.min.js
@@ -0,0 +1,15 @@
+/*
+ * Lazy Load - jQuery plugin for lazy loading images
+ *
+ * Copyright (c) 2007-2013 Mika Tuupola
+ *
+ * Licensed under the MIT license:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *
+ * Project home:
+ *   http://www.appelsiini.net/projects/lazyload
+ *
+ * Version:  1.8.4
+ *
+ */
+(function(a,b,c,d){var e=a(b);a.fn.lazyload=function(c){function i(){var b=0;f.each(function(){var c=a(this);if(h.skip_invisible&&!c.is(":visible"))return;if(!a.abovethetop(this,h)&&!a.leftofbegin(this,h))if(!a.belowthefold(this,h)&&!a.rightoffold(this,h))c.trigger("appear"),b=0;else if(++b>h.failure_limit)return!1})}var f=this,g,h={threshold:0,failure_limit:0,event:"scroll",effect:"show",container:b,data_attribute:"original",skip_invisible:!0,appear:null,load:null};return c&&(d!==c.failurelimit&&(c.failure_limit=c.failurelimit,delete c.failurelimit),d!==c.effectspeed&&(c.effect_speed=c.effectspeed,delete c.effectspeed),a.extend(h,c)),g=h.container===d||h.container===b?e:a(h.container),0===h.event.indexOf("scroll")&&g.bind(h.event,function(a){return i()}),this.each(function(){var b=this,c=a(b);b.loaded=!1,c.one("appear",function(){if(!this.loaded){if(h.appear){var d=f.length;h.appear.call(b,d,h)}a("<img />").bind("load",function(){c.hide().attr("src",c.data(h.data_attribute))[h.effect](h.effect_speed),b.loaded=!0;var d=a.grep(f,function(a){return!a.loaded});f=a(d);if(h.load){var e=f.length;h.load.call(b,e,h)}}).attr("src",c.data(h.data_attribute))}}),0!==h.event.indexOf("scroll")&&c.bind(h.event,function(a){b.loaded||c.trigger("appear")})}),e.bind("resize",function(a){i()}),/iphone|ipod|ipad.*os 5/gi.test(navigator.appVersion)&&e.bind("pageshow",function(b){b.originalEvent.persisted&&f.each(function(){a(this).trigger("appear")})}),a(b).load(function(){i()}),this},a.belowthefold=function(c,f){var g;return f.container===d||f.container===b?g=e.height()+e.scrollTop():g=a(f.container).offset().top+a(f.container).height(),g<=a(c).offset().top-f.threshold},a.rightoffold=function(c,f){var g;return f.container===d||f.container===b?g=e.width()+e.scrollLeft():g=a(f.container).offset().left+a(f.container).width(),g<=a(c).offset().left-f.threshold},a.abovethetop=function(c,f){var g;return f.container===d||f.container===b?g=e.scrollTop():g=a(f.container).offset().top,g>=a(c).offset().top+f.threshold+a(c).height()},a.leftofbegin=function(c,f){var g;return f.container===d||f.container===b?g=e.scrollLeft():g=a(f.container).offset().left,g>=a(c).offset().left+f.threshold+a(c).width()},a.inviewport=function(b,c){return!a.rightoffold(b,c)&&!a.leftofbegin(b,c)&&!a.belowthefold(b,c)&&!a.abovethetop(b,c)},a.extend(a.expr[":"],{"below-the-fold":function(b){return a.belowthefold(b,{threshold:0})},"above-the-top":function(b){return!a.belowthefold(b,{threshold:0})},"right-of-screen":function(b){return a.rightoffold(b,{threshold:0})},"left-of-screen":function(b){return!a.rightoffold(b,{threshold:0})},"in-viewport":function(b){return a.inviewport(b,{threshold:0})},"above-the-fold":function(b){return!a.belowthefold(b,{threshold:0})},"right-of-fold":function(b){return a.rightoffold(b,{threshold:0})},"left-of-fold":function(b){return!a.rightoffold(b,{threshold:0})}})})(jQuery,window,document)
diff --git a/public/theme/freshrss.css b/public/theme/freshrss.css
index 880b45085..93bb32437 100644
--- a/public/theme/freshrss.css
+++ b/public/theme/freshrss.css
@@ -77,6 +77,7 @@
 	}
 
 .favicon {
+	height: 16px;
 	width: 16px;
 }
 
@@ -114,6 +115,9 @@
 			line-height: 35px;
 			float: right;
 		}
+		.categories .feeds .item.error .feed {
+			color: #BD362F;
+		}
 		.categories .feeds .item .feed {
 			display: inline-block;
 			margin: 0;
@@ -197,39 +201,39 @@
 		line-height: 25px;
 		border-top: 1px solid #ddd;
 	}
-		.flux_header .item.manage {
-			width: 60px;
+		.item.manage {
+			width: 80px;
 			white-space: nowrap;
 			font-size: 0px;
 			text-align: center;
 		}
-			.flux_header .item.manage .read {
+			.item.manage .read {
 				display: inline-block;
-				width: 30px;
+				width: 40px;
 				height: 40px;
 				background: url("icons/read.png") center center no-repeat;
 				background: url("icons/read.svg") center center no-repeat;
 				vertical-align: middle;
 			}
-				.flux_header .item.manage .read:hover {
+				.item.manage .read:hover {
 					text-decoration: none;
 				}
-				.flux.not_read .flux_header .item.manage .read {
+				.flux.not_read .item.manage .read {
 					background: url("icons/unread.png") center center no-repeat;
 					background: url("icons/unread.svg") center center no-repeat;
 				}
-			.flux_header .item.manage .bookmark {
+			.item.manage .bookmark {
 				display: inline-block;
-				width: 30px;
+				width: 40px;
 				height: 40px;
 				background: url("icons/non-starred.png") center center no-repeat;
 				background: url("icons/non-starred.svg") center center no-repeat;
 				vertical-align: middle;
 			}
-				.flux_header .item.manage .bookmark:hover {
+				.item.manage .bookmark:hover {
 					text-decoration: none;
 				}
-				.flux.favorite .flux_header .item.manage .bookmark {
+				.flux.favorite .item.manage .bookmark {
 					background: url("icons/starred.png") center center no-repeat;
 					background: url("icons/starred.svg") center center no-repeat;
 				}
@@ -240,9 +244,11 @@
 			text-overflow: ellipsis;
 			line-height: 40px;
 		}
+			.flux_header .item.website .favicon {
+				padding: 5px;
+			}
 			.flux_header .item.website a {
 				display: block;
-				padding: 0 5px;
 				height: 40px;
 			}
 		.flux_header .item.title {
@@ -265,12 +271,12 @@
 			cursor: pointer;
 		}
 		.flux_header .item.link {
-			width: 35px;
+			width: 40px;
 			text-align: center;
 		}
 			.flux_header .item.link a {
 				display: inline-block;
-				width: 35px;
+				width: 40px;
 				height: 40px;
 				background: url("icons/link.png") center center no-repeat;
 				background: url("icons/link.svg") center center no-repeat;
@@ -280,12 +286,64 @@
 					text-decoration: none;
 				}
 
+#stream.reader .flux {
+	padding: 0 0 30px;
+	border: none;
+	background: #f0f0f0;
+	color: #333;
+}
+	#stream.reader .flux .author {
+		margin: 0 0 10px;
+		font-size: 90%;
+		color: #666;
+	}
+
+#stream.global {
+	text-align: center;
+}
+	#stream.global .category {
+		display: inline-block;
+		width: 280px;
+		margin: 20px 10px;
+		vertical-align: top;
+		background: #fff;
+		border: 1px solid #aaa;
+		border-radius: 5px;
+		text-align: left;
+		box-shadow: 0 0 5px #bbb;
+	}
+		#stream.global .cat_header {
+			height: 35px;
+			padding: 0 10px;
+			background: #eee;
+			border-bottom: 1px solid #aaa;
+			border-radius: 5px 5px 0 0;
+			line-height: 35px;
+			font-size: 120%;
+		}
+			#stream.global .cat_header a {
+				color: #333;
+				text-shadow: 0 -1px 0px #aaa;
+			}
+		#stream.global .category .feeds {
+			max-height: 250px;
+			margin: 0;
+			list-style: none;
+			overflow: auto;
+		}
+			#stream.global .category .feeds .item {
+				padding: 2px 10px;
+				font-size: 90%;
+			}
+
 .content {
+	min-height: 300px;
 	max-width: 550px;
 	margin: 0 auto;
 	padding: 20px 10px;
 	line-height: 170%;
 	font-family: 'OpenSans';
+	word-wrap: break-word;
 }
 	.content .title {
 		margin: 0 0 5px;
@@ -301,15 +359,19 @@
 		display: block;
 		margin: 10px auto;
 	}
+	.content hr {
+		margin: 30px 0;
+		height: 1px;
+		background: #ddd;
+		border: 0;
+	}
 	.content pre {
-		width: 90%;
 		margin: 10px auto;
 		padding: 10px;
 		overflow: auto;
-		background: #666;
-		border: 1px solid #000;
-		color: #fafafa;
-		border-radius: 5px;
+		background: #000;
+		color: #fff;
+		font-size: 110%;
 	}
 	.content q, .content blockquote {
 		display: block;
@@ -342,20 +404,39 @@
 }
 	.pagination .item {
 		display: table-cell;
-		padding: 5px 10px;
-		border-top: 1px solid #aaa;
+		line-height: 40px;
 	}
+		.pagination .item.pager-current {
+			font-weight: bold;
+			font-size: 140%;
+		}
+		.pagination .item.pager-first,
+		.pagination .item.pager-previous,
+		.pagination .item.pager-next,
+		.pagination .item.pager-last {
+			width: 100px;
+		}
 		.pagination .item a {
+			display: block;
 			color: #333;
 			font-style: italic;
 		}
-	.pagination .pager-previous, .pagination .pager-next {
-		width: 200px;
+	.pagination:first-child .item {
+		border-bottom: 1px solid #aaa;
 	}
-	.pagination .item.pager-current {
-		font-weight: bold;
+	.pagination:last-child .item {
+		border-top: 1px solid #aaa;
 	}
 
+.nav_entries {
+	display: none;
+}
+
+.loading {
+	background: url("loader.gif") center center no-repeat;
+	font-size: 0;
+}
+
 /*** NOTIFICATION ***/
 .notification {
 	position: fixed;
@@ -415,6 +496,33 @@
 		vertical-align: middle;
 	}
 
+.logs {
+	border: 1px solid #aaa;
+}
+	.logs .log {
+		padding: 5px 2%;
+		overflow: auto;
+		background: #fafafa;
+		border-bottom: 1px solid #999;
+		color: #333;
+		font-size: 90%;
+	}
+		.logs .log .date {
+			display: block;
+		}
+	.logs .log.error {
+		background: #fdd;
+		color: #844;
+	}
+	.logs .log.warning {
+		background: #ffe;
+		color: #c95;
+	}
+	.logs .log.notice {
+		background: #f4f4f4;
+		color: #aaa;
+	}
+
 @media(max-width: 840px) {
 	.header,
 	.aside .btn-important,
@@ -425,9 +533,20 @@
 		display: none;
 	}
 	.flux_header .item.website {
-		width: 30px;
+		width: 40px;
 		text-align: center;
 	}
+		.flux_header .item.website .favicon {
+			padding: 12px;
+		}
+
+	.content {
+		font-size: 120%;
+	}
+
+	.pagination {
+		margin: 0 0 40px;
+	}
 	.pagination .pager-previous, .pagination .pager-next {
 		width: 100px;
 	}
@@ -440,26 +559,53 @@
 		top: 0; left: 0;
 		width: 0;
 		overflow: hidden;
+		border-right: none;
 		z-index: 10;
 		transition: width 200ms linear;
 	}
 		.aside:target {
 			width: 80%;
+			border-right: 1px solid #aaa;
 			overflow: auto;
 		}
 		.aside .toggle_aside {
 			position: absolute;
 			right: 0;
 			display: inline-block;
-			width: 20px;
-			height: 20px;
+			width: 26px;
+			height: 26px;
 			margin: 0 10px 0 0;
 			border: 1px solid #ccc;
-			border-radius: 10px;
+			border-radius: 20px;
 			text-align: center;
-			line-height: 20px;
+			line-height: 26px;
 		}
 		.aside .categories {
 			margin: 30px 0;
 		}
+
+	.nav_entries {
+		display: table;
+		width: 100%;
+		height: 40px;
+		position: fixed;
+		bottom: 0;
+		margin: 0;
+		background: #fff;
+		border-top: 1px solid #ddd;
+		text-align: center;
+		line-height: 40px;
+		table-layout: fixed;
+	}
+		.nav_entries .item {
+			display: table-cell;
+			width: 30%;
+		}
+			.nav_entries .item a {
+				display: block;
+			}
+			.nav_entries .item .icon.i_up {
+				margin: 5px 0 0;
+				vertical-align: top;
+			}
 }
diff --git a/public/theme/global.css b/public/theme/global.css
index 99b335585..b3d80e52a 100644
--- a/public/theme/global.css
+++ b/public/theme/global.css
@@ -50,6 +50,11 @@ img {
 		border: none;
 	}
 
+/* VIDEOS */
+iframe, embed, object {
+	max-width: 100%;
+}
+
 /* FORMULAIRES */
 legend {
 	display: block;
@@ -83,8 +88,8 @@ input, select, textarea {
 }
 	input[type="radio"],
 	input[type="checkbox"] {
-		width: 15px;
-		min-height: 15px;
+		width: 15px !important;
+		min-height: 15px !important;
 	}
 	input:focus, select:focus, textarea:focus {
 		color: #0062BE;
@@ -183,6 +188,7 @@ input, select, textarea {
 	line-height: 20px;
 	vertical-align: middle;
 	cursor: pointer;
+	overflow: hidden;
 }
 	a.btn {
 		min-height: 25px;
@@ -261,6 +267,13 @@ input, select, textarea {
 		.nav.nav-list a:hover {
 			text-decoration: none;
 		}
+	.nav.nav-list .item.error a {
+		color: #BD362F;
+	}
+		.nav.nav-list .item.active.error a {
+			color: #fff;
+			background: #BD362F;
+		}
 
 	.nav.nav-list .nav-header {
 		padding: 0 10px;
@@ -384,15 +397,19 @@ input, select, textarea {
 		display: inline-block;
 		position: absolute;
 		top: -16px; right: -16px;
-		width: 16px;
-		height: 16px;
-		padding: 5px;
+		width: 26px;
+		height: 26px;
 		background: #fff;
 		border-radius: 50px;
 		border: 1px solid #ddd;
-		line-height: 16px;
+		line-height: 26px;
 		text-align: center;
 	}
+		.dropdown .dropdown-close a {
+			display: block;
+			width: 100%;
+			height: 100%;
+		}
 		.dropdown .dropdown-close:hover {
 			background: #f4f4f4;
 		}
@@ -501,6 +518,14 @@ input, select, textarea {
 		background-image: url("icons/up.png");
 		background-image: url("icons/up.svg");
 	}
+	.icon.i_next {
+		background-image: url("icons/next.png");
+		background-image: url("icons/next.svg");
+	}
+	.icon.i_prev {
+		background-image: url("icons/previous.png");
+		background-image: url("icons/previous.svg");
+	}
 	.icon.i_help {
 		background-image: url("icons/help.png");
 		background-image: url("icons/help.svg");
diff --git a/public/theme/icons/next.png b/public/theme/icons/next.png
new file mode 100644
index 000000000..ab3490c3b
--- /dev/null
+++ b/public/theme/icons/next.png
diff --git a/public/theme/icons/next.svg b/public/theme/icons/next.svg
new file mode 100644
index 000000000..72637b4e6
--- /dev/null
+++ b/public/theme/icons/next.svg
@@ -0,0 +1,31 @@
+<?xml version='1.0' encoding='UTF-8' standalone='no'?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg xmlns:cc='http://creativecommons.org/ns#' xmlns:dc='http://purl.org/dc/elements/1.1/' sodipodi:docname='go-next-symbolic.svg' height='16' id='svg7384' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:svg='http://www.w3.org/2000/svg' inkscape:version='0.48.4 r9939' version='1.1' width='16' xmlns='http://www.w3.org/2000/svg'>
+  <metadata id='metadata90'>
+    <rdf:RDF>
+      <cc:Work rdf:about=''>
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage'/>
+        <dc:title>Gnome Symbolic Icon Theme</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview inkscape:bbox-nodes='false' inkscape:bbox-paths='true' bordercolor='#666666' borderopacity='1' inkscape:current-layer='layer12' inkscape:cx='78.648774' inkscape:cy='9.99302' gridtolerance='10' inkscape:guide-bbox='true' guidetolerance='10' id='namedview88' inkscape:object-nodes='false' inkscape:object-paths='false' objecttolerance='10' pagecolor='#3a3b39' inkscape:pageopacity='1' inkscape:pageshadow='2' showborder='false' showgrid='false' showguides='true' inkscape:snap-bbox='true' inkscape:snap-bbox-midpoints='false' inkscape:snap-global='true' inkscape:snap-grids='true' inkscape:snap-nodes='false' inkscape:snap-others='false' inkscape:snap-to-guides='true' inkscape:window-height='1408' inkscape:window-maximized='1' inkscape:window-width='2560' inkscape:window-x='0' inkscape:window-y='0' inkscape:zoom='1'>
+    <inkscape:grid empspacing='2' enabled='true' id='grid4866' originx='120px' originy='530px' snapvisiblegridlinesonly='true' spacingx='1px' spacingy='1px' type='xygrid' visible='true'/>
+  </sodipodi:namedview>
+  <title id='title9167'>Gnome Symbolic Icon Theme</title>
+  <defs id='defs7386'/>
+  <g inkscape:groupmode='layer' id='layer9' inkscape:label='status' style='display:inline' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer10' inkscape:label='devices' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer11' inkscape:label='apps' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer13' inkscape:label='places' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer14' inkscape:label='mimetypes' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer15' inkscape:label='emblems' style='display:inline' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='g71291' inkscape:label='emotes' style='display:inline' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='g4953' inkscape:label='categories' style='display:inline' transform='translate(-121.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer12' inkscape:label='actions' style='display:inline' transform='translate(-121.0002,-747)'>
+    
+    <path inkscape:connector-curvature='0' d='m 125.0004,749 1,0 c 0.0104,-1.2e-4 0.0208,-4.6e-4 0.0313,0 0.25495,0.0112 0.50987,0.12858 0.6875,0.3125 l 6.29767,5.71875 -6.29772,5.71875 c -0.18816,0.18819 -0.45346,0.28125 -0.71875,0.28125 l -1,0 0,-1 c 0,-0.26529 0.0931,-0.53058 0.28125,-0.71875 l 4.82897,-4.28125 -4.82897,-4.28125 c -0.21074,-0.19463 -0.30316,-0.46925 -0.28125,-0.75 z' id='path10839-9-9-5-9' sodipodi:nodetypes='ccsccccccccccc' style='font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;color:#bebebe;fill:#bebebe;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.78124988;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:new;font-family:Andale Mono;-inkscape-font-specification:Andale Mono'/>
+  </g>
+</svg>
diff --git a/public/theme/icons/previous.png b/public/theme/icons/previous.png
new file mode 100644
index 000000000..10e40669e
--- /dev/null
+++ b/public/theme/icons/previous.png
diff --git a/public/theme/icons/previous.svg b/public/theme/icons/previous.svg
new file mode 100644
index 000000000..67685c50c
--- /dev/null
+++ b/public/theme/icons/previous.svg
@@ -0,0 +1,31 @@
+<?xml version='1.0' encoding='UTF-8' standalone='no'?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg xmlns:cc='http://creativecommons.org/ns#' xmlns:dc='http://purl.org/dc/elements/1.1/' sodipodi:docname='go-next-rtl-symbolic.svg' height='16' id='svg7384' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:svg='http://www.w3.org/2000/svg' inkscape:version='0.48.4 r9939' version='1.1' width='16' xmlns='http://www.w3.org/2000/svg'>
+  <metadata id='metadata90'>
+    <rdf:RDF>
+      <cc:Work rdf:about=''>
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage'/>
+        <dc:title>Gnome Symbolic Icon Theme</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview inkscape:bbox-nodes='false' inkscape:bbox-paths='true' bordercolor='#666666' borderopacity='1' inkscape:current-layer='layer12' inkscape:cx='-101.35123' inkscape:cy='9.99302' gridtolerance='10' inkscape:guide-bbox='true' guidetolerance='10' id='namedview88' inkscape:object-nodes='false' inkscape:object-paths='false' objecttolerance='10' pagecolor='#3a3b39' inkscape:pageopacity='1' inkscape:pageshadow='2' showborder='false' showgrid='false' showguides='true' inkscape:snap-bbox='true' inkscape:snap-bbox-midpoints='false' inkscape:snap-global='true' inkscape:snap-grids='true' inkscape:snap-nodes='false' inkscape:snap-others='false' inkscape:snap-to-guides='true' inkscape:window-height='1408' inkscape:window-maximized='1' inkscape:window-width='2560' inkscape:window-x='0' inkscape:window-y='0' inkscape:zoom='1'>
+    <inkscape:grid empspacing='2' enabled='true' id='grid4866' originx='-60px' originy='530px' snapvisiblegridlinesonly='true' spacingx='1px' spacingy='1px' type='xygrid' visible='true'/>
+  </sodipodi:namedview>
+  <title id='title9167'>Gnome Symbolic Icon Theme</title>
+  <defs id='defs7386'/>
+  <g inkscape:groupmode='layer' id='layer9' inkscape:label='status' style='display:inline' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer10' inkscape:label='devices' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer11' inkscape:label='apps' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer13' inkscape:label='places' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer14' inkscape:label='mimetypes' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer15' inkscape:label='emblems' style='display:inline' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='g71291' inkscape:label='emotes' style='display:inline' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='g4953' inkscape:label='categories' style='display:inline' transform='translate(-301.0002,-747)'/>
+  <g inkscape:groupmode='layer' id='layer12' inkscape:label='actions' style='display:inline' transform='translate(-301.0002,-747)'>
+    
+    <path inkscape:connector-curvature='0' d='m 313.01372,749 -1,0 c -0.0104,-1.2e-4 -0.0208,-4.6e-4 -0.0313,0 -0.25495,0.0112 -0.50987,0.12858 -0.6875,0.3125 l -6.29767,5.71875 6.29772,5.71875 c 0.18816,0.18819 0.45346,0.28125 0.71875,0.28125 l 1,0 0,-1 c 0,-0.26529 -0.0931,-0.53058 -0.28125,-0.71875 l -4.82897,-4.28125 4.82897,-4.28125 c 0.21074,-0.19463 0.30316,-0.46925 0.28125,-0.75 z' id='path5441' sodipodi:nodetypes='ccsccccccccccc' style='font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;color:#bebebe;fill:#bebebe;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.78124988;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:new;font-family:Andale Mono;-inkscape-font-specification:Andale Mono'/>
+  </g>
+</svg>
diff --git a/public/theme/loader.gif b/public/theme/loader.gif
new file mode 100644
index 000000000..5ff26f0e3
--- /dev/null
+++ b/public/theme/loader.gif