Merge pull request #257 from AyuntamientoMadrid/social_networks

Social networks

app/assets/fonts/icons.svg

@@ -30,4 +30,9 @@
 <glyph unicode="&#112;" d="M475 238c-29 45-65 78-108 101 11-20 17-42 17-65 0-35-13-65-38-90-25-25-55-38-90-38-35 0-65 13-90 38-25 25-38 55-38 90 0 23 6 45 17 65-43-23-79-56-108-101 25-39 57-70 95-94 38-23 79-34 124-34 45 0 86 11 124 34 38 24 70 55 95 94z m-205 109c0 4-2 7-4 10-3 3-6 4-10 4-24 0-44-8-61-25-17-17-26-38-26-62 0-4 1-7 4-9 3-3 6-4 10-4 4 0 7 1 10 4 2 2 4 5 4 9 0 17 5 31 17 42 12 12 26 18 42 18 4 0 7 1 10 4 2 2 4 6 4 9z m242-109c0-7-2-13-6-20-26-44-62-79-107-105-45-27-93-40-143-40-50 0-98 13-143 40-45 26-81 61-107 105-4 7-6 13-6 20 0 6 2 13 6 19 26 44 62 79 107 106 45 26 93 39 143 39 50 0 98-13 143-39 45-27 81-62 107-106 4-6 6-13 6-19z"/>
 <glyph unicode="&#118;" d="M426 134c0-7-3-14-8-19l-39-39c-5-5-12-8-20-8-7 0-14 3-19 8l-84 84-84-84c-5-5-12-8-19-8-8 0-15 3-20 8l-39 39c-5 5-8 12-8 19 0 8 3 14 8 20l84 84-84 84c-5 5-8 12-8 19 0 8 3 14 8 20l39 38c5 6 12 8 20 8 7 0 14-2 19-8l84-84 84 84c5 6 12 8 19 8 8 0 15-2 20-8l39-38c5-6 8-12 8-20 0-7-3-14-8-19l-84-84 84-84c5-6 8-12 8-20z"/>
 <glyph unicode="&#119;" d="M434 389c-1 0-2 0-3 0l0 0c-17-9-37-14-58-14-38 0-73 17-95 45-21 19-49 31-80 31-29 0-56-11-77-29-4 9-13 15-24 15-15 0-27-12-27-27l0-322c0-15 12-27 27-27 15 0 27 12 27 27l0 145c17 9 36 13 56 13 39 0 73-17 96-45 21-19 49-31 79-31 33 0 63 14 84 36 2 2 3 4 3 6l0 169c0 5-4 8-8 8z"/>
+<glyph unicode="&#120;" d="M261 27c0 3-2 5-5 5-11 0-21 4-29 12-8 8-12 18-12 29 0 3-2 5-5 5-3 0-4-2-4-5 0-14 5-26 14-35 10-10 22-15 36-15 3 0 5 1 5 4z m-190 83l370 0c-31 34-54 73-70 117-16 44-24 90-24 139 0 48-30 73-91 73-61 0-91-25-91-73 0-49-8-95-24-139-16-44-39-83-70-117z m423 0c0-10-4-19-11-26-7-7-16-11-26-11l-128 0c0-20-7-37-21-52-15-14-32-21-52-21-20 0-37 7-52 21-14 15-21 32-21 52l-128 0c-10 0-19 4-26 11-7 7-11 16-11 26 36 30 64 68 82 113 19 45 28 93 28 143 0 31 9 56 27 75 19 18 44 29 76 33-2 3-2 7-2 11 0 7 2 14 8 19 5 5 11 8 19 8 8 0 14-3 19-8 6-5 8-12 8-19 0-4 0-8-2-11 32-4 57-15 76-33 18-19 27-44 27-75 0-50 9-98 28-143 18-45 46-83 82-113z"/>
+<glyph unicode="&#121;" d="M256 402c-39 0-75-6-109-20-34-13-61-31-81-53-19-23-29-47-29-73 0-21 6-42 20-61 14-19 33-36 58-50l24-14-7-28c-5-17-12-34-20-49 29 12 55 28 78 49l13 11 16-2c13-2 25-2 37-2 39 0 75 6 109 20 34 13 61 31 81 53 19 23 29 47 29 73 0 26-10 50-29 73-20 22-47 40-81 53-34 14-70 20-109 20z m256-146c0-33-11-64-34-92-23-28-54-50-93-66-40-17-83-25-129-25-13 0-27 1-41 2-38-33-82-56-132-69-9-2-20-4-32-6l-2 0c-3 0-5 1-8 3-2 2-3 5-4 8l0 0c-1 1-1 2 0 4 0 1 0 2 0 2 0 1 1 2 2 3l1 3c0 0 1 1 2 2 2 2 2 3 3 3 1 1 4 5 8 10 5 5 8 8 10 10 2 3 5 6 9 12 4 5 7 10 9 14 3 5 5 10 8 17 3 7 5 14 8 22-30 17-54 38-71 63-17 25-26 51-26 80 0 33 11 64 34 92 23 28 54 50 93 66 40 17 83 25 129 25 46 0 89-8 129-25 39-16 70-38 93-66 23-28 34-59 34-92z"/>
+<glyph unicode="&#122;" d="M183 203l0-20c0-8-4-14-11-17-3-1-5-1-7-1-6 0-10 1-13 5l-147 146c-3 4-5 8-5 13 0 5 2 9 5 13l147 146c5 6 12 8 20 4 7-3 11-9 11-17l0-19-114-114c-3-4-5-8-5-13 0-5 2-9 5-13z m329-11c0-11-2-24-5-38-3-15-7-28-11-40-4-11-9-23-14-35-5-12-8-21-11-26l-6-12c-1-3-4-4-8-4-1 0-2 0-2 0-5 1-7 5-7 10 8 76-2 130-30 161-12 14-29 24-49 32-20 7-46 12-76 15l0-72c0-8-4-14-12-17-2-1-4-1-7-1-5 0-9 1-13 5l-146 146c-3 4-5 8-5 13 0 5 2 9 5 13l146 146c6 6 13 8 20 4 8-3 12-9 12-17l0-74c78-6 135-27 171-64 32-33 48-81 48-145z"/>
+<glyph unicode="&#65;" d="M292 353l74 0-9-81-65 0 0-235-97 0 0 235-49 0 0 81 49 0 0 49c0 35 8 61 24 79 17 18 44 26 81 26l65 0 0-81-40 0c-8 0-14 0-18-2-5-1-8-3-10-6-2-4-3-7-4-10 0-3-1-8-1-14z"/>
+<glyph unicode="&#66;" d="M269 93c0 4-1 8-2 12-1 4-1 7-2 10-1 3-3 7-5 10-3 4-5 6-6 9-2 2-5 5-8 8-3 4-6 6-8 8-2 1-5 4-9 7-4 3-7 5-9 6-1 2-5 4-9 7-5 3-8 5-9 6-3 0-8 1-14 1-11 0-21-1-31-2-9-2-20-4-30-8-11-3-20-7-28-13-8-5-15-12-20-21-5-9-8-19-8-31 0-13 4-24 10-34 7-11 16-19 27-24 11-6 22-11 34-13 12-3 24-5 37-5 11 0 22 1 32 4 10 2 19 6 28 11 9 5 16 12 22 21 5 9 8 19 8 31z m-35 247c0 11-1 23-4 36-4 13-8 25-14 37-6 12-14 22-24 30-10 8-21 12-34 12-18 0-31-7-41-20-10-13-15-29-15-47 0-9 1-18 4-28 2-10 5-20 10-30 4-10 10-19 16-27 6-8 13-14 22-19 9-5 18-7 28-7 18 0 32 5 40 17 8 11 12 27 12 46z m-37 135l125 0-39-22-38 0c13-9 24-21 31-36 7-16 11-32 11-48 0-15-2-27-6-38-5-11-10-20-16-26-7-7-13-13-19-19-7-5-12-11-16-17-5-6-7-13-7-20 0-5 2-9 5-14 3-5 7-9 12-14 5-4 11-9 17-14 6-4 12-10 18-15 6-6 12-13 17-19 5-7 9-15 12-25 3-9 5-19 5-30 0-30-13-57-40-81-29-25-69-37-120-37-11 0-23 1-34 3-12 2-23 5-35 9-12 5-22 10-31 17-9 7-16 15-22 25-6 11-9 22-9 35 0 12 4 25 11 39 6 12 15 22 27 31 12 9 26 16 42 21 15 4 30 8 44 10 14 2 28 3 43 4-12 16-18 30-18 42 0 3 0 5 0 7 1 2 1 4 2 6 0 1 1 3 2 6 1 2 1 4 2 6-8-1-14-2-20-2-29 0-53 10-73 28-20 19-31 43-31 71 0 26 9 50 28 71 18 21 40 35 66 41 18 4 36 5 54 5z m297-73l0-36-73 0 0-73-37 0 0 73-73 0 0 36 73 0 0 73 37 0 0-73z"/>
 </font></defs></svg>

