consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improves styles for omniauth buttons

Browse Source
This commit is contained in:
Alberto Garcia Cabeza
2017-01-09 18:49:29 +01:00
parent 42d147a462
commit 201a222cd3
5 changed files with 95 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app/assets/stylesheets/layout.scss
View File

@@ -618,6 +618,11 @@ h2.sidebar-title {
h1 {
margin-top: $line-height;
img {
height: rem-calc(80);
width: rem-calc(80);
}
a {
color: white;
display: block;
@@ -643,6 +648,19 @@ h2.sidebar-title {
}
}
.auth-divider {
border-bottom: 1px solid $border;
height: $line-height/2;
margin: $line-height 0;
text-align: center;
span {
background: white;
font-weight: bold;
padding: 0 $line-height/2;
}
}
// 06. Forms
// ---------

77
app/views/devise/_omniauth_form.html.erb
View File

@@ -1,33 +1,72 @@
<% if feature?(:twitter_login) || feature?(:facebook_login) || feature?(:google_login) %>
<% if current_page?(new_user_session_path) %>
<div class="row">
<div class="small-12 column">
<div class="margin">
<strong><%= t("omniauth.info_sign_in") %></strong>
</div>
</div>
<% if feature? :twitter_login %>
<%= link_to t("omniauth.twitter.sign_in"), user_omniauth_authorize_path(:twitter), class: "button-twitter button expanded" %>
<% end %>
<% if feature? :twitter_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.twitter.name"), user_omniauth_authorize_path(:twitter),
title: t("omniauth.twitter.sign_in"),
class: "button-twitter button expanded" %>
</div>
<% end %>
<% if feature? :facebook_login %>
<%= link_to t("omniauth.facebook.sign_in"), user_omniauth_authorize_path(:facebook), class: "button-facebook button expanded" %>
<% end %>
<% if feature? :facebook_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.facebook.name"), user_omniauth_authorize_path(:facebook),
title: t("omniauth.facebook.sign_in"),
class: "button-facebook button expanded" %>
</div>
<% end %>
<% if feature? :google_login %>
<%= link_to t("omniauth.google_oauth2.sign_in"), user_omniauth_authorize_path(:google_oauth2), class: "button-google button expanded" %>
<% end %>
<% if feature? :google_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.google_oauth2.name"), user_omniauth_authorize_path(:google_oauth2),
title: t("omniauth.google_oauth2.sign_in"),
class: "button-google button expanded" %>
</div>
<% end %>
<div class="small-12 column auth-divider">
<span><%= t("omniauth.or_fill") %></span>
</div>
</div>
<hr/>
<% elsif current_page?(new_user_registration_path) %>
<div class="row">
<div class="small-12 column">
<p><%= t("omniauth.info_sign_up") %></p>
</div>
<% if feature? :twitter_login %>
<%= link_to t("omniauth.twitter.sign_up"), user_omniauth_authorize_path(:twitter), class: "button-twitter button expanded" %>
<% end %>
<% if feature? :twitter_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.twitter.name"), user_omniauth_authorize_path(:twitter),
title: t("omniauth.twitter.sign_up"),
class: "button-twitter button expanded" %>
</div>
<% end %>
<% if feature? :facebook_login %>
<%= link_to t("omniauth.facebook.sign_up"), user_omniauth_authorize_path(:facebook), class: "button-facebook button expanded" %>
<% end %>
<% if feature? :facebook_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.facebook.name"), user_omniauth_authorize_path(:facebook),
title: t("omniauth.facebook.sign_up"),
class: "button-facebook button expanded" %>
</div>
<% end %>
<% if feature? :google_login %>
<%= link_to t("omniauth.google_oauth2.sign_up"), user_omniauth_authorize_path(:google_oauth2), class: "button-google button expanded" %>
<% end %>
<% if feature? :google_login %>
<div class="small-12 medium-4 column end">
<%= link_to t("omniauth.google_oauth2.name"), user_omniauth_authorize_path(:google_oauth2),
title: t("omniauth.google_oauth2.sign_up"),
class: "button-google button expanded" %>
</div>
<% end %>
</div>
<hr/>
<% end %>

2
app/views/layouts/devise.html.erb
View File

@@ -26,7 +26,7 @@
<div class="small-12 medium-9 column">
<div class="row">
<div class="small-12 medium-6 small-centered column">
<div class="auth-form">
<div class="auth-form margin">
<%= render 'layouts/flash' %>
<%= yield %>

9
config/locales/en.yml
View File

@@ -245,14 +245,23 @@ en:
facebook:
sign_in: Sign in with Facebook
sign_up: Sign up with Facebook
name: Facebook
finish_signup:
title: Add your email address
google_oauth2:
sign_in: Sign in with Google
sign_up: Sign up with Google
name: Google
twitter:
sign_in: Sign in with Twitter
sign_up: Sign up with Twitter
name: Twitter
info_sign_in: "Sign in with:"
info_sign_up: "Sign up with:"
or_fill: "Or fill the following form:"
finish_signup:
title: "Additional details"
username_warning: "Due to a change in the way we interact with social networks, it is possible that your username now appears as 'already in use'. If that is your case, please choose a different username."
proposals:
create:
form:

9
config/locales/es.yml
View File

@@ -245,14 +245,23 @@ es:
facebook:
sign_in: Entra con Facebook
sign_up: Regístrate con Facebook
name: Facebook
finish_signup:
title: Añade tu email
google_oauth2:
sign_in: Entra con Google
sign_up: Regístrate con Google
name: Google
twitter:
sign_in: Entra con Twitter
sign_up: Regístrate con Twitter
name: Twitter
info_sign_in: "Entra con:"
info_sign_up: "Regístrate con:"
or_fill: "O rellena el siguiente formulario:"
finish_signup:
title: "Detalles adicionales de tu cuenta"
username_warning: "Debido a que hemos cambiado la forma en la que nos conectamos con redes sociales y es posible que tu nombre de usuario aparezca como 'ya en uso', incluso si antes podías acceder con él. Si es tu caso, por favor elige un nombre de usuario distinto."
proposals:
create:
form: