Icons in ST 2.2 beta not working

[dbarton]

Hi


First of all, why is SASS in ST2.2 still not working out of the box?
Could you not add a working SASS file so that we no longer need to fix it by hand?


REQUIRED INFORMATION




Ext version tested:

• ST 2.2 beta

Browser versions tested against:

• Chrome 25.0.1364.172

Description:

• Additional SASS Pictos will not be rendered correct in tab bar.

Steps to reproduce the problem:

• Add pictos to SASS file.

The result that was expected:

• Correctly rendered icon in tab bar.

The result that occurs instead:

• Rendering of icon is messed up.

Test Case:


SASS:

@include pictos-iconmask('cube');

View:

        iconCls: 'home',

HELPFUL INFORMATION




Screenshot or Video:

• http://cl.ly/image/0F3O143N1Q1R

Debugging already done:

• none

Possible fix:

• not provided

Additional CSS used:

• only default ext-all.css

[chirgwin]

This seems to be what happens when a particular icon codepoint alias is not found. Either a meaningful error at compile time, or a warning and a rendered empty icon would be helpful.

"cube" is not present. The available mappings-- e.g. "box" maps to "b" character in pictos font-- can be found in resources/themes/stylesheets/sencha-touch/base/mixins/_icon.scss

[zacjordaan]

Hi

I have the exact same problem. Been banging my head against it for several days now and have finally given up and resorted to coding icons in a static css class in my index.html (ouch):

.iconCalc {

background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhE...')!important;

background-size: 100% !important;

}

Anybody have a better workaround that could get sass to compile with additional icons included I'd love to hear about it.

Zac

[EPV]

Looks like it doesn't work in 2.2 RC either ...

[interfasys]

From the 2.2 documentation, use http://icomoon.io to create your icon fonts. pictos-iconmask has been binned.

[Ohmz]

Unfortunately even after creating a custom font there is still an issue using the icon mixin. Per the documentation you referenced you can either supply the icon mixin with two or three arguments, specifically three if you need to specify the iconCls name, icon character content, and font-family. However when compiling SASS you get an error that you cannot supply three arguments, and inspecting the mixin source supports this. Therefore it seems the only way to use custom font-family for icons is to modify the mixin source directly and change the name to character list. Since we all probably want to avoid modifying this source hopefully there is a fix in place for the final release of ST2.2 that allows you to specify all three arguments.

[interfasys]

I think you should file this a separate request. It won't be fixed for the final release tomorrow, but hopefully a solution will be provided shortly.