Merge pull request #530 from filipesmedeiros/feat/no-animation
feat: no animations
This commit is contained in:
Kavin
GitHub
commit
3f67964ef8
|
|
@ -13,15 +13,15 @@
|
|||
"@fortawesome/free-solid-svg-icons": "^5.15.4",
|
||||
"@fortawesome/vue-fontawesome": "^3.0.0-4",
|
||||
"core-js": "3.18.2",
|
||||
"css-loader": "^6.3.0",
|
||||
"css-loader": "^6.4.0",
|
||||
"dompurify": "^2.3.3",
|
||||
"hotkeys-js": "^3.8.7",
|
||||
"javascript-time-ago": "^2.3.9",
|
||||
"mux.js": "^5.14.0",
|
||||
"register-service-worker": "^1.7.1",
|
||||
"shaka-player": "3.2.0",
|
||||
"uikit": "3.7.5",
|
||||
"vue": "^3.2.19",
|
||||
"uikit": "3.7.6",
|
||||
"vue": "^3.2.20",
|
||||
"vue-i18n": "^9.1.9",
|
||||
"vue-router": "^4.0.11",
|
||||
"xml-js": "^1.6.11"
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
"@vue/cli-plugin-eslint": "^4.5.13",
|
||||
"@vue/cli-plugin-pwa": "^4.5.13",
|
||||
"@vue/cli-service": "^4.5.13",
|
||||
"@vue/compiler-sfc": "3.2.19",
|
||||
"@vue/compiler-sfc": "3.2.20",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-prettier": "^8.3.0",
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong
|
||||
<strong style="color: #fff"
|
||||
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript
|
||||
enabled. Please enable it to continue.</strong
|
||||
>
|
||||
|
|
|
|||
20
src/App.vue
20
src/App.vue
|
|
@ -1,19 +1,20 @@
|
|||
<template>
|
||||
<div class="uk-flex">
|
||||
<Menu
|
||||
style="flexShrink: 0"
|
||||
:collapsed="menuCollapsed"
|
||||
:toggleCollapsed="() => (menuCollapsed = !menuCollapsed)"
|
||||
/>
|
||||
<Menu style="flexShrink: 0" />
|
||||
<main
|
||||
class="uk-container uk-container-expand"
|
||||
style="height: 100vh; overflow: scroll; flex: 1;"
|
||||
:style="{ background: backgroundColor, colour: foregroundColor, marginTop: isMobile ? '70px' : 0 }"
|
||||
style="overflow-y: scroll; overflow-x: hidden; flex: 1;"
|
||||
:style="{
|
||||
background: backgroundColor,
|
||||
colour: foregroundColor,
|
||||
marginTop: isMobile ? '70px' : 0,
|
||||
height: isMobile ? 'calc(100vh - 70px)' : '100vh',
|
||||
}"
|
||||
:class="{ 'uk-light': darkMode }"
|
||||
>
|
||||
<router-view v-slot="{ Component }">
|
||||
<keep-alive :max="5">
|
||||
<component :is="Component" :key="$route.fullPath" :menuCollapsed="menuCollapsed" />
|
||||
<component :is="Component" :key="$route.fullPath" />
|
||||
</keep-alive>
|
||||
</router-view>
|
||||
|
||||
|
|
@ -44,9 +45,6 @@ export default {
|
|||
const isMobile = useIsMobile();
|
||||
return { isMobile };
|
||||
},
|
||||
data() {
|
||||
return { menuCollapsed: false };
|
||||
},
|
||||
mounted() {
|
||||
if (window.location.pathname === "/" || window.location.pathname.length == 0)
|
||||
switch (this.getPreferenceString("homepage", "trending")) {
|
||||
|
|
|
|||
|
|
@ -1,26 +1,44 @@
|
|||
<template>
|
||||
<div
|
||||
id="menu-desktop"
|
||||
class="uk-height-viewport uk-flex uk-flex-column uk-flex-middle"
|
||||
:class="{ 'collapse-text': collapseText }"
|
||||
style="transition: width 400ms; padding: 32px 24px; height: 100vh;"
|
||||
:style="{ width: collapsed ? '78px' : '291px', backgroundColor: secondaryBackgroundColor }"
|
||||
:class="{ 'collapse-text': collapseText, 'enable-animations': enableAnimations }"
|
||||
style="padding: 32px 24px; height: 100vh;"
|
||||
:style="{
|
||||
width: collapsed ? '78px' : '291px',
|
||||
backgroundColor: secondaryBackgroundColor,
|
||||
transition: enableAnimations ? 'width 400ms' : 'none',
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="uk-width-1-1 uk-flex uk-flex-middle uk-flex-between"
|
||||
style="margin-bottom: 100px; height: 50px; transition: padding 400ms; padding: 0 14px;"
|
||||
:style="collapseText ? 'padding: 0;' : {}"
|
||||
style="margin-bottom: 100px; height: 50px;"
|
||||
:style="{
|
||||
padding: collapseText ? '0' : '0 26px 0 14px',
|
||||
transition: enableAnimations ? 'padding 400ms;' : '',
|
||||
}"
|
||||
:class="{ 'uk-flex uk-flex-center': collapsed }"
|
||||
>
|
||||
<div style="transition: padding 400ms; flex: 1 0 30px;" :style="collapseText ? 'padding: 0 8px;' : {}">
|
||||
<div
|
||||
style="flex: 1 0 30px;"
|
||||
:style="{ padding: collapseText ? '0 8px' : '', transition: enableAnimations ? 'padding 400ms;' : '' }"
|
||||
>
|
||||
<font-awesome-icon class="button highlight" @click="toggleCollapsed()" icon="bars" />
|
||||
</div>
|
||||
<div
|
||||
class="uk-flex uk-flex-middle"
|
||||
style="gap: 16px; transition: transform 300ms, gap 300ms;"
|
||||
:style="collapseText ? 'transform: scale3d(0, 0, 0); gap: 0;' : 'transition-delay: 170ms'"
|
||||
:style="{
|
||||
transform: collapseText ? 'scale3d(0, 0, 0)' : 'none',
|
||||
gap: collapseText ? '0' : '16px',
|
||||
transitionDelay: !collapseText && enableAnimations ? '170ms' : 'none',
|
||||
transition: enableAnimations ? 'transform 300ms, gap 300ms' : 'none',
|
||||
}"
|
||||
v-if="!hideText"
|
||||
>
|
||||
<img src="/img/pipedPlay.svg" :class="{ 'piped-play': !hideText }" />
|
||||
<img
|
||||
src="/img/pipedPlay.svg"
|
||||
:class="{ 'piped-play': !hideText, 'enable-animations': enableAnimations }"
|
||||
/>
|
||||
|
||||
<img src="/img/piped.svg" />
|
||||
</div>
|
||||
|
|
@ -66,15 +84,17 @@
|
|||
class="highlight logout-button button sidebar-link uk-width-1-1 uk-flex uk-flex-center uk-flex-middle"
|
||||
:style="{ backgroundColor: backgroundColor }"
|
||||
style="border-radius: 9999px; border: none; margin-top: 20px;"
|
||||
@click="logout"
|
||||
@click="logout()"
|
||||
>
|
||||
<span v-if="!hideText">Log out</span>
|
||||
<span v-if="!hideText" v-t="'actions.logout'" />
|
||||
<font-awesome-icon icon="sign-out-alt" />
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useMenuCollapsed } from "../store";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -82,28 +102,38 @@ export default {
|
|||
hideText: this.collapsed,
|
||||
};
|
||||
},
|
||||
props: {
|
||||
collapsed: Boolean,
|
||||
toggleCollapsed: Function,
|
||||
setup() {
|
||||
const { menuCollapsed, toggleCollapsed } = useMenuCollapsed();
|
||||
return { collapsed: menuCollapsed, toggleCollapsed };
|
||||
},
|
||||
watch: {
|
||||
collapsed(_collapsed) {
|
||||
if (this.enableAnimations) {
|
||||
if (_collapsed) {
|
||||
this.collapseText = true;
|
||||
setTimeout(() => {
|
||||
this.hideText = true;
|
||||
}, 450);
|
||||
} else {
|
||||
this.hideText = false;
|
||||
setTimeout(() => {
|
||||
this.collapseText = false;
|
||||
}, 0);
|
||||
}
|
||||
} else {
|
||||
this.hideText = _collapsed;
|
||||
this.collapseText = _collapsed;
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
alert("logging out");
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
collapsed(collapsed) {
|
||||
if (collapsed) {
|
||||
this.collapseText = true;
|
||||
setTimeout(() => {
|
||||
this.hideText = true;
|
||||
}, 450);
|
||||
} else {
|
||||
this.hideText = false;
|
||||
setTimeout(() => {
|
||||
this.collapseText = false;
|
||||
}, 0);
|
||||
}
|
||||
computed: {
|
||||
enableAnimations(_this) {
|
||||
return !_this.getPreferenceBoolean("disableAnimations", false);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
@ -146,52 +176,54 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.piped-play {
|
||||
#menu-desktop.enable-animations .piped-play {
|
||||
animation: bump 300ms ease-in-out;
|
||||
animation-delay: 700ms !important;
|
||||
}
|
||||
@media (prefers-reduced-motion) {
|
||||
.piped-play {
|
||||
#menu-desktop .piped-play {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
.logout-button {
|
||||
#menu-desktop .logout-button {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
#menu-desktop .button:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
#menu-desktop .highlight {
|
||||
color: #abb2c6;
|
||||
}
|
||||
|
||||
.sidebar-link {
|
||||
#menu-desktop .sidebar-link {
|
||||
gap: 14px !important;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
#menu-desktop.enable-animations .sidebar-link {
|
||||
transition: padding 400ms, gap 400ms;
|
||||
}
|
||||
|
||||
.collapse-text .sidebar-link {
|
||||
#menu-desktop.collapse-text .sidebar-link {
|
||||
padding: 6px;
|
||||
gap: 0px !important;
|
||||
}
|
||||
|
||||
.sidebar-link span {
|
||||
#menu-desktop.enable-animations .sidebar-link span {
|
||||
transition: font-size 400ms;
|
||||
}
|
||||
.collapse-text .sidebar-link span {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.highlight:hover,
|
||||
.router-link-active {
|
||||
#menu-desktop .highlight:hover,
|
||||
#menu-desktop .router-link-active {
|
||||
color: #fff;
|
||||
}
|
||||
.router-link-active {
|
||||
#menu-desktop .router-link-active {
|
||||
background: linear-gradient(to right, #da22ff, #9733ee);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,22 @@
|
|||
<template>
|
||||
<div
|
||||
id="menu-mobile"
|
||||
class="uk-flex uk-flex-column uk-flex-middle uk-position-fixed uk-position-top"
|
||||
:class="{ 'uk-height-viewport': !collapsed }"
|
||||
style="padding: 24px 12px; width: 100vw; box-sizing: border-box; z-index: 9999; transition: min-height 40ms, height 400ms; overflow: hidden;"
|
||||
:style="{ backgroundColor: secondaryBackgroundColor, minHeight: 0, height: !collapsed ? '70px' : '100vh' }"
|
||||
:class="{ 'uk-height-viewport': !collapsed, 'enable-animations': enableAnimations }"
|
||||
style="padding: 24px 12px; width: 100vw; box-sizing: border-box; z-index: 9999; overflow: hidden;"
|
||||
:style="{
|
||||
backgroundColor: secondaryBackgroundColor,
|
||||
minHeight: 0,
|
||||
height: !collapsed ? '70px' : '100vh',
|
||||
transition: enableAnimations ? 'min-height 40ms, height 400ms' : 'none',
|
||||
}"
|
||||
>
|
||||
<div class="uk-width-1-1 uk-flex uk-flex-middle" style="margin-bottom: 100px; padding: 0 14px; gap: 32px;">
|
||||
<div
|
||||
style="transition: padding 500ms, transform 500ms;"
|
||||
:style="collapsed ? 'transform: rotate(90deg)' : {}"
|
||||
:style="{
|
||||
transform: collapsed ? 'rotate(90deg)' : 'none',
|
||||
transition: enableAnimations ? 'padding 500ms, transform 500ms' : 'none',
|
||||
}"
|
||||
>
|
||||
<font-awesome-icon class="button highlight" @click="toggleCollapsed()" icon="bars" />
|
||||
</div>
|
||||
|
|
@ -56,37 +64,32 @@
|
|||
class="highlight logout-button button sidebar-link uk-width-1-1 uk-flex uk-flex-center uk-flex-middle"
|
||||
:style="{ backgroundColor: backgroundColor }"
|
||||
style="border-radius: 9999px; border: none; margin-top: 20px;"
|
||||
@click="logout"
|
||||
@click="logout()"
|
||||
>
|
||||
<span v-t="'actions.logout'">Log out</span>
|
||||
<span v-t="'actions.logout'" />
|
||||
<font-awesome-icon icon="sign-out-alt" />
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
collapseText: false,
|
||||
hideText: false,
|
||||
};
|
||||
},
|
||||
props: {
|
||||
collapsed: Boolean,
|
||||
toggleCollapsed: Function,
|
||||
import { useMenuCollapsed } from "../store";
|
||||
|
||||
searchText: String,
|
||||
onKeyUp: Function,
|
||||
onInputFocus: Function,
|
||||
onInputBlur: Function,
|
||||
onSearchTextChange: Function,
|
||||
export default {
|
||||
setup() {
|
||||
const { menuCollapsed, toggleCollapsed } = useMenuCollapsed();
|
||||
return { collapsed: menuCollapsed, toggleCollapsed };
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
alert("logging out");
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
enableAnimations(_this) {
|
||||
return !_this.getPreferenceBoolean("disableAnimations", false);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -127,46 +130,48 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.piped-play {
|
||||
#menu-mobile.enable-animations .piped-play {
|
||||
animation: bump 300ms ease-in-out 500ms;
|
||||
}
|
||||
@media (prefers-reduced-motion) {
|
||||
.piped-play {
|
||||
#menu-mobile .piped-play {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
.logout-button {
|
||||
#menu-mobile .logout-button {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
#menu-mobile .button:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
#menu-mobile .highlight {
|
||||
color: #abb2c6;
|
||||
}
|
||||
|
||||
.sidebar-link {
|
||||
#menu-mobile .sidebar-link {
|
||||
gap: 14px !important;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
transition: padding 500ms, gap 500ms;
|
||||
}
|
||||
#menu-mobile.enable-animations .sidebar-link {
|
||||
transition: padding 400ms, gap 400ms;
|
||||
}
|
||||
|
||||
.sidebar-link span {
|
||||
#menu-mobile.enable-animations .sidebar-link span {
|
||||
transition: font-size 500ms, padding 500ms;
|
||||
}
|
||||
.collapse-text .sidebar-link span {
|
||||
#menu-mobile.collapse-text .sidebar-link span {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.highlight:hover,
|
||||
.router-link-active {
|
||||
#menu-mobile .highlight:hover,
|
||||
#menu-mobile .router-link-active {
|
||||
color: #fff;
|
||||
}
|
||||
.router-link-active {
|
||||
#menu-mobile .router-link-active {
|
||||
background: linear-gradient(to right, #da22ff, #9733ee);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -176,6 +176,16 @@
|
|||
<option value="avc">AVC (h.264)</option>
|
||||
</select>
|
||||
<br />
|
||||
<label for="disableAnimations"><b v-t="'preferences.disable_animations'"/></label>
|
||||
<br />
|
||||
<input
|
||||
id="disableAnimations"
|
||||
v-model="disableAnimations"
|
||||
class="uk-checkbox"
|
||||
type="checkbox"
|
||||
@change="onChange($event)"
|
||||
/>
|
||||
<br />
|
||||
<label for="chkDisableLBRY"><b v-t="'actions.disable_lbry'"/></label>
|
||||
<br />
|
||||
<input id="chkDisableLBRY" v-model="disableLBRY" class="uk-checkbox" type="checkbox" @change="onChange($event)" />
|
||||
|
|
@ -273,6 +283,7 @@ export default {
|
|||
enabledCodecs: ["av1", "vp9", "avc"],
|
||||
disableLBRY: false,
|
||||
proxyLBRY: false,
|
||||
disableAnimations: false,
|
||||
};
|
||||
},
|
||||
activated() {
|
||||
|
|
@ -361,6 +372,7 @@ export default {
|
|||
this.enabledCodecs = this.getPreferenceString("enabledCodecs", "av1,vp9,avc").split(",");
|
||||
this.disableLBRY = this.getPreferenceBoolean("disableLBRY", false);
|
||||
this.proxyLBRY = this.getPreferenceBoolean("proxyLBRY", false);
|
||||
this.disableAnimations = this.getPreferenceBoolean("disableAnimations", false);
|
||||
if (this.selectedLanguage != "en") {
|
||||
try {
|
||||
this.CountryMap = await import("@/utils/CountryMaps/" + this.selectedLanguage + ".json").then(
|
||||
|
|
@ -414,6 +426,7 @@ export default {
|
|||
localStorage.setItem("enabledCodecs", this.enabledCodecs.join(","));
|
||||
localStorage.setItem("disableLBRY", this.disableLBRY);
|
||||
localStorage.setItem("proxyLBRY", this.proxyLBRY);
|
||||
localStorage.setItem("disableAnimations", this.disableAnimations);
|
||||
|
||||
if (shouldReload) window.location.reload();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,6 +21,15 @@
|
|||
|
||||
<hr />
|
||||
|
||||
<div v-if="results && results.corrected" style="height: 7vh">
|
||||
{{ $t("search.did_you_mean") }}
|
||||
<i>
|
||||
<router-link :to="{ name: 'SearchResults', query: { search_query: results.suggestion } }">
|
||||
{{ results.suggestion }}
|
||||
</router-link>
|
||||
</i>
|
||||
</div>
|
||||
|
||||
<div v-if="results" class="uk-grid-xl" uk-grid="parallax: 0">
|
||||
<div
|
||||
v-for="result in results.items"
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
/>
|
||||
|
||||
<div class="uk-flex uk-flex-middle uk-flex-between uk-flex-row-reverse" style="padding: 34px 0">
|
||||
<form
|
||||
<div
|
||||
class="uk-search"
|
||||
:style="{
|
||||
width: isMobile ? '100%' : '35ch',
|
||||
|
|
@ -18,8 +18,14 @@
|
|||
class="uk-search-input"
|
||||
style="border-radius: 9999px; padding: 12px 18px 12px 40px;"
|
||||
:style="{ backgroundColor: secondaryBackgroundColor }"
|
||||
type="search"
|
||||
v-model="searchText"
|
||||
type="text"
|
||||
role="search"
|
||||
:title="$t('actions.search')"
|
||||
:placeholder="$t('actions.search')"
|
||||
@keyup="onKeyUp"
|
||||
@focus="onInputFocus"
|
||||
@blur="onInputBlur"
|
||||
/>
|
||||
<font-awesome-icon
|
||||
icon="search"
|
||||
|
|
@ -27,7 +33,13 @@
|
|||
class="uk-position-center-left uk-position-small"
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<SearchSuggestions
|
||||
v-show="searchText && suggestionsVisible"
|
||||
ref="searchSuggestions"
|
||||
:search-text="searchText"
|
||||
@searchchange="onSearchTextChange"
|
||||
/>
|
||||
|
||||
<div
|
||||
v-if="!isMobile"
|
||||
|
|
@ -54,11 +66,13 @@
|
|||
|
||||
<script>
|
||||
import VideoItem from "@/components/VideoItem.vue";
|
||||
import SearchSuggestions from "@/components/SearchSuggestions";
|
||||
|
||||
import { useIsMobile } from "../store";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SearchSuggestions,
|
||||
VideoItem,
|
||||
},
|
||||
props: {
|
||||
|
|
@ -71,8 +85,11 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
videos: [],
|
||||
searchText: "",
|
||||
suggestionsVisible: false,
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
let region = this.getPreferenceString("region", "US");
|
||||
|
||||
|
|
@ -91,6 +108,29 @@ export default {
|
|||
region: region || "US",
|
||||
});
|
||||
},
|
||||
|
||||
onKeyUp(e) {
|
||||
if (e.key === "Enter") {
|
||||
e.target.blur();
|
||||
this.$router.push({
|
||||
name: "SearchResults",
|
||||
query: { search_query: this.searchText },
|
||||
});
|
||||
return;
|
||||
} else if (e.key === "ArrowUp" || e.key === "ArrowDown") {
|
||||
e.preventDefault();
|
||||
}
|
||||
this.$refs.searchSuggestions.onKeyUp(e);
|
||||
},
|
||||
onInputFocus() {
|
||||
this.suggestionsVisible = true;
|
||||
},
|
||||
onInputBlur() {
|
||||
this.suggestionsVisible = false;
|
||||
},
|
||||
onSearchTextChange(searchText) {
|
||||
this.searchText = searchText;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -74,7 +74,8 @@
|
|||
"instance_name": "Instance Name",
|
||||
"instance_locations": "Instance Locations",
|
||||
"has_cdn": "Has CDN?",
|
||||
"ssl_score": "SSL Score"
|
||||
"ssl_score": "SSL Score",
|
||||
"disable_animations": "Disable animations"
|
||||
},
|
||||
"login": {
|
||||
"username": "Username",
|
||||
|
|
@ -85,5 +86,8 @@
|
|||
"views": "views",
|
||||
"watched": "Watched",
|
||||
"sponsor_segments": "Sponsors Segments"
|
||||
},
|
||||
"search": {
|
||||
"did_you_mean": "Did you mean: "
|
||||
}
|
||||
}
|
||||
|
|
|
|||
10
src/store.js
10
src/store.js
|
|
@ -9,3 +9,13 @@ export function useIsMobile() {
|
|||
|
||||
return isMobile;
|
||||
}
|
||||
|
||||
const menuCollapsed = ref(false);
|
||||
export function useMenuCollapsed() {
|
||||
return {
|
||||
menuCollapsed,
|
||||
toggleCollapsed: () => {
|
||||
menuCollapsed.value = !menuCollapsed.value;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
|||
152
yarn.lock
152
yarn.lock
|
|
@ -1508,47 +1508,47 @@
|
|||
semver "^6.1.0"
|
||||
strip-ansi "^6.0.0"
|
||||
|
||||
"@vue/compiler-core@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.19.tgz#b537dd377ce51fdb64e9b30ebfbff7cd70a64cb9"
|
||||
integrity sha512-8dOPX0YOtaXol0Zf2cfLQ4NU/yHYl2H7DCKsLEZ7gdvPK6ZSEwGLJ7IdghhY2YEshEpC5RB9QKdC5I07z8Dtjg==
|
||||
"@vue/compiler-core@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.20.tgz#af5a3c5237818835b0d0be837eb5885a8d21c160"
|
||||
integrity sha512-vcEXlKXoPwBXFP5aUTHN9GTZaDfwCofa9Yu9bbW2C5O/QSa9Esdt7OG4+0RRd3EHEMxUvEdj4RZrd/KpQeiJbA==
|
||||
dependencies:
|
||||
"@babel/parser" "^7.15.0"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/shared" "3.2.20"
|
||||
estree-walker "^2.0.2"
|
||||
source-map "^0.6.1"
|
||||
|
||||
"@vue/compiler-dom@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.19.tgz#0607bc90de6af55fde73b09b3c4d0bf8cb597ed8"
|
||||
integrity sha512-WzQoE8rfkFjPtIioc7SSgTsnz9g2oG61DU8KHnzPrRS7fW/lji6H2uCYJfp4Z6kZE8GjnHc1Ljwl3/gxDes0cw==
|
||||
"@vue/compiler-dom@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.20.tgz#8e0ef354449c0faf41519b00bfc2045eae01dcb5"
|
||||
integrity sha512-QnI77ec/JtV7R0YBbcVayYTDCRcI9OCbxiUQK6izVyqQO0658n0zQuoNwe+bYgtqnvGAIqTR3FShTd5y4oOjdg==
|
||||
dependencies:
|
||||
"@vue/compiler-core" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-core" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
"@vue/compiler-sfc@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.19.tgz#d412195a98ebd49b84602f171719294a1d9549be"
|
||||
integrity sha512-pLlbgkO1UHTO02MSpa/sFOXUwIDxSMiKZ1ozE5n71CY4DM+YmI+G3gT/ZHZ46WBId7f3VTF/D8pGwMygcQbrQA==
|
||||
"@vue/compiler-sfc@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.20.tgz#2d7668e76f066c566dd7c09c15c9acce4e876e0a"
|
||||
integrity sha512-03aZo+6tQKiFLfunHKSPZvdK4Jsn/ftRCyaro8AQIWkuxJbvSosbKK6HTTn+D2c3nPScG155akJoxKENw7rftQ==
|
||||
dependencies:
|
||||
"@babel/parser" "^7.15.0"
|
||||
"@vue/compiler-core" "3.2.19"
|
||||
"@vue/compiler-dom" "3.2.19"
|
||||
"@vue/compiler-ssr" "3.2.19"
|
||||
"@vue/ref-transform" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-core" "3.2.20"
|
||||
"@vue/compiler-dom" "3.2.20"
|
||||
"@vue/compiler-ssr" "3.2.20"
|
||||
"@vue/ref-transform" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
estree-walker "^2.0.2"
|
||||
magic-string "^0.25.7"
|
||||
postcss "^8.1.10"
|
||||
source-map "^0.6.1"
|
||||
|
||||
"@vue/compiler-ssr@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.19.tgz#3e91ecf70f8f961c5f63eacd2139bcdab9a7a07c"
|
||||
integrity sha512-oLon0Cn3O7WEYzzmzZavGoqXH+199LT+smdjBT3Uf3UX4HwDNuBFCmvL0TsqV9SQnIgKvBRbQ7lhbpnd4lqM3w==
|
||||
"@vue/compiler-ssr@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.20.tgz#9cceb6261d9932cb5568202610c1c28f86c5e521"
|
||||
integrity sha512-rzzVVYivm+EjbfiGQvNeyiYZWzr6Hkej97RZLZvcumacQlnKv9176Xo9rRyeWwFbBlxmtNdrVMslRXtipMXk2w==
|
||||
dependencies:
|
||||
"@vue/compiler-dom" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-dom" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
"@vue/component-compiler-utils@^3.1.0", "@vue/component-compiler-utils@^3.1.2":
|
||||
version "3.2.2"
|
||||
|
|
@ -1576,53 +1576,53 @@
|
|||
resolved "https://registry.yarnpkg.com/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz#ceb924b4ecb3b9c43871c7a429a02f8423e621ab"
|
||||
integrity sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ==
|
||||
|
||||
"@vue/reactivity@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.19.tgz#fc6e0f0106f295226835cfed5ff5f84d927bea65"
|
||||
integrity sha512-FtachoYs2SnyrWup5UikP54xDX6ZJ1s5VgHcJp4rkGoutU3Ry61jhs+nCX7J64zjX992Mh9gGUC0LqTs8q9vCA==
|
||||
"@vue/reactivity@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.20.tgz#81fe1c368e7f20bc0ec1dec1045bbee253582de8"
|
||||
integrity sha512-nSmoLojUTk+H8HNTAkrUduB4+yIUBK2HPihJo2uXVSH4Spry6oqN6lFzE5zpLK+F27Sja+UqR9R1+/kIOsHV5w==
|
||||
dependencies:
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
"@vue/ref-transform@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/ref-transform/-/ref-transform-3.2.19.tgz#cf0f986486bb26838fbd09749e927bab19745600"
|
||||
integrity sha512-03wwUnoIAeKti5IGGx6Vk/HEBJ+zUcm5wrUM3+PQsGf7IYnXTbeIfHHpx4HeSeWhnLAjqZjADQwW8uA4rBmVbg==
|
||||
"@vue/ref-transform@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/ref-transform/-/ref-transform-3.2.20.tgz#2a59ec90caf8e5c7336776a0900bff0a8b81c090"
|
||||
integrity sha512-Y42d3PGlYZ1lXcF3dbd3+qU/C/a3wYEZ949fyOI5ptzkjDWlkfU6vn74fmOjsLjEcjs10BXK2qO99FqQIK2r1Q==
|
||||
dependencies:
|
||||
"@babel/parser" "^7.15.0"
|
||||
"@vue/compiler-core" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-core" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
estree-walker "^2.0.2"
|
||||
magic-string "^0.25.7"
|
||||
|
||||
"@vue/runtime-core@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.19.tgz#807715b7f4728abb84fa4a8efdbe37d8ddb4c6d3"
|
||||
integrity sha512-qArZSWKxWsgKfxk9BelZ32nY0MZ31CAW2kUUyVJyxh4cTfHaXGbjiQB5JgsvKc49ROMNffv9t3/qjasQqAH+RQ==
|
||||
"@vue/runtime-core@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.20.tgz#8f63e956a3f88fb772541443c45a7701211012cb"
|
||||
integrity sha512-d1xfUGhZPfiZzAN7SatStD4vRtT8deJSXib2+Cz3x0brjMWKxe32asQc154FF1E2fFgMCHtnfd4A90bQEzV4GQ==
|
||||
dependencies:
|
||||
"@vue/reactivity" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/reactivity" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
"@vue/runtime-dom@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.19.tgz#7e8bf645754703e360fa132e4be9113edf2377bb"
|
||||
integrity sha512-hIRboxXwafeHhbZEkZYNV0MiJXPNf4fP0X6hM2TJb0vssz8BKhD9cF92BkRgZztTQevecbhk0gu4uAPJ3dxL9A==
|
||||
"@vue/runtime-dom@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.20.tgz#8aa56ae6c30f9cd4a71ca0e9ec3c4bdc67148d15"
|
||||
integrity sha512-4TCvZMLhESWCFHFYgqN4QmMA/onnINAlUovhopjlS8ST27G1A8Z0tyxPzLoXLa+b5JrOpbMPheEMPvdKExTJig==
|
||||
dependencies:
|
||||
"@vue/runtime-core" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/runtime-core" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
csstype "^2.6.8"
|
||||
|
||||
"@vue/server-renderer@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.19.tgz#870bcec9f7cdaee0c2187a169b6e636ab4362fb1"
|
||||
integrity sha512-A9FNT7fgQJXItwdzWREntAgWKVtKYuXHBKGev/H4+ByTu8vB7gQXGcim01QxaJshdNg4dYuH2tEBZXCNCNx+/w==
|
||||
"@vue/server-renderer@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.20.tgz#705e07ae9425132b2b6227d308a51a13f4d4ec81"
|
||||
integrity sha512-viIbZGep9XabnrRcaxWIi00cOh1x21QYm2upIL5W0zqzTJ54VdTzpI+zi1osNp+VfRQDTHpV2U7H3Kn4ljYJvg==
|
||||
dependencies:
|
||||
"@vue/compiler-ssr" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-ssr" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
"@vue/shared@3.2.19":
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.19.tgz#111ec3da18337d86274446984c49925b1b2b2dd7"
|
||||
integrity sha512-Knqhx7WieLdVgwCAZgTVrDCXZ50uItuecLh9JdLC8O+a5ayaSyIQYveUK3hCRNC7ws5zalHmZwfdLMGaS8r4Ew==
|
||||
"@vue/shared@3.2.20":
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.20.tgz#53746961f731a8ea666e3316271e944238dc31db"
|
||||
integrity sha512-FbpX+hD5BvXCQerEYO7jtAGHlhAkhTQ4KIV73kmLWNlawWhTiVuQxizgVb0BOkX5oG9cIRZ42EG++d/k/Efp0w==
|
||||
|
||||
"@vue/web-component-wrapper@^1.2.0":
|
||||
version "1.3.0"
|
||||
|
|
@ -3104,10 +3104,10 @@ css-loader@^3.5.3:
|
|||
schema-utils "^2.7.0"
|
||||
semver "^6.3.0"
|
||||
|
||||
css-loader@^6.3.0:
|
||||
version "6.3.0"
|
||||
resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.3.0.tgz#334d3500ff0a0c14cfbd4b0670088dbb5b5c1530"
|
||||
integrity sha512-9NGvHOR+L6ps13Ilw/b216++Q8q+5RpJcVufCdW9S/9iCzs4KBDNa8qnA/n3FK/sSfWmH35PAIK/cfPi7LOSUg==
|
||||
css-loader@^6.4.0:
|
||||
version "6.4.0"
|
||||
resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.4.0.tgz#01c57ea776024e18ca193428dcad3ff6b42a0130"
|
||||
integrity sha512-Dlt6qfsxI/w1vU0r8qDd4BtMPxWqJeY5qQU7SmmZfvbpe6Xl18McO4GhyaMLns24Y2VNPiZwJPQ8JSbg4qvQLw==
|
||||
dependencies:
|
||||
icss-utils "^5.1.0"
|
||||
postcss "^8.2.15"
|
||||
|
|
@ -8466,10 +8466,10 @@ uglify-js@3.4.x:
|
|||
commander "~2.19.0"
|
||||
source-map "~0.6.1"
|
||||
|
||||
uikit@3.7.5:
|
||||
version "3.7.5"
|
||||
resolved "https://registry.yarnpkg.com/uikit/-/uikit-3.7.5.tgz#391c82f1916462bfe2c451d5befb5f75df2d0429"
|
||||
integrity sha512-rlnf7hyaMPZ7j5lGlGcyja8ERLNO6+jQ9ENfp5WUHiRS/tWghPNwgP7nAW6GpAgTxq101TnI6xNjjTNi7jy7OA==
|
||||
uikit@3.7.6:
|
||||
version "3.7.6"
|
||||
resolved "https://registry.yarnpkg.com/uikit/-/uikit-3.7.6.tgz#b7536bc1aac104fd54bbba13553ca801e16f6e20"
|
||||
integrity sha512-O1ePw9bhNJqSWfOyPTrFNIZUnrwfsoju5GLeXN/Rp7nmgcpqP0r8rBczpVL3NAkaLYqyH7Ga5qfIaDzSnLYK+A==
|
||||
|
||||
unbox-primitive@^1.0.1:
|
||||
version "1.0.1"
|
||||
|
|
@ -8770,16 +8770,16 @@ vue-template-es2015-compiler@^1.9.0:
|
|||
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
|
||||
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
|
||||
|
||||
vue@^3.2.19:
|
||||
version "3.2.19"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.19.tgz#da2c80a6a0271c7097fee9e31692adfd9d569c8f"
|
||||
integrity sha512-6KAMdIfAtlK+qohTIUE4urwAv4A3YRuo8uAbByApUmiB0CziGAAPs6qVugN6oHPia8YIafHB/37K0O6KZ7sGmA==
|
||||
vue@^3.2.20:
|
||||
version "3.2.20"
|
||||
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.20.tgz#940f8aa8bf3e3be78243ca582bad41fcd45ae3e6"
|
||||
integrity sha512-81JjEP4OGk9oO8+CU0h2nFPGgJBm9mNa3kdCX2k6FuRdrWrC+CNe+tOnuIeTg8EWwQuI+wwdra5Q7vSzp7p4Iw==
|
||||
dependencies:
|
||||
"@vue/compiler-dom" "3.2.19"
|
||||
"@vue/compiler-sfc" "3.2.19"
|
||||
"@vue/runtime-dom" "3.2.19"
|
||||
"@vue/server-renderer" "3.2.19"
|
||||
"@vue/shared" "3.2.19"
|
||||
"@vue/compiler-dom" "3.2.20"
|
||||
"@vue/compiler-sfc" "3.2.20"
|
||||
"@vue/runtime-dom" "3.2.20"
|
||||
"@vue/server-renderer" "3.2.20"
|
||||
"@vue/shared" "3.2.20"
|
||||
|
||||
watchpack-chokidar2@^2.0.1:
|
||||
version "2.0.1"
|
||||
|
|
|
|||
Loading…
Reference in New Issue