Style code input

This commit is contained in:
Jason Zimdars
2025-10-14 17:13:19 -05:00
committed by Stanko K.R.
parent 6ae20f9a9b
commit 0e064fbcd5
2 changed files with 13 additions and 3 deletions
+12
View File
@@ -28,6 +28,18 @@
&[readonly] {
--focus-ring-size: 0;
}
&[autocomplete='one-time-code'] {
--input-spacing: 0.5em;
font-family: var(--font-mono);
font-size: var(--text-large);
font-weight: 900;
inline-size: 18ch;
letter-spacing: 1ch;
min-inline-size: 18ch;
text-align: center;
}
}
.input--file {
+1 -3
View File
@@ -17,9 +17,7 @@
<%= form_with url: session_magic_link_path, method: :post, html: { class: "flex flex-column gap", data: { controller: token_list("auto-submit" => params[:code].present?)} } do |form| %>
<div class="flex align-center gap">
<label class="flex align-center gap input input--actor">
<%= form.text_field :code, required: true, class: "input full-width txt-align-center", autofocus: true, autocomplete: "code", placeholder: "Enter the code", value: params[:code] %>
</label>
<%= form.text_field :code, required: true, class: "input center txt-align-enter", autofocus: true, "data-1p-ignore": true, autocomplete: "one-time-code", maxlength: "6", value: params[:code] %>
</div>
<button type="submit" id="log_in" class="btn btn--link center">