2018-02-10 21:06:22 +08:00
|
|
|
<template>
|
2018-06-10 08:39:06 +08:00
|
|
|
<d2-container type="ghost">
|
2018-06-09 22:39:05 +08:00
|
|
|
<el-card class="d2-mb">
|
2018-06-10 16:30:02 +08:00
|
|
|
<PageHeader slot="header" title="图标组件"></PageHeader>
|
2018-06-10 09:21:26 +08:00
|
|
|
<d2-icon/>
|
|
|
|
|
<d2-icon name="github"/>
|
|
|
|
|
<d2-icon name="github" style="font-size: 100px;"/>
|
|
|
|
|
<d2-icon name="github" class="icon-class-demo"/>
|
2018-02-10 21:06:22 +08:00
|
|
|
</el-card>
|
|
|
|
|
<el-card>
|
2018-06-10 09:14:10 +08:00
|
|
|
<d2-markdown url="/static/md/组件 - 图标组件.md"/>
|
2018-02-10 21:06:22 +08:00
|
|
|
</el-card>
|
2018-06-10 08:39:06 +08:00
|
|
|
</d2-container>
|
2018-02-10 21:06:22 +08:00
|
|
|
</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>
|
