From 44b2e5d524450340c576976dc57d0a1a3da89d8d Mon Sep 17 00:00:00 2001 From: Mohd Khairi Mohd Adnan Date: Mon, 27 Nov 2017 09:35:01 +0800 Subject: [PATCH] center login form --- app/assets/stylesheets/devise.scss | 5 ++- app/views/layouts/login.html.slim | 2 - app/views/users/confirmations/new.html.slim | 37 +++++++++---------- app/views/users/passwords/new.html.slim | 37 +++++++++---------- app/views/users/registrations/new.html.slim | 41 ++++++++++----------- app/views/users/sessions/new.html.slim | 41 ++++++++++----------- 6 files changed, 80 insertions(+), 83 deletions(-) diff --git a/app/assets/stylesheets/devise.scss b/app/assets/stylesheets/devise.scss index 6dc6df2..2ab87f2 100644 --- a/app/assets/stylesheets/devise.scss +++ b/app/assets/stylesheets/devise.scss @@ -1,5 +1,8 @@ .login-form { - margin: auto !important; + margin-left: auto !important; + margin-right: auto !important; + display: flex; + justify-content: center; .card { max-width: 500px; diff --git a/app/views/layouts/login.html.slim b/app/views/layouts/login.html.slim index 5df1b8e..ef3ce8e 100644 --- a/app/views/layouts/login.html.slim +++ b/app/views/layouts/login.html.slim @@ -19,8 +19,6 @@ html margin-bottom: 1rem; } - - body class="#{@color}" main style="padding-top: 4rem" section#login diff --git a/app/views/users/confirmations/new.html.slim b/app/views/users/confirmations/new.html.slim index db2e1f8..139bae7 100644 --- a/app/views/users/confirmations/new.html.slim +++ b/app/views/users/confirmations/new.html.slim @@ -1,19 +1,18 @@ -.row.login-form - .col.s12 - .card.hoverable - .card-content - span.card-title.center - | Resend Confirmation Instructions - .divider - = simple_form_for resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post } do |f| - - if devise_error_messages? || alert - .form-errors.red.lighten-1 - = devise_error_messages! - = alert - .form-inputs.row - = f.input :email, autofocus: true, required: true, value: (resource.pending_reconfirmation? ? resource.unconfirmed_email : resource.email) - .form-actions.center - = f.button :submit, "Resend Confirmation Instructions" - .card-action - .devise-links - = render "users/shared/links" +.login-form + .card.hoverable + .card-content + span.card-title.center + | Resend Confirmation Instructions + .divider + = simple_form_for resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post } do |f| + - if devise_error_messages? || alert + .form-errors.red.lighten-1 + = devise_error_messages! + = alert + .form-inputs.row + = f.input :email, autofocus: true, required: true, value: (resource.pending_reconfirmation? ? resource.unconfirmed_email : resource.email) + .form-actions.center + = f.button :submit, "Resend Confirmation Instructions" + .card-action + .devise-links + = render "users/shared/links" diff --git a/app/views/users/passwords/new.html.slim b/app/views/users/passwords/new.html.slim index 1def992..d66ba8e 100644 --- a/app/views/users/passwords/new.html.slim +++ b/app/views/users/passwords/new.html.slim @@ -1,19 +1,18 @@ -.row.login-form - .col.s12 - .card.hoverable - .card-content - span.card-title.center Forgot your Password? - .divider - = simple_form_for resource, as: resource_name, url: password_path(resource_name), html: { method: :post } do |f| - - if devise_error_messages? || alert - .form-errors.red.lighten-1 - = devise_error_messages! - = alert - .form-inputs.row - = f.input :email, autofocus: true, required: true - .form-actions.center - = f.button :submit, "Send Me Reset Instructions" - .card-action - .devise-links - = render "users/shared/links" - +.login-form + .card.hoverable + .card-content + span.card-title.center Forgot your Password? + .divider + = simple_form_for resource, as: resource_name, url: password_path(resource_name), html: { method: :post } do |f| + - if devise_error_messages? || alert + .form-errors.red.lighten-1 + = devise_error_messages! + = alert + .form-inputs.row + = f.input :email, autofocus: true, required: true + .form-actions.center + = f.button :submit, "Send Me Reset Instructions" + .card-action + .devise-links + = render "users/shared/links" + diff --git a/app/views/users/registrations/new.html.slim b/app/views/users/registrations/new.html.slim index 9c4ab87..a3e8402 100644 --- a/app/views/users/registrations/new.html.slim +++ b/app/views/users/registrations/new.html.slim @@ -1,21 +1,20 @@ -.row.login-form - .col.s12 - .card.hoverable - .card-content - span.card-title.center Sign Up - .divider - = simple_form_for resource, as: resource_name, url: registration_path(resource_name) do |f| - - if devise_error_messages? || alert - .form-errors.red.lighten-1 - = devise_error_messages! - = alert - .form-inputs.row - = f.input :email, autofocus: true, required: true - = f.input :password, autocomplete: "off", required: true, icon: "lock", label_html: { data: { hint: "#{@minimum_password_length} Characters Minimum" } } - = f.input :password_confirmation, autocomplete: "off", required: true, icon: "lock" - .form-actions.center - = f.button :submit, "Sign Up" - .card-action - .devise-links - = render "users/shared/links" - +.login-form + .card.hoverable + .card-content + span.card-title.center Sign Up + .divider + = simple_form_for resource, as: resource_name, url: registration_path(resource_name) do |f| + - if devise_error_messages? || alert + .form-errors.red.lighten-1 + = devise_error_messages! + = alert + .form-inputs.row + = f.input :email, autofocus: true, required: true + = f.input :password, autocomplete: "off", required: true, icon: "lock", label_html: { data: { hint: "#{@minimum_password_length} Characters Minimum" } } + = f.input :password_confirmation, autocomplete: "off", required: true, icon: "lock" + .form-actions.center + = f.button :submit, "Sign Up" + .card-action + .devise-links + = render "users/shared/links" + diff --git a/app/views/users/sessions/new.html.slim b/app/views/users/sessions/new.html.slim index c342977..cd808df 100644 --- a/app/views/users/sessions/new.html.slim +++ b/app/views/users/sessions/new.html.slim @@ -1,21 +1,20 @@ -.row.login-form - .col.s12 - .card.hoverable - .card-content - span.card-title.center Log In - .divider - = simple_form_for resource, as: resource_name, url: session_path(resource_name) do |f| - - if devise_error_messages? || alert - .form-errors.red.lighten-1 - = devise_error_messages! - = alert - .form-inputs.row - = f.input :email, required: true, autofocus: true - = f.input :password, required: true, autocomplete: "off", icon: "lock", hint: false - = f.input :remember_me, as: :boolean if devise_mapping.rememberable? - .form-actions.center - = f.button :submit, "Log In" - .card-action - .devise-links - = render "users/shared/links" - +.login-form + .card.hoverable + .card-content + span.card-title.center Log In + .divider + = simple_form_for resource, as: resource_name, url: session_path(resource_name) do |f| + - if devise_error_messages? || alert + .form-errors.red.lighten-1 + = devise_error_messages! + = alert + .form-inputs.row + = f.input :email, required: true, autofocus: true + = f.input :password, required: true, autocomplete: "off", icon: "lock", hint: false + = f.input :remember_me, as: :boolean if devise_mapping.rememberable? + .form-actions.center + = f.button :submit, "Log In" + .card-action + .devise-links + = render "users/shared/links" +