Stanko K.R.
4fb1cddb4c
This simplifies the loading and cleanup logic, while providing ubiquitous support across JS frameworks. Buttons can now be added in any way imaginable and still work without requiring additional initialization. The upside of this aproach is that it doesn't require a mutation observer nor a global click listener, and is supported by all browsers that also support passkeys.
32 lines
1.3 KiB
Plaintext
32 lines
1.3 KiB
Plaintext
<% @page_title = "Enter your email" %>
|
|
|
|
<div class="panel panel--centered flex flex-column gap-half">
|
|
<h1 class="txt-x-large font-weight-black margin-block-end">Get into Fizzy</h1>
|
|
|
|
<%= form_with url: session_path, class: "flex flex-column gap-half txt-medium" do |form| %>
|
|
<div class="flex align-center gap">
|
|
<label class="flex align-center gap input input--actor">
|
|
<%= form.email_field :email_address, required: true, class: "input txt-large full-width", autofocus: true, autocomplete: "username webauthn", placeholder: "Enter your email address…" %>
|
|
</label>
|
|
</div>
|
|
|
|
<% if Account.accepting_signups? %>
|
|
<p><strong>New here?</strong> <%= link_to "Sign up", new_signup_path %> to create an account. <strong>Already have an account?</strong> Enter your email and we'll get you signed in.</p>
|
|
<% else %>
|
|
<p>Enter your email and we'll get you signed in.</p>
|
|
<% end %>
|
|
|
|
<button type="submit" id="log_in" class="btn btn--link center txt-medium">
|
|
<span>Let's go</span>
|
|
<%= icon_tag "arrow-right" %>
|
|
</button>
|
|
<% end %>
|
|
|
|
<%= passkey_sign_in_button "Sign in with a passkey", session_passkey_path, options: @request_options, mediation: "conditional", class: "btn btn--link center txt-medium", hidden: true %>
|
|
|
|
</div>
|
|
|
|
<% content_for :footer do %>
|
|
<%= render "sessions/footer" %>
|
|
<% end %>
|