Revert "marquee only runs while mouseovered"

This reverts commit 3b4449ecb8.
feat/vaults
Tomáš Mládek 2021-11-24 14:07:38 +01:00
parent 3b4449ecb8
commit ec16e764cc
1 changed files with 1 additions and 10 deletions

View File

@ -1,13 +1,12 @@
<script lang="ts">
import { onMount } from "svelte";
export let speed = 50;
export let speed = 30;
let root: HTMLDivElement | undefined;
let inner: HTMLDivElement | undefined;
let overflowed = false;
let running = false;
let shiftWidth = "unset";
let animLength = "unset";
@ -25,9 +24,6 @@
<div
class="marquee"
class:overflowed
class:running
on:mouseenter={() => (running = true)}
on:mouseleave={() => (running = false)}
style={`--shift-width: ${shiftWidth}; --anim-length: ${animLength}`}
bind:this={root}
>
@ -51,14 +47,9 @@
:global {
.overflowed .inner {
animation: marquee var(--anim-length) ease-in-out infinite;
animation-play-state: paused;
--padding: 0.5em;
}
.overflowed.running .inner {
animation-play-state: running;
}
@keyframes marquee {
0% {
transform: translateX(var(--padding));