Skip to content

肖康 / cloudSystem

Go to a project
Commit 6515c08c by LJM
Options

加图标

parent 92a7d62e
Expand all
Inline Side-by-side
Showing with 45 additions and 8 deletions
src/assets/css/font/demo_index.html
...@@ -55,6 +55,12 @@ ...@@ -55,6 +55,12 @@
<ul class="icon_lists dib-box"> <ul class="icon_lists dib-box">
<li class="dib"> <li class="dib">
<span class="icon iconfont">&#xe609;</span>
<div class="name">数据统计</div>
<div class="code-name">&amp;#xe609;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe60a;</span> <span class="icon iconfont">&#xe60a;</span>
<div class="name">消息管理</div> <div class="name">消息管理</div>
<div class="code-name">&amp;#xe60a;</div> <div class="code-name">&amp;#xe60a;</div>
...@@ -210,9 +216,9 @@ ...@@ -210,9 +216,9 @@
<pre><code class="language-css" <pre><code class="language-css"
>@font-face { >@font-face {
font-family: 'iconfont'; font-family: 'iconfont';
src: url('iconfont.woff2?t=1665219700763') format('woff2'), src: url('iconfont.woff2?t=1677120594046') format('woff2'),
url('iconfont.woff?t=1665219700763') format('woff'), url('iconfont.woff?t=1677120594046') format('woff'),
url('iconfont.ttf?t=1665219700763') format('truetype'); url('iconfont.ttf?t=1677120594046') format('truetype');
} }
</code></pre> </code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
...@@ -239,6 +245,15 @@ ...@@ -239,6 +245,15 @@
<ul class="icon_lists dib-box"> <ul class="icon_lists dib-box">
<li class="dib"> <li class="dib">
<span class="icon iconfont iconshujutongji"></span>
<div class="name">
数据统计
</div>
<div class="code-name">.iconshujutongji
</div>
</li>
<li class="dib">
<span class="icon iconfont iconxiaoxiguanli1"></span> <span class="icon iconfont iconxiaoxiguanli1"></span>
<div class="name"> <div class="name">
消息管理 消息管理
...@@ -474,6 +489,14 @@ ...@@ -474,6 +489,14 @@
<li class="dib"> <li class="dib">
<svg class="icon svg-icon" aria-hidden="true"> <svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#iconshujutongji"></use>
</svg>
<div class="name">数据统计</div>
<div class="code-name">#iconshujutongji</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#iconxiaoxiguanli1"></use> <use xlink:href="#iconxiaoxiguanli1"></use>
</svg> </svg>
<div class="name">消息管理</div> <div class="name">消息管理</div>
......
src/assets/css/font/iconfont.css
@font-face { @font-face {
font-family: "iconfont"; /* Project id 2537242 */ font-family: "iconfont"; /* Project id 2537242 */
src: url('iconfont.woff2?t=1665219700763') format('woff2'), src: url('iconfont.woff2?t=1677120594046') format('woff2'),
url('iconfont.woff?t=1665219700763') format('woff'), url('iconfont.woff?t=1677120594046') format('woff'),
url('iconfont.ttf?t=1665219700763') format('truetype'); url('iconfont.ttf?t=1677120594046') format('truetype');
} }
.iconfont { .iconfont {
...@@ -13,6 +13,10 @@ ...@@ -13,6 +13,10 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.iconshujutongji:before {
content: "\e609";
}
.iconxiaoxiguanli1:before { .iconxiaoxiguanli1:before {
content: "\e60a"; content: "\e60a";
} }
......
src/assets/css/font/iconfont.json
...@@ -6,6 +6,13 @@ ...@@ -6,6 +6,13 @@
"description": "猎芯云芯系统前端", "description": "猎芯云芯系统前端",
"glyphs": [ "glyphs": [
{ {
"icon_id": "15187540",
"name": "数据统计",
"font_class": "shujutongji",
"unicode": "e609",
"unicode_decimal": 58889
},
{
"icon_id": "1111857", "icon_id": "1111857",
"name": "消息管理", "name": "消息管理",
"font_class": "xiaoxiguanli1", "font_class": "xiaoxiguanli1",
......
src/components/menu.vue
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
</el-submenu> </el-submenu>
<el-submenu index="6"> <el-submenu index="6">
<template slot="title"> <template slot="title">
<span class="icon iconfont iconxiaoxiguanli1"></span> <span class="icon iconfont iconshujutongji"></span>
<span slot="title">数据统计</span> <span slot="title">数据统计</span>
</template> </template>
<el-menu-item-group> <el-menu-item-group>
...@@ -151,9 +151,12 @@ ...@@ -151,9 +151,12 @@
<span class="icon iconfont icongoods"></span> <span class="icon iconfont icongoods"></span>
</div> </div>
<div class="item" :class="{'act':tabSure==6}"> <div class="item" :class="{'act':tabSure==6}">
<span class="icon iconfont iconxiaoxiguanli1"></span> <span class="icon iconfont iconshujutongji"></span>
</div> </div>
<div class="item" :class="{'act':tabSure==7}"> <div class="item" :class="{'act':tabSure==7}">
<span class="icon iconfont iconxiaoxiguanli1"></span>
</div>
<div class="item" :class="{'act':tabSure==8}">
<span class="icon iconfont iconuser"></span> <span class="icon iconfont iconuser"></span>
</div> </div>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment