Add registration page

WebCms/Views/MacroPartials/Membership/Login.cshtml

@@ -1,34 +1,27 @@
 @inherits Umbraco.Web.Macros.PartialViewMacroPage
 @using System.Web.Mvc.Html
-@using ClientDependency.Core.Mvc
 @using Umbraco.Web
 @using Umbraco.Web.Models
 @using Umbraco.Web.Controllers
 @{
     var loginModel = new LoginModel { RedirectUrl = "/leaf-data/manage-queue/" };
-
-    Html.EnableClientValidation();
-    Html.EnableUnobtrusiveJavaScript();
-    Html.RequiresJs("~/scripts/jquery.validate.min.js");
-    Html.RequiresJs("~/scripts/jquery.validate.unobtrusive.min.js");
-    Html.RequiresJs("~/scripts/jquery.validate.unobtrusive.bootstrap.min.js");
 }
 
-<div class="container top-buffer">
-<div class="row">
-    <div class="col-md-7 card card-body bg-light">
+<div class="container mt-5">
+<div class="row justify-content-center">
+    <div class="col-lg-4 card card-body bg-light">
         @using (Html.BeginUmbracoForm<UmbLoginController>("HandleLogin"))
         {
             <fieldset>
                 @Html.ValidationSummary("loginModel", true)
                 <div class="form-group">
                     @Html.LabelFor(m => loginModel.Username)
-                    @Html.TextBoxFor(m => loginModel.Username)
+                    @Html.TextBoxFor(m => loginModel.Username, new {@class = "form-control" })
                     @Html.ValidationMessageFor(m => loginModel.Username)
                 </div>
                 <div class="form-group">
                     @Html.LabelFor(m => loginModel.Password)
-                    @Html.PasswordFor(m => loginModel.Password)
+                    @Html.PasswordFor(m => loginModel.Password, new {@class = "form-control" })
                     @Html.ValidationMessageFor(m => loginModel.Password)
                 </div>
 

WebCms/Views/MacroPartials/Membership/Register.cshtml

@@ -0,0 +1,77 @@
+@inherits Umbraco.Web.Macros.PartialViewMacroPage
+@using ClientDependency.Core.Mvc
+@using Umbraco.Web.Controllers
+<!-- https://24days.in/umbraco-cms/2015/membership-apis-investigation/ -->
+<!-- https://our.umbraco.com/forum/templates-partial-views-and-macros/93133-membership-provider-registration-form -->
+@{
+    var membershipHelper = new Umbraco.Web.Security.MembershipHelper(UmbracoContext.Current);
+    var registerModel = membershipHelper.CreateRegistrationModel();
+
+    var success = TempData["FormSuccess"] != null;
+
+    Html.EnableClientValidation();
+    Html.RequiresJs("~/scripts/jquery.validate.min.js", 2);
+    Html.RequiresJs("~/scripts/jquery.validate.unobtrusive.min.js", 2);
+
+    Html.RequiresJs("~/scripts/Register.js");
+}
+
+<div class="container mt-5">
+    <div class="row justify-content-center">
+        <div class="col-lg-6 card card-body bg-light">
+@if (success)
+{
+    <p>Registration succeeded.</p>
+}
+else
+{
+    using (Html.BeginUmbracoForm<UmbRegisterController>(
+           "HandleRegisterMember", 
+            null,
+            new {id="register-member"}))
+    {
+        <div class="form-group">
+            @Html.ValidationSummary("registerModel", true)
+
+            @Html.LabelFor(m => registerModel.Name)
+            @Html.TextBoxFor(m => registerModel.Name, new { @class = "form-control" })
+            @Html.ValidationMessageFor(m => registerModel.Name)
+        </div>
+        <div class="form-group">
+            @Html.LabelFor(m => registerModel.Email)
+            @Html.TextBoxFor(m => registerModel.Email, new { @class = "form-control" })
+            @Html.ValidationMessageFor(m => registerModel.Email)
+        </div>
+        <div class="form-group">
+            @Html.LabelFor(m => registerModel.Password)
+            @Html.PasswordFor(m => registerModel.Password, new { @class = "form-control" })
+            @Html.ValidationMessageFor(m => registerModel.Password)
+        </div>
+        <div class="form-group">
+            @Html.Label("VerifyPassword")
+            @Html.Password("VerifyPassword", null, new { @class = "form-control" })
+            @Html.ValidationMessage("VerifyPassword")
+        </div>
+
+        if (registerModel.MemberProperties != null)
+        {
+            for (var i = 0; i < registerModel.MemberProperties.Count; i++)
+            {
+                <div class="form-group">
+                    @Html.LabelFor(m => registerModel.MemberProperties[i].Value, registerModel.MemberProperties[i].Name)
+                    @Html.EditorFor(m => registerModel.MemberProperties[i].Value, new { @class = "form-control" })
+                    @Html.HiddenFor(m => registerModel.MemberProperties[i].Alias)
+                </div>
+            }
+        }
+
+        @Html.HiddenFor(m => registerModel.MemberTypeAlias)
+        @Html.HiddenFor(m => registerModel.RedirectUrl)
+        @Html.HiddenFor(m => registerModel.UsernameIsEmail)
+
+        <button type="submit" class="btn btn-primary pull-right">Register</button>
+    }
+}
+        </div>
+    </div>
+</div>