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

REFACTOR for consistent syntax

Browse Source
This commit is contained in:
Dylan De Faoite
2025-06-25 17:04:18 +02:00
parent 7c64649c22
commit 9c2fb9b710
6 changed files with 16 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/Dropdown.tsx
View File

@@ -47,12 +47,12 @@ const Dropdown = ({ label, children, className }: DropdownProps) => {
ref={ref}>
<button
onClick={toggleDropdown}
className="inline-flex justify-between w-full rounded-xl px-4 py-2 bg-white text-sm font-medium text-gray-600 hover:bg-gray-50"
className={"inline-flex justify-between w-full rounded-xl px-4 py-2 bg-white text-sm font-medium text-gray-600 hover:bg-gray-50"}
>
{label}
</button>
{isOpen && (
<ul className="absolute w-48 origin-top-right rounded-md bg-white shadow-lg font-medium">
<ul className={"absolute w-48 origin-top-right rounded-md bg-white shadow-lg font-medium"}>
{children}
</ul>
)}

2
frontend/src/components/Selector.tsx
View File

@@ -12,7 +12,7 @@ const Selector = ({children, label}: props) => {
className={"w-full"}>
{ label }
</label>
<div className="w-px h-6 bg-gray-400 mx-3" />
<div className={"w-px h-6 bg-gray-400 mx-3"} />
{children}
</div>
)

4
frontend/src/components/Topbar.tsx
View File

@@ -31,7 +31,9 @@ const Topbar = ({sidebarToggled, setSidebarToggled, user, className}: props) =>
/>
<Dropdown label={user.name}>
<DropdownItem item="Logout" onClick={() => globalThis.location.href = logoutUrl} className={"text-red-500 font-medium"} />
<DropdownItem item="Logout"
onClick={() => globalThis.location.href = logoutUrl}
className={"text-red-500 font-medium"} />
</Dropdown>
</div>
) :

2
frontend/src/layouts/MainLayout.tsx
View File

@@ -29,7 +29,7 @@ const MainLayout = () => {
user={user}
className={`row-span-2 transition-all duration-300 overflow-hidden whitespace-nowrap ${sidebarToggled ? "-translate-x-full" : "translate-x-0"}`}/>
<Topbar
className="transition-all duration-300"
className={"transition-all duration-300"}
sidebarToggled={sidebarToggled}
setSidebarToggled={setSidebarToggled}
user={user}/>

2
frontend/src/pages/ClipEdit.tsx
View File

@@ -129,7 +129,7 @@ const ClipEdit = () => {
/>
{error && (
<div className="text-red-600 text-center mt-2">
<div className={"text-red-600 text-center mt-2"}>
{error}
</div>
)}

16
frontend/src/pages/Home.tsx
View File

@@ -1,39 +1,39 @@
const Home = () => {
return (
<div className="max-h-screen flex flex-col justify-center items-center px-6 py-12 text-gray-900">
<div className={"max-h-screen flex flex-col justify-center items-center px-6 py-12 text-gray-900"}>
{/* Logo */}
<img
src="/logo.png"
alt="VoD System Logo"
className="h-44 mb-8 object-contain"
className={"h-44 mb-8 object-contain"}
/>
{/* Description Container */}
<div className="max-w-xl text-center">
<h2 className="text-3xl font-semibold mb-6 text-gray-700">
<div className={"max-w-xl text-center"}>
<h2 className={"text-3xl font-semibold mb-6 text-gray-700"}>
What is the VoD System?
</h2>
<p className="text-lg leading-relaxed text-gray-600 mb-6">
<p className={"text-lg leading-relaxed text-gray-600 mb-6"}>
The VoD System is a powerful clip management platform designed to streamline how you
handle your video content. Whether you're a content creator, streamer, or educator,
VoD System lets you:
</p>
<ul className="list-disc list-inside text-gray-600 mb-8 space-y-2">
<ul className={"list-disc list-inside text-gray-600 mb-8 space-y-2"}>
<li>Upload clips effortlessly and securely.</li>
<li>Edit and trim videos with intuitive controls.</li>
<li>Compress files to specific file sizes.</li>
<li>Organize your clips for quick access and sharing.</li>
</ul>
<p className="text-lg leading-relaxed text-gray-600">
<p className={"text-lg leading-relaxed text-gray-600"}>
Designed with simplicity and efficiency in mind, VoD System adapts to your workflow,
making video clip management faster and more enjoyable than ever.
</p>
</div>
{/* File Support Note */}
<div className="bg-gray-100 border border-gray-300 rounded-md p-4 text-sm text-gray-500 max-w-md mx-auto">
<div className={"bg-gray-100 border border-gray-300 rounded-md p-4 text-sm text-gray-500 max-w-md mx-auto"}>
<strong>Note:</strong> Currently, only <code>.mp4</code> files are supported for upload and processing.
Support for additional video formats will be added in future updates.
</div>