This is a migrated thread and some comments may be shown as answers.

Icon documentation

3 Answers 164 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Adam Nelson
Top achievements
Rank 2
Adam Nelson asked on 30 Jan 2013, 12:48 AM
Hi Telerik,

I'm having a really hard time trying to figure out what icons are available in Kendo UI Mobile. I was able to get a list of class names by looking through the unminified stylesheet, but I noticed a lot of hex values were missing.

Attached is a screenshot I put together of a reference page, as you can see there are a lot of character codes without matching class names.

My question is can I create custom classes to enable the use of these unassigned character codes? Is there a chance of the font driving these images changing during an upgrade, or will new entries only be added to the font file?

Thanks,

Adam

3 Answers, 1 is accepted

Sort by
0
Accepted
Kamen Bundev
Telerik team
answered on 30 Jan 2013, 09:31 AM
Hello Adam,

You've got us. Actually the icons there were being prepared for the Kendo UI Web icon font transition. However we need to have more icons for the Web suite (probably one font for every skin), thus the mobile font will be left as it is. We will add classes for most of the additional icons and may add some new ones to the font, but we won't remove any for sure, so you can add the classes yourself and use them in your page/app*. You probably know how to do that, but I'll tell you anyway :)

As you may know, when you set data-icon="custom", Kendo UI Mobile creates an element inside the item/button and sets it two classes - .km-icon and .km-[your_icon_name], in this case .km-custom. .km-icon takes care of everything needed, you only need to define content with the Unicode character for .km-custom:before and .km-custom:after which show the actual icon and its shadow if such should be shown. Add this class to define a ladybug icon:
.km-ladybug:after,
.km-ladybug:before
{
    content: "\e0f8";
}


* Please note that the KendoUI icon font is part of the KendoUI suite. It is not permitted for use and/or distribution separately.

Kind regards,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Adam Nelson
Top achievements
Rank 2
answered on 30 Jan 2013, 04:49 PM
Very cool, thanks for the info.
0
Christopher Lee
Top achievements
Rank 1
answered on 07 Feb 2013, 06:44 PM
This is a HUGE help.  Thanks Adam!
Tags
General Discussions
Asked by
Adam Nelson
Top achievements
Rank 2
Answers by
Kamen Bundev
Telerik team
Adam Nelson
Top achievements
Rank 2
Christopher Lee
Top achievements
Rank 1
Share this question
or