Cleanup wizard

couchpotato/core/plugins/wizard/static/wizard.css

@@ -1,49 +1,60 @@
 .page.wizard .uniForm {
-	width: 80%;
-	margin: 0 auto 30px;
+	margin: 0 0 30px;
+	width: 83%;
 }
 
 .page.wizard h1 {
-	padding: 10px 30px;
-	margin: 0;
+	padding: 10px 0;
+	margin: 0 5px;
 	display: block;
 	font-size: 30px;
 	margin-top: 80px;
 }
 
 .page.wizard .description {
-	padding: 10px 30px;
-	font-size: 18px;
+	padding: 10px 5px;
+	font-size: 1.45em;
+	line-height: 1.4em;
 	display: block;
 }
 
 .page.wizard .tab_wrapper {
 	background: #5c697b;
-	padding: 10px 0;
-	font-size: 18px;
+	height: 65px;
+	font-size: 1.75em;
 	position: fixed;
 	top: 0;
 	margin: 0;
 	width: 100%;
-	min-width: 960px;
 	left: 0;
 	z-index: 2;
-	box-shadow: 0 0 50px rgba(0,0,0,0.55);
+	box-shadow: 0 0 10px rgba(0,0,0,0.1);
 }
 
 	.page.wizard .tab_wrapper .tabs {
-		text-align: center;
 		padding: 0;
-		margin: 0;
+		margin: 0 auto;
 		display: block;
+		height: 100%;
+		width: 100%;
+		max-width: 960px;
 	}
 
 	.page.wizard .tabs li {
 		display: inline-block;
+		height: 100%;
 	}
 		.page.wizard .tabs li a {
 			padding: 20px 10px;
+			height: 100%;
+			display: block;
+			color: #FFF;
+			font-weight: normal;
+			border-bottom: 4px solid transparent;
 		}
+		
+		.page.wizard .tabs li:hover a { border-color: #047792; }
+		.page.wizard .tabs li.done a { border-color: #04bce6; }
 
 	.page.wizard .tab_wrapper .pointer {
 		border-right: 10px solid transparent;
@@ -61,27 +72,13 @@
 .page.wizard form > div {
 	min-height: 300px;
 }
-.page.wizard .wgroup_finish {
-	height: 300px;
-}
-	.page.wizard .wgroup_finish h1 {
-		text-align: center;
-	}
-	.page.wizard .wgroup_finish .wizard_support,
-	.page.wizard .wgroup_finish .description {
-		font-size: 25px;
-		line-height: 120%;
-		margin: 20px 0;
-		text-align: center;
-	}
 
-	.page.wizard .button.green {
-		padding: 20px;
-		font-size: 25px;
-		margin: 10px 30px 80px;
-		display: block;
-		text-align: center;
-	}
+.page.wizard .button.green {
+	padding: 20px;
+	font-size: 25px;
+	margin: 10px 0 80px;
+	display: block;
+}
 
 .page.wizard .tab_nzb_providers {
 	margin: 20px 0 0 0;

couchpotato/core/plugins/wizard/static/wizard.js

@@ -9,27 +9,12 @@ Page.Wizard = new Class({
 	headers: {
 		'welcome': {
 			'title': 'Welcome to the new CouchPotato',
-			'description': 'To get started, fill in each of the following settings as much as you can. <br />Maybe first start with importing your movies from the previous CouchPotato',
+			'description': 'To get started, fill in each of the following settings as much as you can.',
 			'content': new Element('div', {
 				'styles': {
 					'margin': '0 0 0 30px'
 				}
-			}).adopt(
-				new Element('div', {
-					'html': 'Select the <strong>data.db</strong>. It should be in your CouchPotato root directory.'
-				}),
-				self.import_iframe = new Element('iframe', {
-					'styles': {
-						'height': 40,
-						'width': 300,
-						'border': 0,
-						'overflow': 'hidden'
-					}
-				})
-			),
-			'event': function(){
-				self.import_iframe.set('src', Api.createUrl('v1.import'))
-			}
+			})
 		},
 		'general': {
 			'title': 'General',
@@ -178,7 +163,7 @@ Page.Wizard = new Class({
 							'href': App.createUrl('wizard/'+group),
 							'text': (self.headers[group].label || group).capitalize()
 						})
-					).inject(tabs);
+					).inject(tabs)
 
 				}
 				else
@@ -214,13 +199,7 @@ Page.Wizard = new Class({
 		self.el.getElement('.t_searcher').hide();
 
 		// Add pointer
-		new Element('.tab_wrapper').wraps(tabs).adopt(
-			self.pointer = new Element('.pointer', {
-				'tween': {
-					'transition': 'quint:in:out'
-				}
-			})
-		);
+		new Element('.tab_wrapper').wraps(tabs);
 
 		// Add nav
 		var minimum = self.el.getSize().y-window.getSize().y;
@@ -232,16 +211,18 @@ Page.Wizard = new Class({
 			if(!t) return;
 
 			var func = function(){
-				var ct = t.getCoordinates();
-				self.pointer.tween('left', ct.left+(ct.width/2)-(self.pointer.getWidth()/2));
+				// Activate all previous ones
+				self.groups.each(function(groups2, nr2){
+					var t2 = self.el.getElement('.t_'+groups2);
+						t2[nr2 > nr ? 'removeClass' : 'addClass' ]('done');
+				})
 				g.tween('opacity', 1);
 			}
 
 			if(nr == 0)
 				func();
 
-
-			var ss = new ScrollSpy( {
+			new ScrollSpy( {
 				min: function(){
 					var c = g.getCoordinates();
 					var top = c.top-(window.getSize().y/2);