feat: add dedicated About page (#624)
Creates a new /about page with: - Project mission and vision - Key features overview - Open source information - Community links - Call to action Updates footer to link to /about instead of GitHub README. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Abelino Chavez
parent
147f473fd3
commit
de5293b024
|
|
@ -0,0 +1,133 @@
|
|||
import type { Metadata } from "next";
|
||||
import Link from "next/link";
|
||||
import { BasePage } from "@/app/base-page";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { SOCIAL_LINKS } from "@/constants/site-constants";
|
||||
import { ArrowRight } from "lucide-react";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "About - OpenCut",
|
||||
description:
|
||||
"OpenCut is a free, open-source video editor built for privacy and simplicity. Edit videos directly in your browser without uploading to servers.",
|
||||
openGraph: {
|
||||
title: "About - OpenCut",
|
||||
description:
|
||||
"OpenCut is a free, open-source video editor built for privacy and simplicity. Edit videos directly in your browser without uploading to servers.",
|
||||
type: "website",
|
||||
},
|
||||
};
|
||||
|
||||
export default function AboutPage() {
|
||||
return (
|
||||
<BasePage
|
||||
title="About OpenCut"
|
||||
description="A free, open-source video editor that respects your privacy and gets the job done."
|
||||
>
|
||||
<section className="flex flex-col gap-4">
|
||||
<h2 className="text-2xl font-semibold">Our Mission</h2>
|
||||
<p>
|
||||
OpenCut was created to provide a powerful video editing experience
|
||||
that doesn't compromise on privacy. We believe that editing your
|
||||
videos should be simple, fast, and free from data collection.
|
||||
</p>
|
||||
<p>
|
||||
Your videos stay on your device. No uploads to external servers for
|
||||
basic editing. No tracking of your content. Just a clean, efficient
|
||||
editor that works anywhere.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section className="flex flex-col gap-4">
|
||||
<h2 className="text-2xl font-semibold">Key Features</h2>
|
||||
<ul className="list-disc space-y-2 pl-6">
|
||||
<li>
|
||||
<strong>Privacy-first:</strong> Basic editing happens entirely in
|
||||
your browser - your files never leave your device
|
||||
</li>
|
||||
<li>
|
||||
<strong>Multi-track timeline:</strong> Arrange video, audio, and
|
||||
images across multiple tracks with precision
|
||||
</li>
|
||||
<li>
|
||||
<strong>Real-time preview:</strong> See your edits instantly without
|
||||
waiting for renders
|
||||
</li>
|
||||
<li>
|
||||
<strong>Cross-platform:</strong> Works on any device with a modern
|
||||
web browser
|
||||
</li>
|
||||
<li>
|
||||
<strong>Open source:</strong> Fully transparent code you can audit,
|
||||
modify, or self-host
|
||||
</li>
|
||||
<li>
|
||||
<strong>Free forever:</strong> No subscriptions, no paywalls, no
|
||||
hidden costs
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section className="flex flex-col gap-4">
|
||||
<h2 className="text-2xl font-semibold">Open Source</h2>
|
||||
<p>
|
||||
OpenCut is completely open source under the MIT license. This means
|
||||
you can view, modify, and distribute the code freely. We believe in
|
||||
transparency and community-driven development.
|
||||
</p>
|
||||
<p>
|
||||
Our source code is available on GitHub, where you can report issues,
|
||||
suggest features, or contribute code. Every contribution helps make
|
||||
OpenCut better for everyone.
|
||||
</p>
|
||||
<div className="flex gap-4 pt-2">
|
||||
<Button variant="outline" asChild>
|
||||
<Link href={SOCIAL_LINKS.github} target="_blank" rel="noopener">
|
||||
View on GitHub
|
||||
<ArrowRight className="ml-1 size-4" />
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="flex flex-col gap-4">
|
||||
<h2 className="text-2xl font-semibold">Community</h2>
|
||||
<p>
|
||||
Join our growing community of creators, developers, and video editing
|
||||
enthusiasts. Whether you need help, want to share your creations, or
|
||||
are interested in contributing, we'd love to have you.
|
||||
</p>
|
||||
<div className="flex flex-wrap gap-4 pt-2">
|
||||
<Button variant="outline" asChild>
|
||||
<Link href={SOCIAL_LINKS.discord} target="_blank" rel="noopener">
|
||||
Join Discord
|
||||
</Link>
|
||||
</Button>
|
||||
<Button variant="outline" asChild>
|
||||
<Link href={SOCIAL_LINKS.x} target="_blank" rel="noopener">
|
||||
Follow on X
|
||||
</Link>
|
||||
</Button>
|
||||
<Button variant="outline" asChild>
|
||||
<Link href="/contributors">View Contributors</Link>
|
||||
</Button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="flex flex-col gap-4">
|
||||
<h2 className="text-2xl font-semibold">Get Started</h2>
|
||||
<p>
|
||||
Ready to start editing? OpenCut runs directly in your browser - no
|
||||
downloads or installations required.
|
||||
</p>
|
||||
<div className="pt-2">
|
||||
<Button variant="foreground" asChild>
|
||||
<Link href="/projects">
|
||||
Start Editing
|
||||
<ArrowRight className="ml-1 size-4" />
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
</section>
|
||||
</BasePage>
|
||||
);
|
||||
}
|
||||
|
|
@ -25,7 +25,7 @@ const links: CategoryLinks = {
|
|||
{ label: "Contributors", href: "/contributors" },
|
||||
{ label: "Sponsors", href: "/sponsors" },
|
||||
{ label: "Branding", href: "/branding" },
|
||||
{ label: "About", href: `${SOCIAL_LINKS.github}/blob/main/README.md` },
|
||||
{ label: "About", href: "/about" },
|
||||
],
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue