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 2024-01-16 20:28:45 +08:00
parent 0d0e729944
commit 4e8832f263
5 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/views/Editor/CanvasTool/index.vue
View File

@ -76,6 +76,7 @@
:key="item" :key="item"
@click="applyCanvasPresetScale(item)" @click="applyCanvasPresetScale(item)"
>{{item}}%</PopoverMenuItem> >{{item}}%</PopoverMenuItem>
<PopoverMenuItem center @click="resetCanvas()">适应屏幕</PopoverMenuItem>
</template> </template>
<span class="text">{{canvasScalePercentage}}</span> <span class="text">{{canvasScalePercentage}}</span>
</Popover> </Popover>
@ -131,7 +132,7 @@ const {
canvasScalePercentage, canvasScalePercentage,
} = useScaleCanvas() } = useScaleCanvas()
const canvasScalePresetList = [200, 150, 100, 80, 50] const canvasScalePresetList = [200, 150, 125, 100, 75, 50]
const canvasScaleVisible = ref(false) const canvasScaleVisible = ref(false)
const applyCanvasPresetScale = (value: number) => { const applyCanvasPresetScale = (value: number) => {

3
src/views/Editor/Thumbnails/LayoutPool.vue
View File

@ -48,7 +48,8 @@ const selectSlideTemplate = (slide: Slide) => {
} }
.thumbnail { .thumbnail {
outline: 1px solid $borderColor; outline: 2px solid $borderColor;
transition: outline $transitionDelay;
cursor: pointer; cursor: pointer;
&:hover { &:hover {

6
src/views/Editor/Toolbar/SlideDesignPanel.vue
View File

@ -491,7 +491,7 @@ const updateViewportRatio = (value: number) => {
} }
&:hover .btns { &:hover .btns {
display: flex; opacity: 1;
} }
.btns { .btns {
@ -500,8 +500,10 @@ const updateViewportRatio = (value: number) => {
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
display: none; display: flex;
background-color: rgba($color: #000, $alpha: .25); background-color: rgba($color: #000, $alpha: .25);
opacity: 0;
transition: opacity $transitionDelay;
} }
.btn { .btn {
width: 72px; width: 72px;

2
src/views/components/element/AudioElement/AudioPlayer.vue
View File

@ -401,7 +401,7 @@ defineExpose({
} }
.icon-content { .icon-content {
transition: all 0.2s ease-in-out; transition: all .2s ease-in-out;
opacity: 0.8; opacity: 0.8;
color: #fff; color: #fff;
} }

2
src/views/components/element/VideoElement/VideoPlayer/index.vue
View File

@ -517,7 +517,7 @@ useMSE(props.src, videoRef)
} }
.icon-content { .icon-content {
transition: all 0.2s ease-in-out; transition: all .2s ease-in-out;
opacity: 0.8; opacity: 0.8;
color: #fff; color: #fff;
} }