github/PPTist
1
0
Fork 0
mirror of https://github.com/pipipi-pikachu/PPTist.git synced 2025-04-15 02:20:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化UI

Browse Source
This commit is contained in:
pipipi-pikachu 2021-06-21 21:32:38 +08:00
parent 2ad8108175
commit 260893d209
1 changed files with 8 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/views/Editor/Toolbar/ElementStylePanel/ImageStylePanel.vue
View File

@ -10,7 +10,7 @@
<Popover trigger="click" v-model:visible="clipPanelVisible"> <Popover trigger="click" v-model:visible="clipPanelVisible">
<template #content> <template #content>
<div class="clip"> <div class="clip">
<div class="title">按形状裁剪：</div> <div class="title">按形状：</div>
<div class="shape-clip"> <div class="shape-clip">
<div <div
class="shape-clip-item" class="shape-clip-item"
@ -18,12 +18,12 @@
:key="key" :key="key"
@click="presetImageClip(key)" @click="presetImageClip(key)"
> >
<div class="shape" :style="{ backgroundImage: `url(${handleElement.src})`, clipPath: item.style }"></div> <div class="shape" :style="{ clipPath: item.style }"></div>
</div> </div>
</div> </div>
<template v-for="type in ratioClipOptions" :key="type.label"> <template v-for="type in ratioClipOptions" :key="type.label">
<div class="title" v-if="type.label">{{type.label}}：</div> <div class="title" v-if="type.label">按{{type.label}}：</div>
<ButtonGroup class="row"> <ButtonGroup class="row">
<Button <Button
style="flex: 1;" style="flex: 1;"
@ -398,12 +398,14 @@ export default defineComponent({
@include flex-grid-layout-children(5, 16%); @include flex-grid-layout-children(5, 16%);
&:hover .shape {
background-color: #ccc;
}
.shape { .shape {
width: 40px; width: 40px;
height: 40px; height: 40px;
background-position: center; background-color: #e1e1e1;
background-repeat: no-repeat;
background-size: cover;
} }
} }
</style> </style>