diff options
| author | Fuwn <[email protected]> | 2024-01-31 07:26:53 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-01-31 07:26:53 -0800 |
| commit | 89e142040f44a9821feb0f237db7c6a3ebf16dc7 (patch) | |
| tree | 90e4b0eb6acf0da9ccf7db4963d5617f4ba284e8 /src/lib | |
| parent | fix(tooltip): z-index (diff) | |
| download | due.moe-89e142040f44a9821feb0f237db7c6a3ebf16dc7.tar.xz due.moe-89e142040f44a9821feb0f237db7c6a3ebf16dc7.zip | |
feat(hovercover): drop in animation
Diffstat (limited to 'src/lib')
| -rw-r--r-- | src/lib/Media/Cover/HoverCover.svelte | 18 |
1 files changed, 17 insertions, 1 deletions
diff --git a/src/lib/Media/Cover/HoverCover.svelte b/src/lib/Media/Cover/HoverCover.svelte index 92c0e6fd..d7f8d426 100644 --- a/src/lib/Media/Cover/HoverCover.svelte +++ b/src/lib/Media/Cover/HoverCover.svelte @@ -16,7 +16,7 @@ /> {/if} -<style> +<style lang="scss"> .hover-image { position: fixed; z-index: 1000; @@ -28,4 +28,20 @@ .show { display: block; } + + .hover-image { + animation: dropIn 0.25s ease-in-out; + } + + @keyframes dropIn { + 0% { + opacity: 0; + transform: translateY(-1rem); + } + + 100% { + opacity: 1; + transform: translateY(0); + } + } </style> |