no message
Former-commit-id: 4a1af7085d5d219fa49cb3bcde32bef16f5d69d6 Former-commit-id: 6fd5799f007bc736fcd20354835e908464f52355 Former-commit-id: fb88a361b3f8a5a05e6863fc34809753b6e560ee
This commit is contained in:
27
src/pages/demo/components/icon/icon.vue
Normal file
27
src/pages/demo/components/icon/icon.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<Container type="ghost">
|
||||
<el-card class="dd-mb">
|
||||
<Icon></Icon>
|
||||
<Icon name="github"></Icon>
|
||||
<Icon name="github" style="font-size: 100px;"></Icon>
|
||||
<Icon name="github" class="icon-class-demo"></Icon>
|
||||
</el-card>
|
||||
<el-card>
|
||||
<Markdown url="/static/markdownFiles/article/组件 - 图标组件.md"></Markdown>
|
||||
</el-card>
|
||||
</Container>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.icon-class-demo {
|
||||
transition: all .3s;
|
||||
font-size: 100px;
|
||||
color: #409EFF;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
&:hover{
|
||||
color: #F56C6C;
|
||||
transform: scale(1.2) rotate(30deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,37 +0,0 @@
|
||||
<template>
|
||||
<Container>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<div>
|
||||
<Icon></Icon>
|
||||
</div>
|
||||
<div>
|
||||
<Icon name="github"></Icon>
|
||||
</div>
|
||||
<div>
|
||||
<Icon name="github" style="font-size: 100px;"></Icon>
|
||||
</div>
|
||||
<div>
|
||||
<Icon name="github" class="icon-class-demo"></Icon>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<Markdown url="/static/markdownFiles/article/组件 - 图标组件.md"></Markdown>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</Container>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.icon-class-demo {
|
||||
transition: all .3s;
|
||||
font-size: 100px;
|
||||
color: #409EFF;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
&:hover{
|
||||
color: #F56C6C;
|
||||
transform: scale(1.2) rotate(30deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -17,14 +17,24 @@ export const menu = {
|
||||
icon: 'font-awesome',
|
||||
children: [
|
||||
{
|
||||
title: '演示',
|
||||
title: '图标组件',
|
||||
icon: 'file-o',
|
||||
path: 'data/icon',
|
||||
name: 'demo-components-icon',
|
||||
path: 'data/icon/icon',
|
||||
name: 'demo-components-icon-icon',
|
||||
meta: {
|
||||
requiresAuth: true
|
||||
},
|
||||
component: resolve => { require(['@/pages/demo/components/icon/index.vue'], resolve) }
|
||||
component: resolve => { require(['@/pages/demo/components/icon/icon.vue'], resolve) }
|
||||
},
|
||||
{
|
||||
title: '图标选择器',
|
||||
icon: 'file-o',
|
||||
path: 'data/icon/select',
|
||||
name: 'demo-components-icon-select',
|
||||
meta: {
|
||||
requiresAuth: true
|
||||
},
|
||||
component: resolve => { require(['@/pages/demo/components/icon/select.vue'], resolve) }
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// [插件] 菜单
|
||||
export const menu = {
|
||||
title: '功能',
|
||||
title: '插件',
|
||||
path: '/demo/plugins',
|
||||
name: 'demo-plugins',
|
||||
meta: {
|
||||
@@ -96,16 +96,6 @@ export const menu = {
|
||||
requiresAuth: true
|
||||
},
|
||||
component: resolve => { require(['@/pages/demo/plugins/font-awesome/list.vue'], resolve) }
|
||||
},
|
||||
{
|
||||
title: '图标选择器',
|
||||
icon: 'file-o',
|
||||
path: 'font-awesome/select',
|
||||
name: 'demo-font-awesome-select',
|
||||
meta: {
|
||||
requiresAuth: true
|
||||
},
|
||||
component: resolve => { require(['@/pages/demo/plugins/font-awesome/select.vue'], resolve) }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user