Skip to content

Commit a8b0c1c

Browse files
lucasleandro1lucasleandro1
authored
Added layout for login and registration page (#316)
* Added layout for login and registration page * change remember_me * added translate to shared_links
1 parent fa4df83 commit a8b0c1c

File tree

6 files changed

+204
-2
lines changed

6 files changed

+204
-2
lines changed

‎app/assets/stylesheets/devise.css‎

Lines changed: 58 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ form {
4040
font-weight: 500;
4141
}
4242

43-
.input input[type="email"] {
43+
.input input[type="email"],
44+
.input input[type="password"] {
4445
width: 94%;
4546
padding: 0.75rem;
4647
border: 1px solid #ccc;
@@ -71,3 +72,59 @@ form {
7172
.submit input[type="submit"]:hover {
7273
background: linear-gradient(to right, #1e40af, #2563eb);
7374
}
75+
76+
.auth-links {
77+
text-align: center;
78+
margin-top: 1.5rem;
79+
}
80+
81+
.auth-links a {
82+
display: block;
83+
color: #1e3a8a;
84+
text-decoration: none;
85+
font-size: 0.95rem;
86+
margin: 0.2rem 0;
87+
transition: color 0.3s ease;
88+
}
89+
90+
.auth-links a:hover {
91+
color: #2563eb;
92+
text-decoration: underline;
93+
}
94+
95+
.oauth-buttons {
96+
display: flex;
97+
justify-content: center;
98+
gap: 1rem;
99+
margin-top: 1.5rem;
100+
}
101+
102+
.oauth-buttons-cancel {
103+
display: flex;
104+
gap: 1rem;
105+
margin-top: 1.5rem;
106+
}
107+
108+
.oauth-buttons button,
109+
.oauth-buttons-cancel button {
110+
padding: 0.5rem 1rem;
111+
border: 1px solid #ccc;
112+
background-color: white;
113+
cursor: pointer;
114+
transition: background-color 0.3s ease;
115+
font-size: 0.9rem;
116+
border-radius: 4px;
117+
}
118+
119+
.oauth-buttons button:hover,
120+
.oauth-buttons-cancel button:hover {
121+
background-color: #f0f0f0;
122+
}
123+
124+
.remember-me {
125+
display: flex;
126+
align-items: center;
127+
gap: 0.5rem;
128+
margin-bottom: 1rem;
129+
font-size: 0.95rem;
130+
}

‎app/views/devise/registrations/edit.html.erb‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<div class="container">
2+
<div class="auth-container">
3+
<h2 class="auth-title"><%= t("devise.registrations.edit.title")%> <%= resource_name.to_s.humanize %></h2>
4+
5+
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
6+
<%= render "devise/shared/error_messages", resource: resource %>
7+
8+
<div class="input">
9+
<p><%= f.label :email %></p>
10+
<p><%= f.email_field :email, autofocus: true, autocomplete: "email" %></p>
11+
</div>
12+
13+
<% if devise_mapping.confirmable? && resource.pending_reconfirmation? %>
14+
<div>Currently waiting confirmation for: <%= resource.unconfirmed_email %></div>
15+
<% end %>
16+
17+
<div class="input">
18+
<p><%= f.label :password %> <i><%=t("devise.registrations.edit.leave_blank_if_you_don_t_want_to_change_it") %></i></p>
19+
<p><%= f.password_field :password, autocomplete: "new-password" %></p>
20+
<% if @minimum_password_length %>
21+
<p><em><%= @minimum_password_length %> <%=t("devise.registrations.edit.characters minimum") %></em></p>
22+
<% end %>
23+
</div>
24+
25+
<div class="input">
26+
<p><%= f.label :password_confirmation %></p>
27+
<p><%= f.password_field :password_confirmation, autocomplete: "new-password" %></p>
28+
</div>
29+
30+
<div class="input">
31+
<p><%= f.label :current_password %> <i><%= t("devise.registrations.edit.we_need_your_current_password_to_confirm_your_changes") %></i></p>
32+
<p><%= f.password_field :current_password, autocomplete: "current-password" %></p>
33+
</div>
34+
35+
<div class="submit">
36+
<%= f.submit t("devise.registrations.edit.update") %>
37+
</div>
38+
<% end %>
39+
40+
41+
<h3><%= t("devise.registrations.edit.unhappy") %></h3>
42+
<div class="oauth-buttons-cancel">
43+
<%= button_to t("devise.registrations.edit.cancel_my_account"),
44+
registration_path(resource_name), data: { confirm: "Are you sure?", turbo_confirm: "Are you sure?" }, method: :delete %>
45+
</div>
46+
47+
<div class="auth-links">
48+
<%= link_to t("devise.shared.links.back"), :back %>
49+
</div>
50+
</div>
51+
</div>

‎app/views/devise/registrations/new.html.erb‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<div class="container">
2+
<div class="auth-container">
3+
<h2 class="auth-title"><%= t("devise.registrations.new.sign_up") %></h2>
4+
5+
<%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
6+
<%= render "devise/shared/error_messages", resource: resource %>
7+
8+
<div class="input">
9+
<p><%= f.label :email %></p>
10+
<p><%= f.email_field :email, autofocus: true, autocomplete: "email" %></p>
11+
</div>
12+
13+
<div class="input">
14+
<p><%= f.label :password %></p>
15+
<% if @minimum_password_length %>
16+
<p><em>(<%= @minimum_password_length %> <%=t("devise.registrations.edit.characters minimum") %>)</em></p>
17+
<% end %>
18+
<p><%= f.password_field :password, autocomplete: "new-password" %></p>
19+
</div>
20+
21+
<div class="input">
22+
<p><%= f.label :password_confirmation %></p>
23+
<p><%= f.password_field :password_confirmation, autocomplete: "new-password" %></p>
24+
</div>
25+
26+
<div class="submit">
27+
<%= f.submit "Sign up" %>
28+
</div>
29+
<% end %>
30+
31+
<%= render "devise/shared/links" %>
32+
33+
</div>
34+
</div>

‎app/views/devise/sessions/new.html.erb‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<div class="container">
2+
<div class="auth-container">
3+
<h2 class="auth-title"><%= t("devise.sessions.new.sign_in") %></h2>
4+
5+
<%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>
6+
<div class="input">
7+
<p><%= f.label :email %></p>
8+
<p><%= f.email_field :email, autofocus: true, autocomplete: "email" %></p>
9+
</div>
10+
11+
<div class="input">
12+
<p><%= f.label :password %></p>
13+
<p><%= f.password_field :password, autocomplete: "current-password" %></p>
14+
</div>
15+
16+
<% if devise_mapping.rememberable? %>
17+
<div class="remember-me">
18+
<%= f.check_box :remember_me %>
19+
<%= f.label :remember_me %>
20+
</div>
21+
<% end %>
22+
23+
<div class="submit">
24+
<%= f.submit "Log in" %>
25+
</div>
26+
<% end %>
27+
28+
<%= render "devise/shared/links" %>
29+
</div>
30+
</div>

‎app/views/devise/shared/_links.html.erb‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<div class="auth-links">
2+
<%- if controller_name != 'sessions' %>
3+
<p><%= link_to t("devise.shared.links.sign_in"), new_session_path(resource_name) %></p>
4+
<% end %>
5+
6+
<%- if devise_mapping.registerable? && controller_name != 'registrations' %>
7+
<p><%= link_to t("devise.shared.links.sign_up"), new_registration_path(resource_name) %></p>
8+
<% end %>
9+
10+
<%- if devise_mapping.recoverable? && controller_name != 'passwords' && controller_name != 'registrations' %>
11+
<p><%= link_to t("devise.shared.links.forgot_your_password"), new_password_path(resource_name) %></p>
12+
<% end %>
13+
14+
<%- if devise_mapping.confirmable? && controller_name != 'confirmations' %>
15+
<p><%= link_to t("devise.shared.links.didn_t_receive_confirmation_instructions"), new_confirmation_path(resource_name) %></p>
16+
<% end %>
17+
18+
<%- if devise_mapping.lockable? && resource_class.unlock_strategy_enabled?(:email) && controller_name != 'unlocks' %>
19+
<p><%= link_to t("devise.shared.links.didn_t_receive_unlock_instructions"), new_unlock_path(resource_name) %></p>
20+
<% end %>
21+
</div>
22+
23+
<div class="oauth-buttons">
24+
<%- if devise_mapping.omniauthable? %>
25+
<%- resource_class.omniauth_providers.each do |provider| %>
26+
<p><%= button_to t("devise.shared.links.sign_in_with_provider"){OmniAuth::Utils.camelize(provider)}, omniauth_authorize_path(resource_name, provider), data: { turbo: false } %></p>
27+
<% end %>
28+
<% end %>
29+
</div>

‎config/locales/pt-BR/devise.yml‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,11 +97,12 @@ pt-BR:
9797
registrations:
9898
destroyed: Adeus! A sua conta foi cancelada com sucesso. Esperamos vê-lo novamente em breve.
9999
edit:
100+
characters minimum: caracteres mínimos
100101
are_you_sure: Você tem certeza?
101102
cancel_my_account: Cancelar minha conta
102103
currently_waiting_confirmation_for_email: "No momento esperando por: %{email}"
103104
leave_blank_if_you_don_t_want_to_change_it: deixe em branco caso não queira alterá-la
104-
title: Editar %{resource}
105+
title: Editar
105106
unhappy: Não está contente?
106107
update: Atualizar
107108
we_need_your_current_password_to_confirm_your_changes: precisamos da sua senha atual para confirmar suas mudanças

0 commit comments

Comments
 (0)