[wiz][minor] style fixes, static label, first entry mandatory (#3647)

frappe/desk/page/setup_wizard/setup_wizard.css

@@ -1,5 +1,9 @@
+#page-setup-wizard {
+    margin-top: 30px;
+}
+
 .setup-wizard-brand {
-	margin: 40px;
+	margin: 30px;
 	text-align: center;
 	display: flex;
 	justify-content: center;
@@ -33,10 +37,10 @@
 }
 
 .setup-wizard-slide .lead {
-	margin: 40px;
+	margin: 30px;
 	color: #777777;
 	text-align: center;
-	font-size: 30px;
+	font-size: 24px;
 }
 
 .setup-wizard-slide .col-sm-12 {
@@ -52,7 +56,6 @@
 }
 
 .setup-wizard-slide .form-control {
-	height: 35px;
 	font-weight: 500;
 }
 
@@ -69,7 +72,7 @@
 }
 
 .setup-wizard-slide.with-form {
-	margin: 40px auto;
+	margin: 30px auto;
 	padding: 10px 50px;
 	border: 1px solid #d1d8dd;
 	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
@@ -79,12 +82,6 @@
 	padding: 30px 0px;
 }
 
-.setup-wizard-slide a.next-btn,
-.setup-wizard-slide a.complete-btn {
-	font-size: 14px;
-	padding: 7px 25px;
-}
-
 .setup-wizard-slide a.next-btn.disabled,
 .setup-wizard-slide a.complete-btn.disabled {
 	background-color: #b1bdca;
@@ -117,7 +114,7 @@
 	width: 140px;
 	height: 180px; /*depends on presence of heading*/
 	text-align: center;
-	margin-left: 33%;
+	margin-left: calc((100% - 140px)/2);
 }
 
 .setup-wizard-slide .frappe-control[data-fieldtype="Attach Image"] .form-group,

frappe/desk/page/setup_wizard/setup_wizard.js

@@ -233,9 +233,16 @@ frappe.setup.WizardSlide = Class.extend({
 
 		if(this.add_more) {
 			this.count = 1;
-			fields = fields.map(field => {
-				if(field.fieldname) field.fieldname += '_1';
-				if(field.label) field.label += ' 1';
+			fields = fields.map((field, i) => {
+				if(field.fieldname) {
+					field.fieldname += '_1';
+				}
+				if(i === 1 && this.mandatory_entry) {
+					field.reqd = 1;
+				}
+				if(!field.static) {
+					if(field.label) field.label += ' 1';
+				}
 				return field;
 			});
 		}
@@ -278,6 +285,9 @@ frappe.setup.WizardSlide = Class.extend({
 		if(this.onload) {
 			this.onload(this);
 		}
+		this.set_reqd_fields();
+		this.bind_fields_to_next($primary_btn);
+
 		this.reset_next($primary_btn);
 		this.focus_first_input();
 	},
@@ -322,7 +332,9 @@ frappe.setup.WizardSlide = Class.extend({
 				var fields = JSON.parse(JSON.stringify(this.fields));
 				this.form.add_fields(fields.map(field => {
 					if(field.fieldname) field.fieldname += '_' + this.count;
-					if(field.label) field.label += ' ' + this.count;
+					if(!field.static) {
+						if(field.label) field.label += ' ' + this.count;
+					}
 					return field;
 				}));
 				if(this.count === this.max_count) {
@@ -437,7 +449,7 @@ var frappe_slides = [
 
 		fields: [
 			{ fieldname: "language", label: __("Your Language"),
-				fieldtype: "Select", "default": "English" }
+				fieldtype: "Select", reqd: 1}
 		],
 
 		onload: function(slide) {
@@ -497,7 +509,7 @@ var frappe_slides = [
 				label: __("Attach Your Picture"), is_private: 0},
 			{ "fieldname": "full_name", "label": __("Full Name"), "fieldtype": "Data",
 				reqd:1},
-			{ "fieldname": "email", "label": __("Email Address") + ' <i>(' + __("Will be your login ID") + ')</i>',
+			{ "fieldname": "email", "label": __("Email Address") + ' (' + __("Will be your login ID") + ')',
 				"fieldtype": "Data", "options":"Email"},
 			{ "fieldname": "password", "label": __("Password"), "fieldtype": "Password" }
 		],