1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-29 16:07:40 +01:00

Animate show/hide

This commit is contained in:
Isra 2024-03-18 15:50:56 -05:00
parent a26097ffd4
commit a172322a54

View file

@ -1,3 +1,4 @@
import classNames from "classnames";
import Fuse from "fuse.js"; import Fuse from "fuse.js";
import { type DragEvent, useMemo, useRef, useState } from "react"; import { type DragEvent, useMemo, useRef, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
@ -194,16 +195,19 @@ export function CaptionsView({ id }: { id: string }) {
return ( return (
<> <>
<div> <div>
{dragging && ( <div
<div className="absolute inset-0 flex items-center justify-center text-white z-10 pointer-events-none"> className={classNames(
"absolute inset-0 flex items-center justify-center text-white z-10 pointer-events-none transition-opacity duration-300",
dragging ? "opacity-100" : "opacity-0",
)}
>
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<Icon className="text-5xl mb-8" icon={Icons.FILE} /> <Icon className="text-5xl mb-4" icon={Icons.FILE} />
<span className="text-xl weight font-medium"> <span className="text-xl weight font-medium">
{t("player.menus.subtitles.dropSubtitleFile")} {t("player.menus.subtitles.dropSubtitleFile")}
</span> </span>
</div> </div>
</div> </div>
)}
<Menu.BackLink <Menu.BackLink
onClick={() => router.navigate("/")} onClick={() => router.navigate("/")}