David Heinemeier Hansson
33 lines
1.5 KiB
Plaintext
33 lines
1.5 KiB
Plaintext
<% @page_title = "Sign in" %>
|
|
|
|
<div class="panel shadow center margin-block-double <%= "shake" if flash[:alert] %>" style="--panel-size: 55ch;">
|
|
<h1 class="txt-xx-large margin-block-end-double">Fizzy</h1>
|
|
|
|
<%= form_with url: session_path, class: "flex flex-column gap txt-large" do |form| %>
|
|
<div class="flex align-center gap">
|
|
<%= translation_button :email_address %>
|
|
<label class="flex align-center gap input input--actor">
|
|
<%= form.email_field :email_address, required: true, class: "input full-width", autofocus: true, autocomplete: "username", placeholder: "Enter your email address" %>
|
|
<%= image_tag "email.svg", aria: { hidden: "true" }, size: 30, class: "colorize--black" %>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="flex align-center gap">
|
|
<%= translation_button :password %>
|
|
<label class="flex align-center gap input input--actor">
|
|
<%= form.password_field :password, required: true, class: "input full-width", autocomplete: "current-password", placeholder: "Enter your password", maxlength: 72 %>
|
|
<%= image_tag "password.svg", aria: { hidden: "true" }, size: 30, class: "colorize--black" %>
|
|
</label>
|
|
</div>
|
|
|
|
<button type="submit" id="log_in" class="btn btn--reversed center">
|
|
<%= icon_tag "arrow-right" %>
|
|
<span class="for-screen-reader">Sign in</span>
|
|
</button>
|
|
<% end %>
|
|
</div>
|
|
|
|
<% content_for :footer do %>
|
|
<div class="txt-align-center center margin-block-double txt-subtle">Fizzy™ version 0</div>
|
|
<% end %>
|