diff --git a/examples/assets/iconfont/iconfont.css b/examples/assets/iconfont/iconfont.css
new file mode 100644
index 0000000..4fb1abf
--- /dev/null
+++ b/examples/assets/iconfont/iconfont.css
@@ -0,0 +1,49 @@
+@font-face {font-family: "iconfont";
+ src: url('iconfont.eot?t=1584011049763'); /* IE9 */
+ src: url('iconfont.eot?t=1584011049763#iefix') format('embedded-opentype'), /* IE6-IE8 */
+ url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAS4AAsAAAAACegAAARpAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCECgqFRIRfATYCJAMkCxQABCAFhG0HgRsbpggRlZyDyX4cOGfZYaXOtU6k6gWSrhwEz3863+6bkWxpFCAyBJhlBZCqHI3T4RJ1QCGqwhWC/2LRGLYDVgMEEITdnOZegBigLPi0i0+uOPKIh3yyfh0vw0WoALaA9eePJV9ZAuazb+eSlRQJeHxAB5a9zYvONrACmU8Ut8guYo9e9OMQwNCBPDJpyqwQDwdYJYBs37JpDV5Kj1NTKngIqZKDDvIOLp46qh4Db/s/LxUGiAcKVwNPmrdx8nrGlYfW9mubWJZrix3OCgjHQAN5wAH5rNT+ATqM59EY7e86bAaa0AiNKg8tHy4/q5yo/Fc9r9Zq+5ME+WYwSmhC/skDQaFxcEmRxgNJQRfXA2A3K/MOVmAjCJQPa1GM4hmNoKFyAsGByn8ILlQDhBRUawhpqO2vwwPAdxc2AZoBD0DKnDDJl+uLwjhTNQrxnTYZrV3AOO/Dd7LpVLDv+O3irWM37M1Q11ch9rlpcOyluMVXQcPjL6Deseco+yLYdO3Bk7vY1yFGSqUoeBMcfybFqGTfoW6qBLx509mUzLHH2G1bGm1b33BfoEwULipQb2UhNHpXGEn9VY1phDRmN4XZec2+42eKp499Z08ZqceuUyj7fFKfGFVvYkx9rQqcauyp42dEf2UqNhUXRWO3rVFGr15bWLMO94pD9VW0PgoXbCosOjW2zcJhCwfZG97eEp4OM4Vsl4Fdwm5NKW+Xpt3C2Ji1/Mfij3PXP/6rY37M/NkTg+V2+fj6hYV6/Mr0koNjVnSYFne81/vIiIXz/1tuV45vOHlR65V6yeZBP3UbQfLm1JnwlN/wSiduJ2XKcXz7dgyBMmMzPjEz9iriN5zltcUmuTz5JI6I2tqbHOpGrvn1Na9nHvilz0f5Xxb/ki+NG3f29NJkLI83Y9kdzKVNBrVslf8lP21i2yVLfiJJ3iRR1Ct+4XnOXMp8SahnM59v5FQMa9YEwalTSXJ95Eg679kzYgvY9WntB9QdLeksVQdJqUyepXHWkegZY9R1PodW2l/tdwi2Npy9quGo37xzB4Af3xmWYfxJSXGGSXgU0IIfS4Dsc3QRGPyp7dsNCPANTXwGBQwDfid3E3/DKpujoyC8lEAAJa09aJ5uGIeQB1dgEKR4xoKR83I80BTbJ/OBrC8KRCPfoDRwG7RGfjAO4RdcLfxDSqP2wYi6vzDQI3/2wAiCkxq3ymvKxjLJWVD6inYZgZMin/aJXH1I9U2XTb1gRh5iS13ZQcQow5TUM/U0jJFUYZpRS+NEyqJtTdkbNZrSzpmJGAICTZTRluJpJDPuaHGW+/5XyFqKANc01dg/IVb5yZVeo0NgXuQZ1XQp06sVayCEYZcZjCTKM21FkcSJUsrnzZAmGq5DtFhomWEGK2+mV6Z7PQYY8Cx+SrQ44kpK0uKJL4Zm15qWWUaIkDWuvftGlHMQAe0SZdxeagfZovNViLfHFhIWmM6iz7hGb51cR9IQLdQqIOd601HVjiieCWOefLbLsrMDAAA=') format('woff2'),
+ url('iconfont.woff?t=1584011049763') format('woff'),
+ url('iconfont.ttf?t=1584011049763') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+ url('iconfont.svg?t=1584011049763#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+ font-family: "iconfont" !important;
+ font-size: 16px;
+ font-style: normal;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-accountbalancewallet:before {
+ content: "\ea37";
+}
+
+.icon-attachmoney:before {
+ content: "\ea7d";
+}
+
+.icon-changehistory:before {
+ content: "\eacf";
+}
+
+.icon-gamepad:before {
+ content: "\eb8c";
+}
+
+.icon-lineweight:before {
+ content: "\ebfd";
+}
+
+.icon-localgasstation:before {
+ content: "\ec0b";
+}
+
+.icon-school:before {
+ content: "\eced";
+}
+
+.icon-trendingup:before {
+ content: "\ed74";
+}
+
diff --git a/examples/assets/iconfont/iconfont.eot b/examples/assets/iconfont/iconfont.eot
new file mode 100644
index 0000000..e098068
Binary files /dev/null and b/examples/assets/iconfont/iconfont.eot differ
diff --git a/examples/assets/iconfont/iconfont.js b/examples/assets/iconfont/iconfont.js
new file mode 100644
index 0000000..56c5ca6
--- /dev/null
+++ b/examples/assets/iconfont/iconfont.js
@@ -0,0 +1 @@
+!function(d){var t,a='',e=(t=document.getElementsByTagName("script"))[t.length-1].getAttribute("data-injectcss");if(e&&!d.__iconfont__svg__cssinject__){d.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(t){console&&console.log(t)}}!function(t){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(t,0);else{var e=function(){document.removeEventListener("DOMContentLoaded",e,!1),t()};document.addEventListener("DOMContentLoaded",e,!1)}else document.attachEvent&&(o=t,n=d.document,i=!1,(a=function(){try{n.documentElement.doScroll("left")}catch(t){return void setTimeout(a,50)}l()})(),n.onreadystatechange=function(){"complete"==n.readyState&&(n.onreadystatechange=null,l())});function l(){i||(i=!0,o())}var o,n,i,a}(function(){var t,e,l,o,n,i;(t=document.createElement("div")).innerHTML=a,a=null,(e=t.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",l=e,(o=document.body).firstChild?(n=l,(i=o.firstChild).parentNode.insertBefore(n,i)):o.appendChild(l))})}(window);
\ No newline at end of file
diff --git a/examples/assets/iconfont/iconfont.json b/examples/assets/iconfont/iconfont.json
new file mode 100644
index 0000000..67848d7
--- /dev/null
+++ b/examples/assets/iconfont/iconfont.json
@@ -0,0 +1,65 @@
+{
+ "id": "1687934",
+ "name": "ZeyiDriver",
+ "font_family": "iconfont",
+ "css_prefix_text": "icon-",
+ "description": "",
+ "glyphs": [
+ {
+ "icon_id": "489801",
+ "name": "account_balance_wallet",
+ "font_class": "accountbalancewallet",
+ "unicode": "ea37",
+ "unicode_decimal": 59959
+ },
+ {
+ "icon_id": "489878",
+ "name": "attach_money",
+ "font_class": "attachmoney",
+ "unicode": "ea7d",
+ "unicode_decimal": 60029
+ },
+ {
+ "icon_id": "489967",
+ "name": "change_history",
+ "font_class": "changehistory",
+ "unicode": "eacf",
+ "unicode_decimal": 60111
+ },
+ {
+ "icon_id": "490168",
+ "name": "gamepad",
+ "font_class": "gamepad",
+ "unicode": "eb8c",
+ "unicode_decimal": 60300
+ },
+ {
+ "icon_id": "490286",
+ "name": "line_weight",
+ "font_class": "lineweight",
+ "unicode": "ebfd",
+ "unicode_decimal": 60413
+ },
+ {
+ "icon_id": "490300",
+ "name": "local_gas_station",
+ "font_class": "localgasstation",
+ "unicode": "ec0b",
+ "unicode_decimal": 60427
+ },
+ {
+ "icon_id": "490590",
+ "name": "school",
+ "font_class": "school",
+ "unicode": "eced",
+ "unicode_decimal": 60653
+ },
+ {
+ "icon_id": "490748",
+ "name": "trending_up",
+ "font_class": "trendingup",
+ "unicode": "ed74",
+ "unicode_decimal": 60788
+ }
+ ]
+}
diff --git a/examples/assets/iconfont/iconfont.svg b/examples/assets/iconfont/iconfont.svg
new file mode 100644
index 0000000..3b207d2
--- /dev/null
+++ b/examples/assets/iconfont/iconfont.svg
@@ -0,0 +1,50 @@
+
+
+
+
diff --git a/examples/assets/iconfont/iconfont.ttf b/examples/assets/iconfont/iconfont.ttf
new file mode 100644
index 0000000..043207f
Binary files /dev/null and b/examples/assets/iconfont/iconfont.ttf differ
diff --git a/examples/assets/iconfont/iconfont.woff b/examples/assets/iconfont/iconfont.woff
new file mode 100644
index 0000000..017047d
Binary files /dev/null and b/examples/assets/iconfont/iconfont.woff differ
diff --git a/examples/assets/iconfont/iconfont.woff2 b/examples/assets/iconfont/iconfont.woff2
new file mode 100644
index 0000000..587f5f5
Binary files /dev/null and b/examples/assets/iconfont/iconfont.woff2 differ
diff --git a/examples/main.js b/examples/main.js
index 5197494..7c0fab5 100644
--- a/examples/main.js
+++ b/examples/main.js
@@ -8,6 +8,7 @@ import NProgress from 'nprogress';
import CodeSnippet from "@/components/code-snippet";
import '@/styles/index.scss';
import "@/styles/highlight.scss";
+import "@/assets/iconfont/iconfont.css";
// 进度条配置
NProgress.configure({ showSpinner: false });
diff --git a/examples/router/routes.js b/examples/router/routes.js
index c32858f..bbb580d 100644
--- a/examples/router/routes.js
+++ b/examples/router/routes.js
@@ -36,6 +36,12 @@ const _components = [
meta: { title: 'Cell 单元格' },
component: () => import('@/views/docs/component/cell.md'),
},
+ {
+ path: 'icon',
+ name: 'icon',
+ meta: { title: 'Icon 图标' },
+ component: () => import('@/views/docs/component/icon.md'),
+ },
]
},
{
diff --git a/examples/views/docs/component/icon.md b/examples/views/docs/component/icon.md
new file mode 100644
index 0000000..e13156b
--- /dev/null
+++ b/examples/views/docs/component/icon.md
@@ -0,0 +1,30 @@
+# Icon 图标
+
+基础图标
+
+## 基础用法
+
+图标说明
+
+::: snippet 示例
+
+```html
+
+
+
+
+
+
+
+
+
+```
+
+:::
\ No newline at end of file
diff --git a/packages/icon/index.css b/packages/icon/index.css
new file mode 100644
index 0000000..7bf3819
--- /dev/null
+++ b/packages/icon/index.css
@@ -0,0 +1,34 @@
+.zui-icon {
+ position: relative;
+ display: inline-block;
+ font: normal normal normal 14px/1 "iconfont";
+ font-size: inherit;
+ text-rendering: auto;
+ -webkit-font-smoothing: antialiased;
+}
+
+.zui-icon::before {
+ display: inline-block;
+}
+
+.zui-info {
+ position: absolute;
+ top: 0;
+ right: 0;
+ box-sizing: border-box;
+ min-width: 16px;
+ padding: 0 3px;
+ color: #fff;
+ font-weight: 500;
+ font-size: 12px;
+ font-family: PingFang SC, Helvetica Neue, Arial, sans-serif;
+ line-height: 14px;
+ text-align: center;
+ background-color: #ee0a24;
+ border: 1px solid #fff;
+ border-radius: 16px;
+ -webkit-transform: translate(50%, -50%);
+ transform: translate(50%, -50%);
+ -webkit-transform-origin: 100%;
+ transform-origin: 100%;
+}
\ No newline at end of file
diff --git a/packages/icon/index.vue b/packages/icon/index.vue
new file mode 100644
index 0000000..7187928
--- /dev/null
+++ b/packages/icon/index.vue
@@ -0,0 +1,51 @@
+
+
+ {{ info }}
+
+
+
+
+
+
\ No newline at end of file
--
libgit2 0.21.0