natty
/
calckey
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

revert

This commit is contained in:
ThatOneCalculator 2022-11-07 12:46:05 -08:00
parent 52eeedb639
commit 3c1c238db7
2 changed files with 30 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "calckey", "name": "calckey",
"version": "12.119.0-calc.9.19", "version": "12.119.0-calc.9.20",
"codename": "aqua", "codename": "aqua",
"repository": { "repository": {
"type": "git", "type": "git",

35
packages/client/src/ui/universal.vue
View File

@ -24,17 +24,17 @@
<i class="ph-list-bold ph-lg"></i><span v-if="menuIndicated" class="indicator"><i class="ph-circle-fill"></i></span> <i class="ph-list-bold ph-lg"></i><span v-if="menuIndicated" class="indicator"><i class="ph-circle-fill"></i></span>
</div> </div>
</button> </button>
<button class="button home _button" active-class="active" @click="mainRouter.currentRoute.value.name === 'index' ? top() : mainRouter.push('/')"> <button class="button home _button" @click="mainRouter.currentRoute.value.name === 'index' ? top() : mainRouter.push('/')">
<div class="button-wrapper" :class="buttonAnimIndex === 0 ? 'on' : ''"> <div class="button-wrapper" :class="buttonAnimIndex === 0 ? 'on' : ''">
<i class="ph-house-bold ph-lg"></i> <i class="ph-house-bold ph-lg"></i>
</div> </div>
</button> </button>
<button class="button notifications _button" active-class="active" @click="mainRouter.push('/my/notifications')"> <button class="button notifications _button" @click="mainRouter.push('/my/notifications'); updateButtonState();">
<div class="button-wrapper" :class="buttonAnimIndex === 1 ? 'on' : ''"> <div class="button-wrapper" :class="buttonAnimIndex === 1 ? 'on' : ''">
<i class="ph-bell-bold ph-lg"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="ph-circle-fill"></i></span> <i class="ph-bell-bold ph-lg"></i><span v-if="$i?.hasUnreadNotification" class="indicator"><i class="ph-circle-fill"></i></span>
</div> </div>
</button> </button>
<button class="button messaging _button" active-class="active" @click="mainRouter.push('/my/messaging')"> <button class="button messaging _button" @click="mainRouter.push('/my/messaging'); updateButtonState();">
<div class="button-wrapper" :class="buttonAnimIndex === 2 ? 'on' : ''"> <div class="button-wrapper" :class="buttonAnimIndex === 2 ? 'on' : ''">
<i class="ph-chats-teardrop-bold ph-lg"></i><span v-if="$i?.hasUnreadMessagingMessage" class="indicator"><i class="ph-circle-fill"></i></span> <i class="ph-chats-teardrop-bold ph-lg"></i><span v-if="$i?.hasUnreadMessagingMessage" class="indicator"><i class="ph-circle-fill"></i></span>
</div> </div>
@ -133,7 +133,30 @@ const menuIndicated = computed(() => {
return false; return false;
}); });
mainRouter.on('change', () => (drawerMenuShowing.value = false)); function updateButtonState(): void {
let routerState = window.location.pathname;
if (routerState === '/') {
buttonAnimIndex.value = 0;
return;
}
if (routerState.includes('/my/notifications')) {
buttonAnimIndex.value = 1;
return;
}
if (routerState.includes('/my/messaging')) {
buttonAnimIndex.value = 2;
return;
}
buttonAnimIndex.value = 3;
return;
}
updateButtonState();
mainRouter.on('change', () => {
drawerMenuShowing.value = false;
updateButtonState();
});
document.documentElement.style.overflowY = 'scroll'; document.documentElement.style.overflowY = 'scroll';
@ -158,7 +181,7 @@ onMounted(() => {
function createScrollStopListener(element: Window, callback: TimerHandler, timeout: number): () => void { function createScrollStopListener(element: Window, callback: TimerHandler, timeout: number): () => void {
let handle = 0; let handle = 0;
const onScroll = (): void => { const onScroll = () => {
if (handle) { if (handle) {
clearTimeout(handle); clearTimeout(handle);
} }
@ -373,7 +396,7 @@ const wallpaper = localStorage.getItem('wallpaper') != null;
> .button-wrapper { > .button-wrapper {
&.active { &.on {
background-color: var(--accentedBg); background-color: var(--accentedBg);
width: 100%; width: 100%;
border-radius: 999px; border-radius: 999px;