add label

This commit is contained in:
Kentai Radiquum 2025-04-09 06:24:08 +05:00
parent 6a27977576
commit 0168daa6cc
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
2 changed files with 39 additions and 36 deletions

View file

@ -116,7 +116,7 @@
--media-settings-menu-min-width: calc(10 * var(--base)); --media-settings-menu-min-width: calc(10 * var(--base));
--media-menu-transform-in: translateY(0) scale(1); --media-menu-transform-in: translateY(0) scale(1);
--media-menu-transform-out: translateY(20px) rotate(3deg) scale(1); --media-menu-transform-out: translateY(20px) rotate(3deg) scale(1);
background: rgb(30 30 30 / .8); background: rgb(30 30 30 / .6);
min-width: var(--media-settings-menu-min-width, 170px); min-width: var(--media-settings-menu-min-width, 170px);
position: absolute; position: absolute;
right: 10px; right: 10px;

View file

@ -63,43 +63,46 @@ export const VoiceoverSelectorMenu = ({
}, [release_id, token]); }, [release_id, token]);
return ( return (
<div className="max-h-full flex flex-col gap-4 items-start justify-start overflow-x-hidden overflow-y-auto px-2 py-2 scrollbar-thin scrollbar-thumb-[rgb(60_60_60_/_.8)] scrollbar-track-[rgb(30_30_30_/_.8)]"> <div className="flex flex-col items-start justify-start gap-4">
{voiceoverList && voiceoverList.length > 0 ? <p className="text-[22px] px-2 py-2 font-bold">Озвучка</p>
voiceoverList.map((vo: Voiceover) => { <div className="max-h-full flex flex-col gap-4 items-start justify-start overflow-x-hidden overflow-y-auto px-2 scrollbar-thin scrollbar-thumb-[rgb(60_60_60_/_.8)] scrollbar-track-[rgb(30_30_30_/_.8)]">
return ( {voiceoverList && voiceoverList.length > 0 ?
<Button key={`release-${release_id}-voiceover-${vo.id}`} voiceoverList.map((vo: Voiceover) => {
className={`h-fit ${voiceover.id == vo.id ? "text-white" : "text-gray-500 hover:text-gray-300"} transition-colors`} return (
onClick={() => { <button key={`release-${release_id}-voiceover-${vo.id}`}
setVoiceover({ className={`h-fit justify-start items-start ${voiceover.id == vo.id ? "text-white" : "text-gray-500 hover:text-gray-300"} transition-colors`}
selected: vo, onClick={() => {
available: voiceoverList setVoiceover({
}); selected: vo,
playerPreferenceStore.setPreferredVoiceover( available: voiceoverList
release_id, });
vo.name playerPreferenceStore.setPreferredVoiceover(
); release_id,
vo.name
);
}
} }
} >
> <div className="flex flex-col w-full gap-1">
<div className="flex flex-col gap-1"> <div className="flex items-center gap-2">
<div className="flex gap-2"> {/* eslint-disable-next-line @next/next/no-img-element */}
{/* eslint-disable-next-line @next/next/no-img-element */} {vo.icon ? <img alt="" className="w-6 h-6 rounded-full" src={vo.icon}></img> : ""}
{vo.icon ? <img alt="" className="w-6 h-6 rounded-full" src={vo.icon}></img> : ""} <span className="text-[16px] leading-none">{vo.name}</span>
<span>{vo.name}</span> {vo.pinned && (
{vo.pinned && ( <span className={`h-4 iconify material-symbols--push-pin ${voiceover.id == vo.id ? "bg-white" : "bg-gray-500 hover:bg-gray-300"} transition-colors`}></span>
<span className={`h-4 iconify material-symbols--push-pin ${voiceover.id == vo.id ? "bg-white" : "bg-gray-500 hover:bg-gray-300"} transition-colors`}></span> )}
)} </div>
<div className="flex gap-2">
{/* eslint-disable-next-line @next/next/no-img-element */}
<span>{vo.episodes_count} {numberDeclension(vo.episodes_count, "серия", "серии", "серий")}</span>
<span>{vo.view_count} {numberDeclension(vo.view_count, "просмотр", "просмотра", "просмотров")}</span>
</div>
</div> </div>
<div className="flex gap-2"> </button>
{/* eslint-disable-next-line @next/next/no-img-element */} );
<span>{vo.episodes_count} {numberDeclension(vo.episodes_count, "серия", "серии", "серий")}</span> })
<span>{vo.view_count} {numberDeclension(vo.view_count, "просмотр", "просмотра", "просмотров")}</span> : ""}
</div> </div>
</div>
</Button>
);
})
: ""}
</div> </div>
); );
}; };