Adds styles for not logged votes

app/assets/stylesheets/debates.scss

@@ -11,10 +11,11 @@
 // - - - - - - - - - - - - - - - - - - - - - - - - -
 
 @mixin votes {
-  border-top: 1px solid $votes-border;
-  padding: rem-calc(14) rem-calc(12);
   background: $votes-bg;
+  border-top: 1px solid $votes-border;
   margin: 0 -12px;
+  padding: rem-calc(14) rem-calc(12);
+  position: relative;
 
   .icon-like {
     background: white;
@@ -114,6 +115,24 @@
   .divider {
     margin: 0 rem-calc(6);
   }
+
+  .not-logged {
+    background: $not-logged-bg;
+    color: white;
+    height: 100%;
+    left: 0;
+    line-height: $line-height*2;
+    padding-top: $line-height/2;
+    position: absolute;
+    text-align: center;
+    top: 0;
+    width: 100%;
+
+    a {
+      color: white;
+      text-decoration: underline;
+    }
+  }
 }
 
 // 02. Index
@@ -291,6 +310,11 @@
         line-height: $line-height/2;
       }
     }
+
+    .not-logged {
+      line-height: $line-height;
+      padding-top: $line-height*1.5;
+    }
   }
 }
 
@@ -378,6 +402,11 @@
       float: none;
       line-height: $line-height;
     }
+
+    .not-logged {
+      line-height: $line-height;
+      padding: $line-height;
+    }
   }
 
   .leave-comment {

app/assets/stylesheets/variables.scss

@@ -47,6 +47,8 @@ $votes-text:        #FFFFFF;
 $votes-unlike:      #EF8585;
 $votes-unlike-act:  #BD6A6A;
 
+$not-logged-bg:     rgba(22,99,135,.9);
+
 // 03. Forms
 // - - - - - - - - - - - - - - - - - - - - - - - - -
 

app/views/debates/_votes.html.erb

@@ -20,4 +20,9 @@
   <span class="total-votes">
     <%= pluralize(debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %>
   </span>
+  <div class="not-logged">
+    <%= t("votes.unauthenticated",
+      signin: link_to(t("votes.signin"), new_user_session_path),
+      signup: link_to(t("votes.signup"), new_user_registration_path)).html_safe %>
+  </div>
 </div>

config/locales/en.yml

@@ -61,6 +61,9 @@ en:
     agree: I agree
     disagree: I disagree
     supports: Supports
+    unauthenticated: "You need to %{signin} or %{signup} before continuing."
+    signin: sign in
+    signup: sign up
   account:
     show:
       title: "My account"

config/locales/es.yml

@@ -61,6 +61,9 @@ es:
     agree: Estoy de acuerdo
     disagree: No estoy de acuerdo
     supports: Apoyos
+    unauthenticated: "Necesitas %{signin} o %{signup} para continuar."
+    signin: iniciar sesión
+    signup: registrarte
   account:
     show:
       title: "Mi cuenta"