How to assign a link to omniauth facebook button - css

Question

This is the code I have:
<div class="col-md-6 col-sm-6 col-xs-6">
<%- if devise_mapping.omniauthable? %>
<%- resource_class.omniauth_providers.each do |provider| %>
<%= link_to "Sign in", omniauth_authorize_path(resource_name, provider) %>
<% end -%>
<% end -%>
</div>
From the code above how can I change link_to "Sign in" with:
<button class="btn btn-facebook btn btn-lg btn-block"><i class="fa fa-facebook fa-2x"></i> | Connect with <br> Facebook</button>
So instead of "sign in" simple button, I will show my custom made Facebook button.

Answer 1

Answer: this is how i solved it
<div class="col-md-6 col-sm-6 col-xs-6">
<%- if devise_mapping.omniauthable? %>
<%- resource_class.omniauth_providers.each do |provider| %>
<%= link_to omniauth_authorize_path(resource_name, provider), class: 'btn btn-facebook btn btn-lg btn-block' do %>
<i class="fa fa-facebook fa-2x"></i>
|Connect with <br> Facebook
<% end %>
<% end -%>
<% end -%>
</div>
and it looks like this
when someone clicks on that,it gets redirected to the required path,which is omniauth_authorize_path(resource_name, provider)
for those who need the css code for this button here it is
.btn-facebook.btn.btn-lg.btn-block {
color: white;
background-color: DodgerBlue;
font-size: 1em;
&:hover {
color: white;
background-color: RoyalBlue;
}
}
I would appreciate if someone,would tell me how to make the "f" icon,to be in the center of the button.
Thank you

Answer 2

What I did:
<%= link_to raw('<span class="fa fa-facebook"></span> Ingresa con Facebook'), user_omniauth_authorize_path(:facebook), :class => 'btn btn-block btn-social btn-facebook form-control' %>
Im using the bootstrap-social gem and the font-awesome gem to style it exactly like facebook looks :P
https://github.com/gavinkflam/bootstrap-social-rails