Packages
phoenix_kit
1.7.21
1.7.208
1.7.207
1.7.206
1.7.205
1.7.204
1.7.203
1.7.202
1.7.201
1.7.200
1.7.199
1.7.198
1.7.197
1.7.196
1.7.194
1.7.193
1.7.192
1.7.191
1.7.190
1.7.189
1.7.187
1.7.186
1.7.185
1.7.184
1.7.183
1.7.182
1.7.181
1.7.180
1.7.179
1.7.178
1.7.177
1.7.176
1.7.175
1.7.174
1.7.173
1.7.172
1.7.171
1.7.170
1.7.169
1.7.168
1.7.167
1.7.166
1.7.165
1.7.164
1.7.162
1.7.161
1.7.160
1.7.159
1.7.157
1.7.156
1.7.155
1.7.154
1.7.153
1.7.152
1.7.151
1.7.150
1.7.149
1.7.146
1.7.145
1.7.144
1.7.143
1.7.138
1.7.133
1.7.132
1.7.131
1.7.130
1.7.128
1.7.126
1.7.125
1.7.121
1.7.120
1.7.119
1.7.118
1.7.117
1.7.116
1.7.115
1.7.114
1.7.113
1.7.112
1.7.111
1.7.110
1.7.109
1.7.108
1.7.107
1.7.106
1.7.105
1.7.104
1.7.103
1.7.102
1.7.101
1.7.100
1.7.99
1.7.98
1.7.97
1.7.96
1.7.95
1.7.94
1.7.93
1.7.92
1.7.91
1.7.90
1.7.89
1.7.88
1.7.87
1.7.86
1.7.85
1.7.84
1.7.83
1.7.82
1.7.81
1.7.80
1.7.79
1.7.78
1.7.77
1.7.76
1.7.75
1.7.74
1.7.71
1.7.70
1.7.69
1.7.66
1.7.65
1.7.64
1.7.63
1.7.62
1.7.61
1.7.59
1.7.58
1.7.57
1.7.56
1.7.55
1.7.54
1.7.53
1.7.52
1.7.51
1.7.49
1.7.44
1.7.43
1.7.42
1.7.41
1.7.39
1.7.38
1.7.37
1.7.36
1.7.34
1.7.33
1.7.31
1.7.30
1.7.29
1.7.28
1.7.27
1.7.26
1.7.25
1.7.24
1.7.23
1.7.22
1.7.21
1.7.20
1.7.19
1.7.18
1.7.17
1.7.16
1.7.15
1.7.14
1.7.13
1.7.12
1.7.11
1.7.10
1.7.9
1.7.8
1.7.7
1.7.6
1.7.5
1.7.4
1.7.3
1.7.2
1.7.1
1.7.0
1.6.20
1.6.19
1.6.18
1.6.17
1.6.16
1.6.15
1.6.14
1.6.13
1.6.12
1.6.11
1.6.10
1.6.9
1.6.8
1.6.7
1.6.6
1.6.5
1.6.4
1.6.3
1.5.2
1.5.1
1.5.0
1.4.9
1.4.8
1.4.7
1.4.6
1.4.5
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.2
1.3.1
1.3.0
1.2.10
1.2.9
1.2.8
1.2.7
1.2.5
1.2.4
1.2.2
1.2.1
1.2.0
1.1.0
1.0.0
A foundation for building Elixir Phoenix apps — SaaS, social networks, ERP systems, marketplaces, and more
Current section
Files
Jump to
Current section
Files
lib/phoenix_kit_web/users/magic_link_registration.html.heex
<PhoenixKitWeb.Components.LayoutWrapper.app_layout
flash={@flash}
phoenix_kit_current_scope={assigns[:phoenix_kit_current_scope]}
page_title={@page_title}
>
<div class="flex items-center justify-center py-8 min-h-[80vh]">
<div class="card bg-base-100 w-full max-w-sm shadow-2xl">
<div class="card-body">
<h1 class="text-2xl font-bold text-center mb-2">Complete Your Registration</h1>
<p class="text-center text-base-content/60 text-sm mb-6">
Email: <strong>{@email}</strong>
</p>
<.form
for={@form}
id="registration_completion_form"
phx-submit="save"
phx-change="validate"
phx-trigger-action={@trigger_submit}
action={Routes.path("/users/log-in?_action=registered")}
method="post"
>
<%!-- Hidden email field for session controller --%>
<input type="hidden" name="user[email]" value={@email} />
<fieldset class="fieldset">
<legend class="fieldset-legend sr-only">Account Information</legend>
<div :if={@check_errors} class="alert alert-error text-sm mb-4">
<PhoenixKitWeb.Components.Core.Icons.icon_error_circle class="stroke-current shrink-0 h-6 w-6" />
<span>Oops, something went wrong! Please check the errors below.</span>
</div>
<%!-- Username Field --%>
<div phx-feedback-for="user[username]">
<label class="label" for="user_username">
<span class="label-text flex items-center">
<PhoenixKitWeb.Components.Core.Icons.icon_user_profile class="w-4 h-4 mr-2" />
Username
</span>
</label>
<.input
field={@form[:username]}
type="text"
placeholder="Choose a unique username"
autocomplete="username"
class="transition-colors focus:input-primary"
/>
</div>
<%!-- Password Field --%>
<div phx-feedback-for="user[password]">
<label class="label" for="user_password">
<span class="label-text flex items-center">
<PhoenixKitWeb.Components.Core.Icons.icon_lock class="w-4 h-4 mr-2" /> Password
</span>
</label>
<.input
field={@form[:password]}
type="password"
placeholder="Choose a secure password"
autocomplete="new-password"
class="transition-colors focus:input-primary"
required
/>
</div>
<%!-- First Name Field (optional) --%>
<div phx-feedback-for="user[first_name]">
<label class="label" for="user_first_name">
<span class="label-text">First Name</span>
</label>
<.input
field={@form[:first_name]}
type="text"
placeholder="Your first name (optional)"
autocomplete="given-name"
class="transition-colors focus:input-primary"
/>
</div>
<%!-- Last Name Field (optional) --%>
<div phx-feedback-for="user[last_name]">
<label class="label" for="user_last_name">
<span class="label-text">Last Name</span>
</label>
<.input
field={@form[:last_name]}
type="text"
placeholder="Your last name (optional)"
autocomplete="family-name"
class="transition-colors focus:input-primary"
/>
</div>
<%!-- Referral Code Field --%>
<%= if @referral_codes_enabled do %>
<div phx-feedback-for="referral_code">
<.label for="referral_code">
Referral Code<%= if @referral_codes_required do %>
*
<% end %>
</.label>
<input
id="referral_code"
name="referral_code"
type="text"
class={[
"input input-bordered",
(@referral_code_error ||
(@check_errors && @referral_codes_required &&
(is_nil(@referral_code) || @referral_code == ""))) && "input-error"
]}
placeholder="Enter your referral code"
value={@referral_code || ""}
required={@referral_codes_required}
/>
<%= if @referral_code_error do %>
<.error>{@referral_code_error}</.error>
<% end %>
</div>
<% end %>
<button
type="submit"
phx-disable-with="Creating account..."
class="btn btn-primary w-full mt-4 transition-all hover:scale-[1.02] active:scale-[0.98]"
>
<PhoenixKitWeb.Components.Core.Icons.icon_user_add class="w-5 h-5 mr-2" />
Complete Registration <span aria-hidden="true">→</span>
</button>
</fieldset>
</.form>
</div>
</div>
</div>
</PhoenixKitWeb.Components.LayoutWrapper.app_layout>