Eugen Rochko
8 years ago
parent
6f7c9774c7
commit
43df35213e
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
@ -0,0 +1,182 @@ |
||||
.form-container { |
||||
max-width: 400px; |
||||
padding: 20px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
.simple_form { |
||||
.input { |
||||
margin-bottom: 15px; |
||||
} |
||||
|
||||
.input.file { |
||||
padding: 15px 0; |
||||
margin-bottom: 0; |
||||
|
||||
label { |
||||
font-family: 'Roboto'; |
||||
font-size: 16px; |
||||
color: #fff; |
||||
width: 100px; |
||||
display: inline-block; |
||||
} |
||||
|
||||
input[type=file] { |
||||
width: 280px; |
||||
} |
||||
} |
||||
|
||||
.fields-group { |
||||
margin-bottom: 25px; |
||||
} |
||||
|
||||
.input.boolean { |
||||
margin-bottom: 5px; |
||||
|
||||
label { |
||||
font-family: 'Roboto'; |
||||
font-size: 14px; |
||||
color: #9baec8; |
||||
} |
||||
|
||||
input[type=checkbox] { |
||||
display: inline-block; |
||||
margin-bottom: -13px; |
||||
} |
||||
} |
||||
|
||||
input[type=text], input[type=email], input[type=password], textarea { |
||||
background: transparent; |
||||
border: 0; |
||||
border-bottom: 2px solid #9baec8; |
||||
padding: 7px 0; |
||||
font-size: 16px; |
||||
color: #fff; |
||||
display: block; |
||||
width: 100%; |
||||
outline: 0; |
||||
font-family: 'Roboto'; |
||||
|
||||
&:invalid { |
||||
box-shadow: none; |
||||
} |
||||
|
||||
&:focus:invalid { |
||||
border-bottom-color: #df405a; |
||||
} |
||||
|
||||
&:required:valid { |
||||
border-bottom-color: #79bd9a; |
||||
} |
||||
|
||||
&:active, &:focus { |
||||
border-bottom-color: #2b90d9; |
||||
} |
||||
} |
||||
|
||||
.input.field_with_errors { |
||||
input[type=text], input[type=email], input[type=password] { |
||||
border-bottom-color: #df405a; |
||||
} |
||||
|
||||
.error { |
||||
font-weight: 500; |
||||
color: #df405a; |
||||
} |
||||
} |
||||
|
||||
.prompt { |
||||
font-size: 16px; |
||||
color: #9baec8; |
||||
text-align: center; |
||||
|
||||
.prompt-highlight { |
||||
font-weight: 500; |
||||
color: #fff; |
||||
} |
||||
} |
||||
|
||||
code.copypasteable { |
||||
display: block; |
||||
font-family: 'Roboto Mono', monospace; |
||||
font-weight: 400; |
||||
font-size: 12px; |
||||
margin-top: 20px; |
||||
background: #282c37; |
||||
border-radius: 4px; |
||||
padding: 2px; |
||||
word-wrap: break-word; |
||||
} |
||||
|
||||
.actions { |
||||
margin-top: 30px; |
||||
|
||||
button { |
||||
display: block; |
||||
width: 100%; |
||||
border: 0; |
||||
border-radius: 4px; |
||||
background: #2b90d9; |
||||
color: #fff; |
||||
font-size: 18px; |
||||
padding: 10px; |
||||
text-transform: uppercase; |
||||
cursor: pointer; |
||||
font-weight: 500; |
||||
outline: 0; |
||||
margin-bottom: 10px; |
||||
|
||||
&:hover { |
||||
background-color: lighten(#2b90d9, 5%); |
||||
} |
||||
|
||||
&:active, &:focus { |
||||
position: relative; |
||||
top: 1px; |
||||
background-color: darken(#2b90d9, 5%); |
||||
} |
||||
|
||||
&.negative { |
||||
background: #df405a; |
||||
|
||||
&:hover { |
||||
background-color: lighten(#df405a, 5%); |
||||
} |
||||
|
||||
&:active, &:focus { |
||||
background-color: darken(#df405a, 5%); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.flash-message { |
||||
background: #282c37; |
||||
color: #9baec8; |
||||
border-radius: 4px; |
||||
padding: 15px 10px; |
||||
margin-bottom: 30px; |
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); |
||||
text-align: center; |
||||
|
||||
strong { |
||||
font-weight: 500; |
||||
} |
||||
} |
||||
|
||||
.form-footer { |
||||
margin-top: 30px; |
||||
text-align: center; |
||||
|
||||
a { |
||||
color: #9baec8; |
||||
text-decoration: none; |
||||
|
||||
&:hover { |
||||
color: #d9e1e8; |
||||
text-decoration: underline; |
||||
} |
||||
} |
||||
} |
||||
|
||||
@ -1,12 +1,12 @@ |
||||
- content_for :page_title do |
||||
Confirmation instructions |
||||
|
||||
= form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post }) do |f| |
||||
= devise_error_messages! |
||||
= simple_form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post }) do |f| |
||||
= render 'shared/error_messages', object: resource |
||||
|
||||
= f.input :email, autofocus: true, required: true, placeholder: 'E-mail address' |
||||
|
||||
.field |
||||
= f.email_field :email, autofocus: true, required: true, placeholder: 'E-mail address' |
||||
.actions |
||||
= f.button "Resend confirmation instructions", type: 'submit' |
||||
= f.button :button, "Resend confirmation instructions", type: :submit |
||||
|
||||
.form-footer= render "auth/shared/links" |
||||
|
||||
@ -1,15 +1,14 @@ |
||||
- content_for :page_title do |
||||
Set new password |
||||
|
||||
= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put }) do |f| |
||||
= devise_error_messages! |
||||
= f.hidden_field :reset_password_token |
||||
|
||||
.field |
||||
= f.password_field :password, autofocus: true, autocomplete: "off", placeholder: 'New password' |
||||
.field |
||||
= f.password_field :password_confirmation, autocomplete: "off", placeholder: 'Confirm new password' |
||||
= simple_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put }) do |f| |
||||
= render 'shared/error_messages', object: resource |
||||
= f.input :reset_password_token, as: :hidden |
||||
|
||||
= f.input :password, autofocus: true, autocomplete: "off", placeholder: 'New password' |
||||
= f.input :password_confirmation, autocomplete: "off", placeholder: 'Confirm new password' |
||||
|
||||
.actions |
||||
= f.button "Change my password", type: :submit |
||||
= f.button :button, "Change my password", type: :submit |
||||
|
||||
= render "devise/shared/links" |
||||
.form-footer= render "devise/shared/links" |
||||
|
||||
@ -1,12 +1,12 @@ |
||||
- content_for :page_title do |
||||
Reset password |
||||
|
||||
= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f| |
||||
= devise_error_messages! |
||||
= simple_form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f| |
||||
= render 'shared/error_messages', object: resource |
||||
|
||||
= f.input :email, autofocus: true, required: true, placeholder: 'E-mail address' |
||||
|
||||
.field |
||||
= f.email_field :email, autofocus: true, required: true, placeholder: 'E-mail address' |
||||
.actions |
||||
= f.button "Reset password", type: 'submit' |
||||
= f.button :button, "Reset password", type: :submit |
||||
|
||||
.form-footer= render "auth/shared/links" |
||||
|
||||
@ -1,19 +1,15 @@ |
||||
- content_for :page_title do |
||||
Change password |
||||
|
||||
= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| |
||||
= devise_error_messages! |
||||
= simple_form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| |
||||
= render 'shared/error_messages', object: resource |
||||
|
||||
.field |
||||
= f.email_field :email, placeholder: 'E-mail address' |
||||
.field |
||||
= f.password_field :password, autocomplete: "off", placeholder: 'New password' |
||||
.field |
||||
= f.password_field :password_confirmation, autocomplete: "off", placeholder: 'Confirm new password' |
||||
.field |
||||
= f.password_field :current_password, autocomplete: "off", placeholder: 'Current password' |
||||
= f.input :email, placeholder: 'E-mail address' |
||||
= f.input :password, autocomplete: "off", placeholder: 'New password' |
||||
= f.input :password_confirmation, autocomplete: "off", placeholder: 'Confirm new password' |
||||
= f.input :current_password, autocomplete: "off", placeholder: 'Current password' |
||||
|
||||
.actions |
||||
= f.button "Save changes", type: 'submit' |
||||
= f.button :button, "Save changes", type: :submit |
||||
|
||||
.form-footer= render "settings/shared/links" |
||||
|
||||
@ -1,20 +1,17 @@ |
||||
- content_for :page_title do |
||||
Sign up |
||||
|
||||
= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| |
||||
= devise_error_messages! |
||||
= simple_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| |
||||
= render 'shared/error_messages', object: resource |
||||
|
||||
= f.fields_for :account do |ff| |
||||
.field |
||||
= ff.text_field :username, autofocus: true, placeholder: 'Username', required: true |
||||
= f.simple_fields_for :account do |ff| |
||||
= ff.input :username, autofocus: true, placeholder: 'Username', required: true |
||||
|
||||
= f.input :email, placeholder: 'E-mail address', required: true |
||||
= f.input :password, autocomplete: "off", placeholder: 'Password', required: true |
||||
= f.input :password_confirmation, autocomplete: "off", placeholder: 'Confirm password', required: true |
||||
|
||||
.field |
||||
= f.email_field :email, placeholder: 'E-mail address', required: true |
||||
.field |
||||
= f.password_field :password, autocomplete: "off", placeholder: 'Password', required: true |
||||
.field |
||||
= f.password_field :password_confirmation, autocomplete: "off", placeholder: 'Confirm password', required: true |
||||
.actions |
||||
= f.button "Sign up", type: 'submit' |
||||
= f.button :button, "Sign up", type: :submit |
||||
|
||||
.form-footer= render "auth/shared/links" |
||||
|
||||
@ -1,12 +1,11 @@ |
||||
- content_for :page_title do |
||||
Log in |
||||
|
||||
= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| |
||||
.field |
||||
= f.email_field :email, autofocus: true, placeholder: 'E-mail address', required: true |
||||
.field |
||||
= f.password_field :password, autocomplete: "off", placeholder: 'Password', required: true |
||||
= simple_form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| |
||||
= f.input :email, autofocus: true, placeholder: 'E-mail address', required: true |
||||
= f.input :password, placeholder: 'Password', required: true |
||||
|
||||
.actions |
||||
= f.button "Log in", type: 'submit' |
||||
= f.button :button, "Log in", type: :submit |
||||
|
||||
.form-footer= render "auth/shared/links" |
||||
|
||||
@ -1,22 +1,16 @@ |
||||
- content_for :page_title do |
||||
Preferences |
||||
|
||||
= form_for current_user, url: settings_preferences_path, html: { method: :put } do |f| |
||||
= f.fields_for :notification_emails, current_user.settings(:notification_emails) do |ff| |
||||
.boolean-field |
||||
= ff.check_box :follow |
||||
= ff.label :follow, 'Send e-mail when someone follows you' |
||||
.boolean-field |
||||
= ff.check_box :reblog |
||||
= ff.label :reblog, 'Send e-mail when someone reblogs your status' |
||||
.boolean-field |
||||
= ff.check_box :favourite |
||||
= ff.label :favourite, 'Send e-mail when someone favourites your status' |
||||
.boolean-field |
||||
= ff.check_box :mention |
||||
= ff.label :mention, 'Send e-mail when someone mentions you' |
||||
= simple_form_for current_user, url: settings_preferences_path, html: { method: :put } do |f| |
||||
= render 'shared/error_messages', object: current_user |
||||
|
||||
= f.simple_fields_for :notification_emails, current_user.settings(:notification_emails) do |ff| |
||||
= ff.input :follow, as: :boolean, wrapper: :with_label, label: 'Send e-mail when someone follows you' |
||||
= ff.input :reblog, as: :boolean, wrapper: :with_label, label: 'Send e-mail when someone reblogs your status' |
||||
= ff.input :favourite, as: :boolean, wrapper: :with_label, label: 'Send e-mail when someone favourites your status' |
||||
= ff.input :mention, as: :boolean, wrapper: :with_label, label: 'Send e-mail when someone mentions you' |
||||
|
||||
.actions |
||||
= f.button 'Save changes', type: :submit |
||||
= f.button :button, 'Save changes', type: :submit |
||||
|
||||
.form-footer= render "settings/shared/links" |
||||
|
||||
@ -1,19 +1,15 @@ |
||||
- content_for :page_title do |
||||
Edit profile |
||||
|
||||
= form_for @account, url: settings_profile_path, html: { method: :put } do |f| |
||||
.field |
||||
= f.text_field :display_name, placeholder: 'Display name' |
||||
.field |
||||
= f.text_area :note, placeholder: 'Bio' |
||||
.file-field |
||||
= f.label :avatar |
||||
= f.file_field :avatar |
||||
.file-field |
||||
= f.label :header |
||||
= f.file_field :header |
||||
= simple_form_for @account, url: settings_profile_path, html: { method: :put } do |f| |
||||
= render 'shared/error_messages', object: @account |
||||
|
||||
= f.input :display_name, placeholder: 'Display name' |
||||
= f.input :note, placeholder: 'Bio' |
||||
= f.input :avatar, wrapper: :with_label |
||||
= f.input :header, wrapper: :with_label |
||||
|
||||
.actions |
||||
= f.button 'Save changes', type: :submit |
||||
= f.button :button, 'Save changes', type: :submit |
||||
|
||||
.form-footer= render "settings/shared/links" |
||||
|
||||
@ -0,0 +1,6 @@ |
||||
- if object.errors.any? |
||||
.flash-message#error_explanation |
||||
%strong |
||||
Something isn't quite right yet! Please review |
||||
= pluralize(object.errors.count, 'error') |
||||
below: |
||||
Loading…
Reference in new issue