Use of fontastic instead of font-awesome

Gemfile

@@ -60,8 +60,6 @@ gem 'browser'
 gem 'turnout'
 gem 'redcarpet'
 
-gem 'font-awesome-sass', '~> 4.5.0' # icons
-
 group :development, :test do
   # Call 'byebug' anywhere in the code to stop execution and get a debugger console
   gem 'byebug'

Gemfile.lock

@@ -163,8 +163,6 @@ GEM
       i18n (~> 0.5)
     faraday (0.9.2)
       multipart-post (>= 1.2, < 3)
-    font-awesome-sass (4.5.0)
-      sass (>= 3.2)
     foundation-rails (6.2.0.1)
       railties (>= 3.1.0)
       sass (>= 3.3.0, < 3.5)
@@ -459,7 +457,6 @@ DEPENDENCIES
   email_spec
   factory_girl_rails
   faker
-  font-awesome-sass (~> 4.5.0)
   foundation-rails
   foundation_rails_helper
   fuubar

app/assets/fonts/icons.svg

@@ -48,4 +48,5 @@
 <glyph glyph-name="budget" unicode="&#83;" d="M33 256l223 0 0 223c-5 1-11 1-16 1-115 0-208-93-208-208 0-5 0-11 1-16z m77-146c38-48 96-78 162-78 115 0 208 93 208 208 0 66-30 124-78 162-31 26-71 42-114 45l0-223-223 0c3-43 19-83 45-114z"/>
 <glyph glyph-name="notification" unicode="&#110;" d="M256 48c23 0 41 19 41 42l-82 0c0-23 18-42 41-42z m135 125l0 114c0 64-45 118-104 131l0 15c0 17-13 31-31 31-18 0-31-14-31-31l0-15c-59-13-104-67-104-131l0-114-41-42 0-21 352 0 0 21z"/>
 <glyph glyph-name="no-notification" unicode="&#120;" d="M257 392c7 0 24-5 24-5 46-10 78-52 78-100l0-127 9-10 8-8-240 0 8 8 9 10 0 127c0 48 33 90 78 100 0 0 18 5 24 5m1 72c-18 0-31-14-31-31l0-15c-59-13-104-67-104-131l0-114-41-42 0-21 352 0 0 21-41 42 0 114c0 64-45 118-104 131l0 15c0 17-13 31-31 31z m41-374l-82 0c0-23 18-42 41-42 23 0 41 19 41 42z"/>
+<glyph glyph-name="whatsapp" unicode="&#80;" d="M318 234c2 0 12-4 28-13 16-8 24-13 25-15 1-1 1-2 1-4 0-7-2-14-5-22-3-7-10-14-20-19-11-5-20-7-29-7-11 0-29 6-55 17-18 9-34 20-48 34-14 14-28 32-42 53-14 20-21 39-21 55l0 3c1 17 8 32 21 45 5 4 10 6 15 6 1 0 3 0 5 0 3-1 5-1 6-1 3 0 6 0 7-2 2-1 3-3 5-7 1-4 5-13 9-26 5-13 7-20 7-21 0-4-3-9-9-16-7-7-10-12-10-14 0-1 0-2 1-4 7-14 16-27 29-39 11-10 25-20 43-29 3-1 5-2 7-2 3 0 8 5 15 14 8 9 13 14 15 14z m-58-152c24 0 47 5 70 15 22 9 41 22 57 38 16 16 29 35 38 57 10 22 14 46 14 70 0 24-4 47-14 69-9 22-22 42-38 58-16 16-35 28-57 38-23 9-46 14-70 14-24 0-47-5-70-14-22-10-41-22-57-38-16-16-29-36-38-58-10-22-14-45-14-69 0-39 11-74 34-105l-23-67 69 22c31-20 63-30 99-30z m0 395c29 0 57-6 84-17 26-11 49-27 68-46 20-19 35-42 46-69 12-26 17-54 17-83 0-29-5-57-17-84-11-26-26-49-46-69-19-19-42-34-68-46-27-11-55-17-84-17-37 0-72 9-104 27l-119-38 38 116c-20 33-30 71-30 111 0 29 5 57 17 83 11 27 26 50 46 69 19 19 42 35 68 46 27 11 55 17 84 17z"/>
 </font></defs></svg>

app/assets/stylesheets/application.scss

@@ -12,5 +12,3 @@
 @import "annotator_overrides";
 @import "jquery-ui/datepicker";
 @import "datepicker_overrides";
-@import "font-awesome-sprockets";
-@import "font-awesome";

app/assets/stylesheets/icons.scss

@@ -160,3 +160,6 @@
 .icon-no-notification:before {
   content: "\78";
 }
+.icon-whatsapp:before {
+  content: "\50";
+}

app/assets/stylesheets/participation.scss

@@ -337,18 +337,20 @@
 
 .debate-show, .proposal-show {
 
-  .social_share_full .social-share-button{
+  .social-share-full .social-share-button{
     display:inline;
   }
 
-  .whatsapp{
+  .whatsapp:before{
+    vertical-align: 10px;
     margin-left: 0.5px;
     color: white;
-    vertical-align: top;
     background-color: #43d854;
-    padding: 7px 9.5px 7px 9.5px;
+    padding: 9.5px 9.8px 9.5px 9.8px;
+    font-size: 1.7em;
   }
 
+
   .edit-debate, .edit-proposal {
     margin-bottom: 0;
   }

app/views/debates/show.html.erb

@@ -54,11 +54,11 @@
         </div>
         <div class="sidebar-divider"></div>
         <h3><%= t("debates.show.share") %></h3>
-        <div class="social_share_full">
+        <div class="social-share-full">
           <%= social_share_button_tag(@debate.title) %>
           <% if browser.mobile? %>
             <a href="whatsapp://send?text=<%= @debate.title %> https://decide.madrid.es/debates/<%= @debate.to_param %>" data-action="share/whatsapp/share">
-              <%= icon('whatsapp', class: 'fa-2x whatsapp') %>
+              <i class="icon-whatsapp whatsapp"></i>
             </a>
           <% end %>
         </div>

app/views/proposals/show.html.erb

@@ -86,11 +86,11 @@
         </div>
         <div class="sidebar-divider"></div>
         <h3><%= t("proposals.show.share") %></h3>
-        <div class="social_share_full">
+        <div class="social-share-full">
           <%= social_share_button_tag(@proposal.title) %>
           <% if browser.mobile? %>
             <a href="whatsapp://send?text=<%= @proposal.title %> https://decide.madrid.es/proposals/<%= @proposal.to_param %>" data-action="share/whatsapp/share">
-              <%= icon('whatsapp', class: 'fa-2x whatsapp') %>
+              <i class="icon-whatsapp whatsapp"></i>
             </a>
           <% end %>
         </div>