给Mist主题的图标包瘦身
Mist主题瘦身计划之精简图标包。全套fontawesome字体几乎占到了整个主页流量的一半,对于够用党加强迫症来说完全不能忍。哼。但是很可惜,定制化的fontawesome是收费的,所以下面就自食其力。
从iconmoon上定制图标
打开iconmoon app,从各种图标集中选择自己需要的,当然,fontawesome也是包括的。点击generate font,首先修改图标的名字(最好跟Mist主题内的一致),然后点击preferences,修改Class Prefix为fa-
,选中use i
。最后下载制作好的图标文件。
从fontawesome下载样式
注册免费版之后,随便选择几个图标完成制作,从emmbed code中打开js代码,顺藤摸瓜找出css文件的真实地址,类似于
https://fonticons-free-fonticons.netdna-ssl.com/kits/XXXXX/XXXXX.css
这个样式文件主要分为三部分:
- woff文件的base64代码
- 字符的各种效果,以
fa-
开头的 - 字符定义
整合到Mist
打开base64 encoder把刚刚下载的woff文件转换成base64字符码,替换到样式文件的第一部分,注意把font-family统一了。把第一步下载的css文件里字符定义文件替换到第三部分。做完这些再把修改好的完整CSS替换到\source\vendors\font-awesome\css\font-awesome.min.css
。
测试
到这里就大功告成啦,enjoy。