Customize File Type Icons

3 posts, 0 answers
  1. Ashleigh L
    Ashleigh L avatar
    113 posts
    Member since:
    Jun 2012

    Posted 12 Nov 2015 Link to this post

    Related to my other thread (http://www.telerik.com/forums/restrict-allowed-file-types), we're going to be restricting the allowable file types, but we also allow some semi-odd ones, such as .ai, .psd, .indd, .idml. We've already got icons of our own to represent these file types, so I'm hoping we can customize the uploader to display them.

    I have this code snippet from one of the upload examples:

    function addExtensionClass(extension) {        
        switch (extension) {
            case '.jpg':
            case '.img':
            case '.png':
            case '.gif':
                return "img-file";
            case '.doc':
            case '.docx':
                return "doc-file";
            case '.xls':
            case '.xlsx':
                return "xls-file";
            case '.pdf':
                return "pdf-file";
            case '.zip':
            case '.rar':
                return "zip-file";
            default:
                return "default-file";
        }
    }

     Two things: where do these icons come from, and how can I check which ones are available? Secondly, can I replace these with my own icons (we use FontAwesome), which are set up like this:

    <i class="fa-icon-check"></i>

  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2153 posts

    Posted 13 Nov 2015 Link to this post

    Hello shimmoril,

    These icons are only part of the example, not built in Kendo UI. You could use any custom icons in the files templates.

    Regards,
    Dimiter Madjarov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Ashleigh L
    Ashleigh L avatar
    113 posts
    Member since:
    Jun 2012

    Posted 16 Nov 2015 in reply to Dimiter Madjarov Link to this post

    Thanks.
Back to Top