Unicode codepoints change between recompiles

[foca]

Whenever we add a new icon, the code points for other icons change, which breaks our CSS whenever we try to reference icons directly from the stylesheet (e.g. in a :before { content: "\f137"; } rule).

This is kind of annoying, as each new icon means we need to go over a lot of CSS rules to fix the references.

[srekoble]

Is there any solution to the above issue? When more than 1 developer are inserting or deleting icons fontcustom compiles all icons and delivers a huge diff instead of just the newly add/removed icons.

[kinnalru]

You must not use codes directly. Try to use custom sass/less template to generate named mixins. Something like this fontcustom-rails.scss:

//
// Icon Font: <%= font_name %>
//

<%= font_face(url: "font-url", path: @font_path_alt ) %>

.<%= font_name %>-ic {
  <%= glyph_properties %>
}

<%= glyph_selectors.gsub(':before', '') %> {
  &:before {
    @extend .<%= font_name %>-ic;
  }
}

// var
<%=
@glyphs.inject([]) do |ret, p|
  name, value = p
  selector = @options[:css_selector].sub('{{glyph}}', name.to_s)
  content  = "\"\\#{value[:codepoint].to_s(16)}\""

  ret << "#{selector}-mixin { content: #{content} } ; "
  ret
end.map(&:strip).join("\n").strip
%>

// style
<%=
@glyphs.inject([]) do |ret, p|
  name, value = p
  selector = @options[:css_selector].sub('{{glyph}}', name.to_s)
  content  = "\"\\#{value[:codepoint].to_s(16)}\""

  ret << "#{selector} { &:before{ content: #{content} } }"
  ret
end.map(&:strip).join("\n").strip
%>

[magynhard]

According to #56 it is possible to keep the unicode for icons.

But I wonder where i can define these mappings of icons to unicode. Didn't find any example how to do it.

Can anyone help?