improves styles for whatsapp sharing button

app/assets/stylesheets/participation.scss

@@ -337,17 +337,17 @@
 
 .debate-show, .proposal-show {
 
-  .social-share-full .social-share-button{
+  .social-share-full .social-share-button {
     display:inline;
   }
 
-  .whatsapp:before{
+  .whatsapp:before {
-    vertical-align: 10px;
-    margin-left: 0.5px;
-    color: white;
     background-color: #43d854;
-    padding: 9.5px 9.8px 9.5px 9.8px;
+    color: white;
     font-size: 1.7em;
+    margin-left: rem-calc(0.5);
+    padding: rem-calc(9.5) rem-calc(9.8);
+    vertical-align: rem-calc(10);
   }
 
 

app/views/debates/show.html.erb

@@ -58,7 +58,7 @@
           <%= social_share_button_tag(@debate.title) %>
           <% if browser.mobile? %>
             <a href="whatsapp://send?text=<%= @debate.title %> <%= debate_url(@debate) %>" data-action="share/whatsapp/share">
-              <i class="icon-whatsapp whatsapp"></i>
+              <span class="icon-whatsapp whatsapp"></span>
             </a>
           <% end %>
         </div>

app/views/proposals/show.html.erb

@@ -90,7 +90,7 @@
           <%= social_share_button_tag(@proposal.title) %>
           <% if browser.mobile? %>
             <a href="whatsapp://send?text=<%= @proposal.title %> <%= proposal_url(@proposal) %>" data-action="share/whatsapp/share">
-              <i class="icon-whatsapp whatsapp"></i>
+              <span class="icon-whatsapp whatsapp"></span>
             </a>
           <% end %>
         </div>