Rails link_to tag tag avec glyphicon stylé

Question

J'essaie d'utiliser les icônes de glyphes que j'ai stylisées dans mon application rails.

Je veux faire de l'icône un lien vers une autre page, mais je ne peux pas utiliser le style bootstrap standard car j'ai personnalisé les liens pour le style de ma page.

Je continue d'obtenir une erreur de classe de mot-clé - est-ce que quelqu'un sait pourquoi?

Merci.

je le lien suivant à mon avis:

<li><%= link_to <span class="glyphicon glyphicon-comment"></span>, page_path('messages') %> </li> 

J'ai aussi css comme suit:

span.glyphicon-comment { 
    vertical-align:middle; 
    margin:auto; 
    padding:10px; 
    font-size: 2em; 
    text-align: right; 
    a:link {text-decoration:none; background-color:transparent; color:grey;}; 
    a:visited {text-decoration:none;background-color:transparent; color:grey;}; 
    a:hover {text-decoration:none;background-color:transparent; color:dark grey;}; 
    a:active {text-decoration:none;background-color:transparent; color:grey;}; 
} 

Answer 1

Vous devez utiliser "autour de la chaîne, doivent également appeler la méthode html_safe sur il.

<%= link_to "<span class=\"glyphicon glyphicon-comment\"></span>".html_safe, page_path('messages') %> 

mais une façon meilleure et plus propre serait

<%= link_to page_path('messages') do %> 
    <span class="glyphicon glyphicon-comment"></span> 
<% end %> 

Answer 2

Votre problème est que vous utilisez a:visited {text-decoration:none; background-color:transparent; color:grey;}; sur votre css glyphicon mais ils devraient être sur votre lien

Essayez ceci:

<%= link_to page_path('messages'), class: "comment_link" do %> 
    <span class="glyphicon glyphicon-comment"></span> 
<% end %> 

et le style de votre lien, si vous êtes en utilisant scss puis:

.comment_link{ 
    .glyphicon-comment{ 
    vertical-align:middle; 
    margin:auto; 
    padding:10px; 
    font-size: 2em; 
    text-align: right; 
    } 
    &:hover, &:visited, &:active{ 
    text-decoration:none; 
    background-color:transparent; 
    color:dark grey; 
    } 
}