app/assets/stylesheets/icons.scss

@@ -106,4 +106,18 @@
 .icon-flag:before {
   content: "w";
 }
-
+.icon-notification:before {
+  content: "x";
+}
+.icon-comment:before {
+  content: "y";
+}
+.icon-reply:before {
+  content: "z";
+}
+.icon-facebook:before {
+  content: "A";
+}
+.icon-google-plus:before {
+  content: "B";
+}

app/assets/stylesheets/participacion.scss

@@ -14,6 +14,7 @@
 // 12. Official levels
 // 13. Pagination
 // 14. Tables
+// 15. Social
 //
 
 // 01. Variables
@@ -856,4 +857,122 @@ table {
   }
 }
 
+// 15. Social
+// - - - - - - - - - - - - - - - - - - - - - - - - -
 
+.button.button-twitter {
+  background: #45B0E3;
+
+  &:before {
+    background: #40A2D1;
+    content: "f";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 0;
+    line-height: $line-height*2;
+    padding: 0 rem-calc(20);
+    position: absolute;
+    top: 0;
+  }
+}
+
+.social-share-button-twitter {
+  background: #45B0E3;
+  color: white;
+  height: rem-calc(48);
+  position: relative;
+  width: rem-calc(48);
+
+  &:before {
+    content: "f";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 50%;
+    line-height: $line-height*2;
+    margin-left: rem-calc(-11);
+    position: absolute;
+    top: 0;
+  }
+
+  &:hover {
+    color: #40A2D1;
+  }
+}
+
+.button.button-facebook {
+  background: #3B5998;
+
+  &:before {
+    background: #354F88;
+    content: "A";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 0;
+    line-height: $line-height*2;
+    padding: 0 rem-calc(20);
+    position: absolute;
+    top: 0;
+  }
+}
+
+.social-share-button-facebook {
+  background: #3B5998;
+  color: white;
+  height: rem-calc(48);
+  position: relative;
+  width: rem-calc(48);
+
+  &:before {
+    content: "A";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 50%;
+    line-height: $line-height*2;
+    margin-left: rem-calc(-11);
+    position: absolute;
+    top: 0;
+  }
+
+  &:hover {
+    color: #354F88;
+  }
+}
+
+.button.button-google {
+  background: #DE4C34;
+
+  &:before {
+    background: #CE3E26;
+    content: "B";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 0;
+    line-height: $line-height*2;
+    padding: 0 rem-calc(20);
+    position: absolute;
+    top: 0;
+  }
+}
+
+.social-share-button-google_plus {
+  background: #DE4C34;
+  color: white;
+  height: rem-calc(48);
+  position: relative;
+  width: rem-calc(48);
+
+  &:before {
+    content: "B";
+    font-family: "icons" !important;
+    font-size: rem-calc(24);
+    left: 50%;
+    line-height: $line-height*2;
+    margin-left: rem-calc(-11);
+    position: absolute;
+    top: 0;
+  }
+
+  &:hover {
+    color: #CE3E26;
+  }
+}

