diff options
Diffstat (limited to 'apps/web/src/components/footer.tsx')
| -rw-r--r-- | apps/web/src/components/footer.tsx | 246 |
1 files changed, 123 insertions, 123 deletions
diff --git a/apps/web/src/components/footer.tsx b/apps/web/src/components/footer.tsx index 5b7f2303..1385e377 100644 --- a/apps/web/src/components/footer.tsx +++ b/apps/web/src/components/footer.tsx @@ -8,133 +8,133 @@ import { getStars } from "@/lib/fetch-github-stars"; import Image from "next/image"; export function Footer() { - const [star, setStar] = useState<string>(); + const [star, setStar] = useState<string>(); - useEffect(() => { - const fetchStars = async () => { - try { - const data = await getStars(); - setStar(data); - } catch (err) { - console.error("Failed to fetch GitHub stars", err); - } - }; + useEffect(() => { + const fetchStars = async () => { + try { + const data = await getStars(); + setStar(data); + } catch (err) { + console.error("Failed to fetch GitHub stars", err); + } + }; - fetchStars(); - }, []); + fetchStars(); + }, []); - return ( - <motion.footer - className="bg-background border-t" - initial={{ opacity: 0 }} - animate={{ opacity: 1 }} - transition={{ delay: 0.8, duration: 0.8 }} - > - <div className="max-w-5xl mx-auto px-8 py-10"> - <div className="grid grid-cols-1 md:grid-cols-2 gap-12 mb-8"> - {/* Brand Section */} - <div className="md:col-span-1 max-w-sm"> - <div className="flex justify-start items-center gap-2 mb-4"> - <Image src="/logo.svg" alt="OpenCut" width={24} height={24} /> - <span className="font-bold text-lg">OpenCut</span> - </div> - <p className="text-sm md:text-left text-muted-foreground mb-5"> - The open source video editor that gets the job done. Simple, - powerful, and works on any platform. - </p> - <div className="flex justify-start gap-3"> - <Link - href="https://github.com/OpenCut-app/OpenCut" - className="text-muted-foreground hover:text-foreground transition-colors" - target="_blank" - rel="noopener noreferrer" - > - <RiGithubLine className="h-5 w-5" /> - </Link> - <Link - href="https://x.com/OpenCutApp" - className="text-muted-foreground hover:text-foreground transition-colors" - target="_blank" - rel="noopener noreferrer" - > - <RiTwitterXLine className="h-5 w-5" /> - </Link> - <Link - href="https://discord.com/invite/Mu3acKZvCp" - className="text-muted-foreground hover:text-foreground transition-colors" - target="_blank" - rel="noopener noreferrer" - > - <RiDiscordFill className="h-5 w-5" /> - </Link> - </div> - </div> + return ( + <motion.footer + className="bg-background border-t" + initial={{ opacity: 0 }} + animate={{ opacity: 1 }} + transition={{ delay: 0.8, duration: 0.8 }} + > + <div className="max-w-5xl mx-auto px-8 py-10"> + <div className="grid grid-cols-1 md:grid-cols-2 gap-12 mb-8"> + {/* Brand Section */} + <div className="md:col-span-1 max-w-sm"> + <div className="flex justify-start items-center gap-2 mb-4"> + <Image src="/logo.svg" alt="OpenCut" width={24} height={24} /> + <span className="font-bold text-lg">OpenCut</span> + </div> + <p className="text-sm md:text-left text-muted-foreground mb-5"> + The open source video editor that gets the job done. Simple, + powerful, and works on any platform. + </p> + <div className="flex justify-start gap-3"> + <Link + href="https://github.com/OpenCut-app/OpenCut" + className="text-muted-foreground hover:text-foreground transition-colors" + target="_blank" + rel="noopener noreferrer" + > + <RiGithubLine className="h-5 w-5" /> + </Link> + <Link + href="https://x.com/OpenCutApp" + className="text-muted-foreground hover:text-foreground transition-colors" + target="_blank" + rel="noopener noreferrer" + > + <RiTwitterXLine className="h-5 w-5" /> + </Link> + <Link + href="https://discord.com/invite/Mu3acKZvCp" + className="text-muted-foreground hover:text-foreground transition-colors" + target="_blank" + rel="noopener noreferrer" + > + <RiDiscordFill className="h-5 w-5" /> + </Link> + </div> + </div> - <div className="flex gap-12 justify-start items-start py-2"> - <div> - <h3 className="font-semibold text-foreground mb-4">Resources</h3> - <ul className="space-y-2 text-sm"> - <li> - <Link - href="/roadmap" - className="text-muted-foreground hover:text-foreground transition-colors" - > - Roadmap - </Link> - </li> - <li> - <Link - href="/privacy" - className="text-muted-foreground hover:text-foreground transition-colors" - > - Privacy policy - </Link> - </li> - <li> - <Link - href="/terms" - className="text-muted-foreground hover:text-foreground transition-colors" - > - Terms of use - </Link> - </li> - </ul> - </div> + <div className="flex gap-12 justify-start items-start py-2"> + <div> + <h3 className="font-semibold text-foreground mb-4">Resources</h3> + <ul className="space-y-2 text-sm"> + <li> + <Link + href="/roadmap" + className="text-muted-foreground hover:text-foreground transition-colors" + > + Roadmap + </Link> + </li> + <li> + <Link + href="/privacy" + className="text-muted-foreground hover:text-foreground transition-colors" + > + Privacy policy + </Link> + </li> + <li> + <Link + href="/terms" + className="text-muted-foreground hover:text-foreground transition-colors" + > + Terms of use + </Link> + </li> + </ul> + </div> - {/* Company Links */} - <div> - <h3 className="font-semibold text-foreground mb-4">Company</h3> - <ul className="space-y-2 text-sm"> - <li> - <Link - href="/contributors" - className="text-muted-foreground hover:text-foreground transition-colors" - > - Contributors - </Link> - </li> - <li> - <Link - href="https://github.com/OpenCut-app/OpenCut/blob/main/README.md" - className="text-muted-foreground hover:text-foreground transition-colors" - target="_blank" - rel="noopener noreferrer" - > - About - </Link> - </li> - </ul> - </div> - </div> - </div> + {/* Company Links */} + <div> + <h3 className="font-semibold text-foreground mb-4">Company</h3> + <ul className="space-y-2 text-sm"> + <li> + <Link + href="/contributors" + className="text-muted-foreground hover:text-foreground transition-colors" + > + Contributors + </Link> + </li> + <li> + <Link + href="https://github.com/OpenCut-app/OpenCut/blob/main/README.md" + className="text-muted-foreground hover:text-foreground transition-colors" + target="_blank" + rel="noopener noreferrer" + > + About + </Link> + </li> + </ul> + </div> + </div> + </div> - {/* Bottom Section */} - <div className="pt-2 flex flex-col md:flex-row justify-between items-start gap-4"> - <div className="flex items-center gap-4 text-sm text-muted-foreground"> - <span>© 2025 OpenCut, All Rights Reserved</span> - </div> - </div> - </div> - </motion.footer> - ); + {/* Bottom Section */} + <div className="pt-2 flex flex-col md:flex-row justify-between items-start gap-4"> + <div className="flex items-center gap-4 text-sm text-muted-foreground"> + <span>© 2025 OpenCut, All Rights Reserved</span> + </div> + </div> + </div> + </motion.footer> + ); } |