Mirrored_Repos/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-11-25 15:07:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #527 from filipesmedeiros/fix/perf-and-improvements

Browse Source 
fix: some perf and other improvements
This commit is contained in:
Kavin 2021-10-11 13:19:51 +01:00 committed by GitHub
commit 18f9cbe060
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/Menu.vue
View File

@ -1,6 +1,6 @@
<template>
<MenuDesktop :collapsed="collapsed" :toggleCollapsed="toggleCollapsed" v-if="!isMobile" />
<MenuMobile :collapsed="collapsed" :toggleCollapsed="toggleCollapsed" v-else />
<MenuDesktop :collapsed="collapsed" :toggleCollapsed="toggleCollapsedDebounced" v-if="!isMobile" />
<MenuMobile :collapsed="collapsed" :toggleCollapsed="toggleCollapsedDebounced" v-else />
</template>
<script>
@ -16,11 +16,25 @@ export default {
},
props: {
collapsed: Boolean,
toggleCollapse: Function,
toggleCollapsed: Function,
},
data() {
return { toggleCollapsedDisabled: false };
},
setup() {
const isMobile = useIsMobile();
return { isMobile };
},
methods: {
toggleCollapsedDebounced() {
if (!this.toggleCollapsedDisabled) {
this.toggleCollapsed();
this.toggleCollapsedDisabled = true;
setTimeout(() => {
this.toggleCollapsedDisabled = false;
}, 500);
}
},
},
};
</script>

4
src/components/MenuDesktop.vue
View File

@ -17,7 +17,7 @@
<div
class="uk-flex uk-flex-middle"
style="gap: 16px; transition: transform 300ms, gap 300ms;"
:style="collapseText ? 'transform: scale(0); gap: 0;' : 'transition-delay: 170ms'"
:style="collapseText ? 'transform: scale3d(0, 0, 0); gap: 0;' : 'transition-delay: 170ms'"
v-if="!hideText"
>
<img src="/img/pipedPlay.svg" :class="{ 'piped-play': !hideText }" />
@ -181,7 +181,7 @@ export default {
}
.sidebar-link span {
transition: font-size 400ms, padding 400ms;
transition: font-size 400ms;
}
.collapse-text .sidebar-link span {
font-size: 0;

2
src/components/TrendingPage.vue
View File

@ -33,7 +33,7 @@
v-if="!isMobile"
class="uk-flex uk-flex-middle"
style="gap: 16px; transition: transform 400ms; transform-origin: left;"
:style="!menuCollapsed ? 'transform: scale(0);' : {}"
:style="!menuCollapsed ? 'transform: scale3d(0, 0, 0);' : {}"
>
<img src="/img/pipedPlay.svg" style="height: 36px;" />
<img src="/img/piped.svg" />