JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-09-09 00:30:04 +08:00
Code Issues Projects Releases Wiki Activity

style(editor): icon组件图标样式调整

Browse Source
This commit is contained in:
roymondchen 2022-09-08 12:43:23 +08:00 committed by jia000
parent 3e024d21ed
commit c2cd1c40cf
5 changed files with 17 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/editor/src/components/Icon.vue
View File

@ -1,8 +1,10 @@
<template>
<el-icon v-if="!icon"><Edit></Edit></el-icon>
<el-icon v-else-if="typeof icon === 'string' && icon.startsWith('http')"><img :src="icon" /></el-icon>
<i v-else-if="typeof icon === 'string'" :class="icon"></i>
<el-icon v-else><component :is="toRaw(icon)"></component></el-icon>
<el-icon v-if="!icon" class="magic-editor-icon"><Edit></Edit></el-icon>
<el-icon v-else-if="typeof icon === 'string' && icon.startsWith('http')" class="magic-editor-icon"
><img :src="icon"
/></el-icon>
<i v-else-if="typeof icon === 'string'" class="magic-editor-icon" :class="icon"></i>
<el-icon v-else class="magic-editor-icon"><component :is="toRaw(icon)"></component></el-icon>
</template>
<script lang="ts" setup>

5
packages/editor/src/theme/component-list-panel.scss
View File

@ -86,11 +86,6 @@
}
}
img {
max-width: 100%;
max-height: 100%;
}
span {
font-size: 12px;
text-align: center;

4
packages/editor/src/theme/content-menu.scss
View File

@ -31,6 +31,10 @@
color: $--font-color;
}
.magic-editor-icon {
margin-right: 5px;
}
&.divider {
padding: 0 14px;

6
packages/editor/src/theme/icon.scss Normal file
View File

@ -0,0 +1,6 @@
.magic-editor-icon {
img {
max-width: 100%;
max-height: 100%;
}
}

1
packages/editor/src/theme/index.scss
View File

@ -11,3 +11,4 @@
@import "./content-menu.scss";
@import "./stage.scss";
@import "./code-editor.scss";
@import "./icon.scss";