mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-02 20:15:22 +02:00
Apply default form styling (#272)
* Add and organise component stylesheets * Revert CSS folder and file structure * Add FormsHelper and FormBuilder to apply component classes * Refactor label args Co-authored-by: Jose Farias <31393016+josefarias@users.noreply.github.com> Signed-off-by: Josh Brown <josh@joossh.com> * Update form field styles * Apply form builder to all fields * Remove redundant style rules Some of these were either duplicative or had no effect. * Apply default submit button styles * Set default form class * Fix opacity of input when focused --------- Signed-off-by: Josh Brown <josh@joossh.com> Co-authored-by: Jose Farias <31393016+josefarias@users.noreply.github.com> Co-authored-by: Josh Pigford <josh@joshpigford.com>
This commit is contained in:
parent
f8174990ca
commit
df3e14a975
11 changed files with 124 additions and 113 deletions
|
@ -2,22 +2,14 @@
|
|||
header_title t('.title')
|
||||
%>
|
||||
|
||||
<%= form_with url: session_path, html: {class: 'space-y-6'} do |form| %>
|
||||
<%= form_with url: session_path do |form| %>
|
||||
<%= auth_messages form %>
|
||||
|
||||
<div class="relative border border-gray-100 bg-offwhite rounded-xl focus-within:bg-white focus-within:shadow focus-within:opacity-100">
|
||||
<%= form.label :email, t('.email'), class: 'p-4 pb-0 block text-sm font-medium text-gray-700' %>
|
||||
<%= form.email_field :email, autofocus: false, autocomplete: "email", required: 'required', placeholder: t('.email_placeholder'), class: 'p-4 pt-1 bg-transparent border-none opacity-50 focus:outline-none focus:ring-0 focus-within:opacity-100 w-full' %>
|
||||
</div>
|
||||
<%= form.email_field :email, label: t('.email'), autofocus: false, autocomplete: "email", required: 'required', placeholder: t('.email_placeholder') %>
|
||||
|
||||
<div class="relative border border-gray-100 bg-offwhite rounded-xl focus-within:bg-white focus-within:shadow focus-within:opacity-100">
|
||||
<%= form.label :password, class: 'p-4 pb-0 block text-sm font-medium text-gray-700' %>
|
||||
<%= form.password_field :password, required: 'required', class: 'p-4 pt-1 bg-transparent border-none opacity-50 focus:outline-none focus:ring-0 focus-within:opacity-100 w-full' %>
|
||||
</div>
|
||||
<%= form.password_field :password, label: true, required: 'required' %>
|
||||
|
||||
<div>
|
||||
<%= form.submit t('.submit'), class: 'cursor-pointer flex justify-center w-full px-4 py-3 text-sm font-medium text-white bg-black rounded-xl hover:bg-black focus:outline-none focus:ring-2 focus:ring-gray-200 shadow' %>
|
||||
</div>
|
||||
<%= form.submit t('.submit') %>
|
||||
<% end %>
|
||||
|
||||
<div class="mt-6 text-center">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue