Added gem to manage dependencies and fine tuned styles.

Gemfile

@@ -26,6 +26,7 @@ gem 'bcrypt', '~> 3.1.7'
 gem 'money-rails'
 gem 'rollbar', '~> 1.3.0'
 gem 'meta-tags'
+gem 'cookies_eu'
 gem 'rails-i18n', git: 'git://github.com/ferblape/rails-i18n.git'
 gem 'dynamic_form'
 

Gemfile.lock

@@ -70,6 +70,9 @@ GEM
       execjs
     coffee-script-source (1.9.0)
     columnize (0.9.0)
+    cookies_eu (1.0.12)
+      jquery-cookie-rails
+      jquery-rails
     database_cleaner (1.4.0)
     debug_inspector (0.0.2)
     debugger-linecache (1.2.0)
@@ -93,6 +96,8 @@ GEM
       i18n (~> 0.5)
       i18n-country-translations (~> 1.0, >= 1.0.3)
       unicode_utils (~> 1.0, >= 1.0.0)
+    jquery-cookie-rails (1.3.1.1)
+      railties (>= 3.2.0, < 5.0)
     jquery-rails (4.0.3)
       rails-dom-testing (~> 1.0)
       railties (>= 4.2.0)
@@ -229,6 +234,7 @@ DEPENDENCIES
   byebug
   capybara
   coffee-rails (~> 4.0.0)
+  cookies_eu
   database_cleaner
   dynamic_form
   email_spec

app/assets/javascripts/application.js

@@ -18,5 +18,6 @@
 //= require slidebars
 //= require select2  
 //= require turbolinks
+//= require cookies_eu
 //= require jquery.sparkline.min
 //= require_tree .

app/assets/stylesheets/application.css.scss

@@ -417,6 +417,60 @@ hr { height: 1px; border:0; background-color: #D9DAAA; margin: 60px 0px 15px; wi
 //Overwriting image for asset_pipeline -> there is probably a better way
 .tipsy .tipsy-arrow { background-image: url(image_path('tipsy.gif')) !important }
 
+.cookies-eu {
+  background: #f2f2f2;
+  border-top: 1px solid #e4e4e4;
+  bottom: 0;
+  font-size: 12px;
+  left: 0;
+  line-height: 20px;
+  padding: 10px;
+  position: fixed;
+  text-align: center;
+  width: 100%;
+  z-index: 999;
+
+  .cookies-eu-content-holder {
+    display: inline-block;
+    padding: 0 20px;
+  }
+  .cookies-eu-button-holder {
+    display: inline-block;
+    padding-right: 20px;
+
+    .cookies-eu-ok {
+      background-color: #7c9200;;
+      border: none;
+      color: #fff;
+      cursor: default;
+      display: inline-block;
+      font-size: 11px;
+      font-weight: bold;
+      height: 24px;
+      line-height: 20px;
+      margin-right: 0px;
+      min-width: 26px;
+      outline: 0;
+      padding: 0 11px;
+      text-align: center;
+      white-space: nowrap;
+      margin: 0 5px;
+    }
+  }
+}
+
+@media only screen and (max-width: 767px){
+  .cookies-eu {
+
+    .cookies-eu-content-holder {
+      line-height: 16px;
+      padding: 5px 20px;
+    }
+    .cookies-eu-button-holder {
+      padding-bottom: 5px;
+    }
+  }
+}
 
 /* Smartphones (portrait and landscape) ----------- */
 @media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

app/views/layouts/application.html.erb

@@ -81,6 +81,8 @@
 	</ul>
 </div>
 
+<%= render 'cookies_eu/cookies_eu' %>
+
 <%= "Locale: #{I18n.locale}" if Rails.env.development? %>
 <%# debug(request) if Rails.env.development? %>
 <%= debug(params) if Rails.env.development? %>

config/locales/en.yml

@@ -192,6 +192,10 @@ en:
       user:
         description: "Check %{user} donations on TrackDons and get inspiration to donate"
         title: "%{user} profile"
+  cookies_eu:
+    cookies_text: "Cookies help us deliver our services. By using our services, you agree to our use of cookies."
+    learn_more: "Learn more"
+    ok: "OK"
   date:
     formats:
       donation: "%b %d %Y"

config/locales/es.yml

@@ -219,6 +219,10 @@ es:
       user:
         description: "Mira las donaciones de %{user} en TrackDons e inspírate para donar"
         title: "Perfil de %{user}"
+  cookies_eu:
+    cookies_text: "Usamos cookies para ofrecerte un mejor servicio, en ningún caso usamos tus datos para beneficio personal o para venderlos a terceros. Si continúas navegando aceptas nuestro uso de las Cookies."
+    learn_more: "Más información"
+    ok: "OK"
   date:
     formats:
       donation: "%d.%m.%Y"