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

chore: 🔥 remove fader

This commit is contained in:
ThatOneCalculator 2022-08-19 23:48:21 -07:00
parent 6c0fc88a4b
commit 504753c896
1 changed files with 0 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
packages/client/src/pages/timeline.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<MkStickyContainer> <MkStickyContainer>
<svg class="fader" ref="fader"></svg>
<template #header> <template #header>
<MkPageHeader <MkPageHeader
v-model:tab="src" v-model:tab="src"
@ -84,7 +83,6 @@ window.addEventListener('resize', () => {
const tlComponent = $ref<InstanceType<typeof XTimeline>>(); const tlComponent = $ref<InstanceType<typeof XTimeline>>();
const rootEl = $ref<HTMLElement>(); const rootEl = $ref<HTMLElement>();
const fader = $ref<SVGElement>();
let queue = $ref(0); let queue = $ref(0);
const src = $computed({ const src = $computed({
@ -287,8 +285,6 @@ if (isMobile.value) {
} else { } else {
next = timelines[(timelines.indexOf(src) + 1) % timelines.length]; next = timelines[(timelines.indexOf(src) + 1) % timelines.length];
} }
fader.classList.remove('fade');
fader.classList.add('fade');
saveSrc(next); saveSrc(next);
} }
xDown = null; xDown = null;
@ -324,33 +320,4 @@ if (isMobile.value) {
overflow: clip; overflow: clip;
} }
} }
@keyframes fade {
0%, 100% { opacity: 0 }
50% { opacity: 1 }
}
.fader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 1001;
pointer-events: none;
background: var(--acrylicBg);
animation-duration: 0.25s;
animation-timing-function: ease-in-out;
> .fadeOut {
opacity: 0;
animation-name: fade-out;
}
> .fadeIn {
opacity: 1;
animation-name: fade-in;
}
}
</style> </style>