made login/sign up page responsive

This commit is contained in:
Beatrice Olivera 2018-09-02 01:22:03 +01:00
parent da9e799436
commit 7559e39030
4 changed files with 27 additions and 6 deletions

View File

@ -18,13 +18,13 @@
url('https://unsplash.com/photos/jay5BqVyf5A'); url('https://unsplash.com/photos/jay5BqVyf5A');
.login-content { .login-content {
position: relative; position: relative;
top: -10vh; // top: -10vh;
padding: 50px; padding: 50px;
background-color: white; background-color: white;
width: 25vw; width: 25vw;
min-width: 300px;
border-radius: 3px; border-radius: 3px;
box-shadow: 1px 1px 10px rgba(0,0,0, 0.21); box-shadow: 1px 1px 10px rgba(0,0,0, 0.21);

View File

@ -72,6 +72,15 @@ input:checked + .slider:before {
color: black; color: black;
} }
.slider.rounded {
border-radius: 3px;
}
.slider.rounded:before {
border-radius: 3px;
}
.settings { .settings {
color: white; color: white;
} }
@ -102,6 +111,10 @@ input:checked + .slider:before {
align-items: center; align-items: center;
} }
.space-between {
justify-content: space-between;
}
.center-screen { .center-screen {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View File

@ -11,11 +11,19 @@
<%= f.input :password, <%= f.input :password,
required: false, required: false,
input_html: { autocomplete: "current-password" } %> input_html: { autocomplete: "current-password" } %>
<%= f.input :remember_me, as: :boolean if devise_mapping.rememberable? %> <div class="flex-inline space-between">
<%= f.label :remember_me %>
<label class="switch">
<%= f.input_field :enable_transcript, as: :boolean if devise_mapping.rememberable? %>
<span class="slider rounded"></span>
</label>
</div>
<%#= f.input :remember_me, as: :boolean if devise_mapping.rememberable? %>
</div> </div>
<div class="form-actions"> <div class="form-actions">
<%= f.button :submit, "Log in", class: "login btn btn-primary" %> <%= f.button :submit, "Log in", class: "login btn btn-primary vertical-margin" %>
</div> </div>
<% end %> <% end %>

View File

@ -3,11 +3,11 @@
<% end -%> <% end -%>
<%- if devise_mapping.registerable? && controller_name != 'registrations' %> <%- if devise_mapping.registerable? && controller_name != 'registrations' %>
<%#= link_to "Sign up", new_registration_path(resource_name) %><!-- <br /> --> <%= link_to "Sign up", new_registration_path(resource_name) %><!-- <br /> -->
<% end -%> <% end -%>
<%- if devise_mapping.recoverable? && controller_name != 'passwords' && controller_name != 'registrations' %> <%- if devise_mapping.recoverable? && controller_name != 'passwords' && controller_name != 'registrations' %>
<%= link_to "Forgot your password?", new_password_path(resource_name) %><br /> <%#= link_to "Forgot your password?", new_password_path(resource_name) %><br />
<% end -%> <% end -%>
<%- if devise_mapping.confirmable? && controller_name != 'confirmations' %> <%- if devise_mapping.confirmable? && controller_name != 'confirmations' %>