app/views/devise/_omniauth_form.html.erb

@@ -1,7 +1,11 @@
-<br/>
-
-<%= link_to t("omniauth.twitter.sign_in"), user_omniauth_authorize_path(:twitter), class: 'button radius expand' %>
-<%= link_to t("omniauth.facebook.sign_in"), user_omniauth_authorize_path(:facebook), class: 'button radius expand' %>
-<%= link_to t("omniauth.google_oauth2.sign_in"), user_omniauth_authorize_path(:google_oauth2), class: 'button radius expand' %>
-
+<% if current_page?(new_user_session_path) %>
+  <%= link_to t("omniauth.twitter.sign_in"), user_omniauth_authorize_path(:twitter), class: "button-twitter button radius expand" %>
+  <%= link_to t("omniauth.facebook.sign_in"), user_omniauth_authorize_path(:facebook), class: "button-facebook button radius expand" %>
+  <%= link_to t("omniauth.google_oauth2.sign_in"), user_omniauth_authorize_path(:google_oauth2), class: "button-google button radius expand" %>
   <hr/>
+<% elsif current_page?(new_user_registration_path) %>
+  <%= link_to t("omniauth.twitter.sign_up"), user_omniauth_authorize_path(:twitter), class: "button-twitter button radius expand" %>
+  <%= link_to t("omniauth.facebook.sign_up"), user_omniauth_authorize_path(:facebook), class: "button-facebook button radius expand" %>
+  <%= link_to t("omniauth.google_oauth2.sign_up"), user_omniauth_authorize_path(:google_oauth2), class: "button-google button radius expand" %>
+  <hr/>
+<% end %>

config/locales/devise_views.en.yml

@@ -58,7 +58,7 @@ en:
           password_label: "Password"
           password_confirmation_label: "Confirm password"
           submit: "Sign up"
-          organization_signup: "Do you represent an organization / group?"
+          organization_signup: "Do you represent an organization / group? Enter here"
     organizations:
       registrations:
         new:

config/locales/devise_views.es.yml

@@ -58,7 +58,7 @@ es:
           password_label: "Contraseña"
           password_confirmation_label: "Confirmar contraseña"
           submit: "Registrarse"
-          organization_signup: "¿Representas a una organización / colectivo?"
+          organization_signup: "¿Representas a una organización / colectivo? Entra aquí"
     organizations:
       registrations:
         new:

config/locales/en.yml

@@ -152,7 +152,10 @@ en:
       title: Add Email
     twitter:
       sign_in: Sign in with Twitter
+      sign_up: Sign up with Twitter
     facebook:
       sign_in: Sign in with Facebook
+      sign_up: Sign up with Facebook
     google_oauth2:
       sign_in: Sign in with Google
+      sign_up: Sign up with Google

config/locales/es.yml

@@ -152,7 +152,10 @@ es:
       title: Añade tu email
     twitter:
       sign_in: Entra con Twitter
+      sign_up: Regístrate con Twitter
     facebook:
       sign_in: Entra con Facebook
+      sign_up: Regístrate con Facebook
     google_oauth2:
       sign_in: Entra con Google
+      sign_up: Regístrate con Google

spec/features/users_spec.rb

@@ -74,7 +74,7 @@ feature 'Users' do
         expect do
           expect do
             expect do
-              click_link 'Sign in with Twitter'
+              click_link 'Sign up with Twitter'
             end.not_to change { ActionMailer::Base.deliveries.size }
           end.to change { Identity.count }.by(1)
         end.to change { User.count }.by(1)
@@ -109,7 +109,7 @@ feature 'Users' do
         expect do
           expect do
             expect do
-              click_link 'Sign in with Twitter'
+              click_link 'Sign up with Twitter'
             end.not_to change { ActionMailer::Base.deliveries.size }
           end.to change { Identity.count }.by(1)
         end.to change { User.count }.by(1)