aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Layout/TextTransition.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-09 00:41:20 -0700
committerFuwn <[email protected]>2024-10-09 00:41:43 -0700
commit998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch)
tree50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/lib/Layout/TextTransition.svelte
parentfeat(graphql): add badgeCount field (diff)
downloaddue.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz
due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/lib/Layout/TextTransition.svelte')
-rw-r--r--src/lib/Layout/TextTransition.svelte36
1 files changed, 18 insertions, 18 deletions
diff --git a/src/lib/Layout/TextTransition.svelte b/src/lib/Layout/TextTransition.svelte
index bd7814de..35cfe1ea 100644
--- a/src/lib/Layout/TextTransition.svelte
+++ b/src/lib/Layout/TextTransition.svelte
@@ -1,28 +1,28 @@
<script>
- import { tweened } from 'svelte/motion';
- import { cubicOut } from 'svelte/easing';
+ import { tweened } from 'svelte/motion';
+ import { cubicOut } from 'svelte/easing';
- export let text = '';
- export let opacityTransitionDuration = 50;
- export let blurTransitionDuration = opacityTransitionDuration;
- export let easing = cubicOut;
+ export let text = '';
+ export let opacityTransitionDuration = 50;
+ export let blurTransitionDuration = opacityTransitionDuration;
+ export let easing = cubicOut;
- let previousValue = '';
- let opacity = tweened(1, { duration: opacityTransitionDuration, easing });
- let blur = tweened(0, { duration: blurTransitionDuration, easing });
+ let previousValue = '';
+ let opacity = tweened(1, { duration: opacityTransitionDuration, easing });
+ let blur = tweened(0, { duration: blurTransitionDuration, easing });
- $: {
- if (text !== previousValue)
- Promise.all([opacity.set(0), blur.set(10)]).then(() => {
- previousValue = text;
+ $: {
+ if (text !== previousValue)
+ Promise.all([opacity.set(0), blur.set(10)]).then(() => {
+ previousValue = text;
- Promise.all([opacity.set(1), blur.set(0)]);
- });
- }
+ Promise.all([opacity.set(1), blur.set(0)]);
+ });
+ }
</script>
<span
- style="opacity: {$opacity}; filter: blur({$blur}px); transition: opacity {opacityTransitionDuration}ms, filter {blurTransitionDuration}ms;"
+ style="opacity: {$opacity}; filter: blur({$blur}px); transition: opacity {opacityTransitionDuration}ms, filter {blurTransitionDuration}ms;"
>
- {previousValue}
+ {previousValue}
</span>