dylan/vod-system
1
1
Fork 0
Code Issues 16 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

ABSTRACT sidebar buttons

Browse Source
This commit is contained in:
Dylan De Faoite
2025-05-30 14:58:29 +02:00
parent 1802659f43
commit e65bbf8e75
6 changed files with 55 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/components/video/ClipConfig.tsx
View File

@@ -32,15 +32,15 @@ export default function ClipConfig({setMetadata, className}: prop) {
}
return (
<div className={clsx("flex flex-col gap-2 p-10 rounded-md", className)}>
<h2 className={"text-3xl font-bold text-gray-800 mb-4"}>Export Settings</h2>
<div className={clsx("flex flex-col gap-2 p-10", className)}>
<h2 className={"text-3xl font-bold mb-4"}>Export Settings</h2>
<Selector label={"Resolution"}>
<select id="resolution"
name="resolution"
defaultValue="1280,720"
onChange={updateRes}
className={"border-black bg-gray-200 p-2 rounded-md w-full"}>
className={"border-black bg-gray-200 rounded-md w-full"}>
<option value="3840,2160">2160p</option>
<option value="2560,1440">1440p</option>
<option value="1920,1080">1080p</option>
@@ -55,7 +55,7 @@ export default function ClipConfig({setMetadata, className}: prop) {
name="fps"
defaultValue="30"
onChange={updateFps}
className={"border-black bg-gray-200 p-2 rounded-md w-full"}>
className={"border-black bg-gray-200 rounded-md w-full"}>
<option value="60">60</option>
<option value="30">30</option>
<option value="15">15</option>
@@ -67,7 +67,7 @@ export default function ClipConfig({setMetadata, className}: prop) {
min="1"
defaultValue="10"
onChange={updateFileSize}
className={"border-black bg-gray-200 p-2 rounded-md w-full"}
className={"border-black bg-gray-200 rounded-md w-full"}
/>
</Selector>

7
frontend/src/components/video/Playbar.tsx
View File

@@ -76,7 +76,7 @@ export default function Playbar({ video, videoMetadata, className }: Props) {
}, [video]);
return (
<div className={clsx("flex justify-between items-center p-2 rounded-lg", className)}>
<div className={clsx("flex justify-between items-center mb-2", className)}>
<div className={"flex gap-1"}>
<Icon size={24} />
<input
@@ -88,7 +88,10 @@ export default function Playbar({ video, videoMetadata, className }: Props) {
className={"w-20"}
/>
</div>
<button onClick={togglePlay}>
<button
onClick={togglePlay}
className={"hover:bg-gray-300 rounded-full p-1"}
>
{isPlaying ? <Pause size={24} /> : <Play size={24} />}
</button>
{videoMetadata.endPoint &&