Kendo UI內建圖示清單

Kendo UI內建了一組圖示,若網頁已參照kendo.common.min.css以及kendo.default.min.css(或其他主題),只需加入SPAN元素並指定k-icon及k-i-*樣式,就可在網頁插入Kendo UI圖示,例如:
<span class="k-icon k-i-calendar"></span>

沒有在Kendo UI網站找到像Bootstrap一樣的圖示清單,便決定自己做一張,有需要的朋友請自行參考:

這裡有JSBin線上版(不同主題配合的圖示不同,可修改kendo.*.min.css檢視結果),以下則是產生清單HTML的小程式:

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Text;
using System.Text.RegularExpressions;
 
namespace ShowKendoIcons
{
    class Program
    {
        static void Main(string[] args)
        {
            string css = File.ReadAllText("d:\\kendo.common.min.css");
            List<string> list = new List<string>();
            foreach (Match m in Regex.Matches(css, "[.]k-i-[a-z-]+"))
            {
                string c = m.Value;
                if (list.Contains(c)) continue;
                list.Add(c);
            }
            StringBuilder sb = new StringBuilder();
            foreach (string s in list.OrderBy(o => o))
            {
                sb.AppendFormat(
"<div><span class='t'>{0}</span><span class='i k-icon {1}'></span></div>\n",
                    s, s.TrimStart('.'));
            }
            File.WriteAllText("d:\\kendo.html", sb.ToString());
        }
    }
}
歡迎推文分享:
Published 16 July 2013 08:36 PM 由 Jeffrey
Filed under:
Views: 10,115



意見

沒有意見

你的看法呢?

(必要的) 
(必要的) 
(選擇性的)
(必要的) 
(提醒: 因快取機制,您的留言幾分鐘後才會顯示在網站,請耐心稍候)

5 + 3 =

搜尋

Go

<July 2013>
SunMonTueWedThuFriSat
30123456
78910111213
14151617181920
21222324252627
28293031123
45678910
 
RSS
創用 CC 授權條款
【廣告】
twMVC

Tags 分類檢視
關於作者

一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

文章典藏
其他功能

這個部落格


Syndication