mirror of
https://github.com/MacRimi/ProxMenux.git
synced 2025-06-28 12:16:53 +00:00
update
This commit is contained in:
MacRimi
parent
fe7fb6b0a9
commit
51aa442386
@ -1,18 +0,0 @@
|
|||||||
import { Button } from "@/components/ui/button"
|
|
||||||
|
|
||||||
export default function CTA() {
|
|
||||||
return (
|
|
||||||
<section className="py-20 bg-primary text-white">
|
|
||||||
<div className="container mx-auto text-center">
|
|
||||||
<h2 className="text-3xl font-bold mb-6">Ready to Streamline Your Workflow?</h2>
|
|
||||||
<p className="text-xl mb-8 max-w-2xl mx-auto">
|
|
||||||
Join thousands of teams already using StreamLine to boost their productivity.
|
|
||||||
</p>
|
|
||||||
<Button size="lg" variant="secondary">
|
|
||||||
Start Your Free Trial
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,41 +0,0 @@
|
|||||||
"use client"
|
|
||||||
|
|
||||||
import type React from "react"
|
|
||||||
import { useState } from "react"
|
|
||||||
import { Copy, Check } from "lucide-react"
|
|
||||||
|
|
||||||
interface CopyableCodeProps {
|
|
||||||
code: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const CopyableCode: React.FC<CopyableCodeProps> = ({ code }) => {
|
|
||||||
const [isCopied, setIsCopied] = useState(false)
|
|
||||||
|
|
||||||
const copyToClipboard = async () => {
|
|
||||||
try {
|
|
||||||
await navigator.clipboard.writeText(code)
|
|
||||||
setIsCopied(true)
|
|
||||||
setTimeout(() => setIsCopied(false), 2000)
|
|
||||||
} catch (err) {
|
|
||||||
console.error("Failed to copy text: ", err)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="relative">
|
|
||||||
<pre className="bg-gray-100 p-4 rounded-md overflow-x-auto">
|
|
||||||
<code>{code}</code>
|
|
||||||
</pre>
|
|
||||||
<button
|
|
||||||
onClick={copyToClipboard}
|
|
||||||
className="absolute top-2 right-2 p-2 bg-white rounded-md shadow-sm hover:bg-gray-100 transition-colors"
|
|
||||||
aria-label="Copy to clipboard"
|
|
||||||
>
|
|
||||||
{isCopied ? <Check className="h-5 w-5 text-green-500" /> : <Copy className="h-5 w-5 text-gray-500" />}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default CopyableCode
|
|
||||||
|
|
||||||
@ -1,36 +0,0 @@
|
|||||||
import Link from "next/link"
|
|
||||||
import { usePathname } from "next/navigation"
|
|
||||||
|
|
||||||
const sidebarItems = [
|
|
||||||
{ title: "Introduction", href: "/docs/introduction" },
|
|
||||||
{ title: "Installation", href: "/docs/installation" },
|
|
||||||
{ title: "Getting Started", href: "/docs/getting-started" },
|
|
||||||
{ title: "Features", href: "/docs/features" },
|
|
||||||
{ title: "API", href: "/docs/api" },
|
|
||||||
{ title: "FAQ", href: "/docs/faq" },
|
|
||||||
]
|
|
||||||
|
|
||||||
export default function DocSidebar() {
|
|
||||||
const pathname = usePathname()
|
|
||||||
|
|
||||||
return (
|
|
||||||
<nav className="w-64 bg-gray-100 p-6">
|
|
||||||
<h2 className="text-lg font-semibold mb-4">Documentation</h2>
|
|
||||||
<ul className="space-y-2">
|
|
||||||
{sidebarItems.map((item) => (
|
|
||||||
<li key={item.href}>
|
|
||||||
<Link
|
|
||||||
href={item.href}
|
|
||||||
className={`block p-2 rounded ${
|
|
||||||
pathname === item.href ? "bg-blue-500 text-white" : "text-gray-700 hover:bg-gray-200"
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
{item.title}
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,44 +0,0 @@
|
|||||||
import { CheckCircle, Zap, Users, TrendingUp } from "lucide-react"
|
|
||||||
|
|
||||||
const features = [
|
|
||||||
{
|
|
||||||
icon: <CheckCircle className="h-8 w-8 text-primary" />,
|
|
||||||
title: "Task Management",
|
|
||||||
description: "Organize and prioritize tasks with ease.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: <Zap className="h-8 w-8 text-primary" />,
|
|
||||||
title: "Real-time Collaboration",
|
|
||||||
description: "Work together seamlessly in real-time.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: <Users className="h-8 w-8 text-primary" />,
|
|
||||||
title: "Team Communication",
|
|
||||||
description: "Stay connected with built-in messaging.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: <TrendingUp className="h-8 w-8 text-primary" />,
|
|
||||||
title: "Analytics Dashboard",
|
|
||||||
description: "Track progress and gain insights with powerful analytics.",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
export default function Features() {
|
|
||||||
return (
|
|
||||||
<section id="features" className="py-20 bg-gray-50">
|
|
||||||
<div className="container mx-auto">
|
|
||||||
<h2 className="text-3xl font-bold text-center mb-12">Key Features</h2>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
|
|
||||||
{features.map((feature, index) => (
|
|
||||||
<div key={index} className="bg-white p-6 rounded-lg shadow-md">
|
|
||||||
<div className="mb-4">{feature.icon}</div>
|
|
||||||
<h3 className="text-xl font-semibold mb-2">{feature.title}</h3>
|
|
||||||
<p className="text-gray-600">{feature.description}</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,76 +0,0 @@
|
|||||||
import Link from "next/link"
|
|
||||||
import { Facebook, Twitter, Instagram, Linkedin } from "lucide-react"
|
|
||||||
|
|
||||||
export default function Footer() {
|
|
||||||
return (
|
|
||||||
<footer className="bg-gray-900 text-white py-12">
|
|
||||||
<div className="container mx-auto grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
||||||
<div>
|
|
||||||
<h3 className="text-lg font-semibold mb-4">StreamLine</h3>
|
|
||||||
<p className="text-gray-400">Streamlining your workflow, one task at a time.</p>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h4 className="text-lg font-semibold mb-4">Product</h4>
|
|
||||||
<ul className="space-y-2">
|
|
||||||
<li>
|
|
||||||
<Link href="#features" className="text-gray-400 hover:text-white">
|
|
||||||
Features
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<Link href="#pricing" className="text-gray-400 hover:text-white">
|
|
||||||
Pricing
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
Integrations
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h4 className="text-lg font-semibold mb-4">Company</h4>
|
|
||||||
<ul className="space-y-2">
|
|
||||||
<li>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
About Us
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
Careers
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
Contact
|
|
||||||
</Link>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h4 className="text-lg font-semibold mb-4">Connect</h4>
|
|
||||||
<div className="flex space-x-4">
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
<Facebook className="h-6 w-6" />
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
<Twitter className="h-6 w-6" />
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
<Instagram className="h-6 w-6" />
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-gray-400 hover:text-white">
|
|
||||||
<Linkedin className="h-6 w-6" />
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="container mx-auto mt-8 pt-8 border-t border-gray-800 text-center text-gray-400">
|
|
||||||
<p>© 2025 StreamLine. All rights reserved.</p>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,27 +0,0 @@
|
|||||||
import Link from "next/link"
|
|
||||||
import { Button } from "@/components/ui/button"
|
|
||||||
|
|
||||||
export default function Header() {
|
|
||||||
return (
|
|
||||||
<header className="py-4 px-6 bg-white shadow-sm">
|
|
||||||
<div className="container mx-auto flex justify-between items-center">
|
|
||||||
<Link href="/" className="text-2xl font-bold text-primary">
|
|
||||||
StreamLine
|
|
||||||
</Link>
|
|
||||||
<nav className="hidden md:flex space-x-6">
|
|
||||||
<Link href="#features" className="text-gray-600 hover:text-primary">
|
|
||||||
Features
|
|
||||||
</Link>
|
|
||||||
<Link href="#testimonials" className="text-gray-600 hover:text-primary">
|
|
||||||
Testimonials
|
|
||||||
</Link>
|
|
||||||
<Link href="#pricing" className="text-gray-600 hover:text-primary">
|
|
||||||
Pricing
|
|
||||||
</Link>
|
|
||||||
</nav>
|
|
||||||
<Button>Get Started</Button>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { Button } from "@/components/ui/button"
|
|
||||||
|
|
||||||
export default function Hero() {
|
|
||||||
return (
|
|
||||||
<div className="relative pt-32 pb-20 sm:pt-40 sm:pb-24">
|
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
||||||
<h1 className="text-4xl sm:text-6xl lg:text-7xl font-bold tracking-tight mb-8">
|
|
||||||
Everything App
|
|
||||||
<br />
|
|
||||||
<span className="text-gray-400">for your teams</span>
|
|
||||||
</h1>
|
|
||||||
<p className="max-w-2xl mx-auto text-lg sm:text-xl text-gray-400 mb-10">
|
|
||||||
Huly, an open-source platform, serves as an all-in-one replacement of Linear, Jira, Slack, and Notion.
|
|
||||||
</p>
|
|
||||||
<Button className="relative group px-8 py-6 text-lg bg-gradient-to-r from-primary to-accent hover:opacity-90">
|
|
||||||
<span className="relative z-10">Try it free</span>
|
|
||||||
<div className="absolute inset-0 bg-white/20 blur-lg group-hover:blur-xl transition-all duration-300 opacity-0 group-hover:opacity-100" />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,47 +0,0 @@
|
|||||||
import Link from "next/link"
|
|
||||||
import { Button } from "@/components/ui/button"
|
|
||||||
|
|
||||||
export default function Navbar() {
|
|
||||||
return (
|
|
||||||
<nav className="fixed top-0 left-0 right-0 z-50 bg-background/80 backdrop-blur-md border-b border-white/10">
|
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
||||||
<div className="flex items-center justify-between h-16">
|
|
||||||
<div className="flex items-center">
|
|
||||||
<Link
|
|
||||||
href="/"
|
|
||||||
className="text-2xl font-bold bg-gradient-to-r from-primary to-accent bg-clip-text text-transparent"
|
|
||||||
>
|
|
||||||
StreamLine
|
|
||||||
</Link>
|
|
||||||
<div className="hidden md:block ml-10">
|
|
||||||
<div className="flex items-center space-x-8">
|
|
||||||
<Link href="#" className="text-sm text-gray-300 hover:text-white">
|
|
||||||
Pricing
|
|
||||||
</Link>
|
|
||||||
<Link href="/docs" className="text-sm text-gray-300 hover:text-white">
|
|
||||||
Docs
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-sm text-gray-300 hover:text-white">
|
|
||||||
Resources
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-sm text-gray-300 hover:text-white">
|
|
||||||
Community
|
|
||||||
</Link>
|
|
||||||
<Link href="#" className="text-sm text-gray-300 hover:text-white">
|
|
||||||
Download
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center space-x-4">
|
|
||||||
<Button variant="ghost" className="text-sm">
|
|
||||||
Sign In
|
|
||||||
</Button>
|
|
||||||
<Button className="text-sm bg-gradient-to-r from-primary to-accent hover:opacity-90">Get Started</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
import { Check } from "lucide-react"
|
|
||||||
import { Button } from "@/components/ui/button"
|
|
||||||
|
|
||||||
const plans = [
|
|
||||||
{
|
|
||||||
name: "Basic",
|
|
||||||
price: "$9",
|
|
||||||
features: ["5 team members", "10 projects", "Basic analytics", "Email support"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Pro",
|
|
||||||
price: "$29",
|
|
||||||
features: ["Unlimited team members", "Unlimited projects", "Advanced analytics", "Priority support"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Enterprise",
|
|
||||||
price: "Custom",
|
|
||||||
features: ["Custom features", "Dedicated account manager", "On-premise deployment", "24/7 phone support"],
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
export default function Pricing() {
|
|
||||||
return (
|
|
||||||
<section id="pricing" className="py-20 bg-gray-50">
|
|
||||||
<div className="container mx-auto">
|
|
||||||
<h2 className="text-3xl font-bold text-center mb-12">Choose Your Plan</h2>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
||||||
{plans.map((plan, index) => (
|
|
||||||
<div key={index} className="bg-white p-8 rounded-lg shadow-md">
|
|
||||||
<h3 className="text-2xl font-bold mb-4">{plan.name}</h3>
|
|
||||||
<p className="text-4xl font-bold mb-6">
|
|
||||||
{plan.price}
|
|
||||||
<span className="text-lg font-normal text-gray-600">/month</span>
|
|
||||||
</p>
|
|
||||||
<ul className="mb-8">
|
|
||||||
{plan.features.map((feature, featureIndex) => (
|
|
||||||
<li key={featureIndex} className="flex items-center mb-2">
|
|
||||||
<Check className="h-5 w-5 text-primary mr-2" />
|
|
||||||
<span>{feature}</span>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
<Button className="w-full" variant={index === 1 ? "default" : "outline"}>
|
|
||||||
{index === 2 ? "Contact Sales" : "Get Started"}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
import Image from "next/image"
|
|
||||||
|
|
||||||
export default function ProductPreview() {
|
|
||||||
return (
|
|
||||||
<div className="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-20">
|
|
||||||
<div className="relative rounded-lg overflow-hidden border border-white/10 shadow-2xl">
|
|
||||||
<div className="absolute inset-0 bg-gradient-to-tr from-primary/10 via-accent/10 to-transparent" />
|
|
||||||
<Image
|
|
||||||
src="https://sjc.microlink.io/dACoBD81V0jhbU_TaUYiRrOVrhAXOh8TCYVdXmvVaYFIpbvF9B17bU0pnQF3gHfzVAOFzC-nwZVACScUpFYQsg.jpeg"
|
|
||||||
alt="Huly App Interface"
|
|
||||||
width={1200}
|
|
||||||
height={800}
|
|
||||||
className="w-full h-auto"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/* Glow effect */}
|
|
||||||
<div className="absolute -inset-x-20 top-0 h-[500px] bg-gradient-conic opacity-30 blur-3xl" />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,37 +0,0 @@
|
|||||||
const testimonials = [
|
|
||||||
{
|
|
||||||
quote: "StreamLine has revolutionized our team's workflow. It's a game-changer!",
|
|
||||||
author: "Jane Doe",
|
|
||||||
company: "Tech Innovators Inc.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
quote: "The best project management tool we've ever used. Highly recommended!",
|
|
||||||
author: "John Smith",
|
|
||||||
company: "Creative Solutions LLC",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
quote: "StreamLine helped us increase productivity by 40%. It's incredible!",
|
|
||||||
author: "Emily Johnson",
|
|
||||||
company: "Startup Ventures",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
export default function Testimonials() {
|
|
||||||
return (
|
|
||||||
<section id="testimonials" className="py-20 bg-white">
|
|
||||||
<div className="container mx-auto">
|
|
||||||
<h2 className="text-3xl font-bold text-center mb-12">What Our Customers Say</h2>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
||||||
{testimonials.map((testimonial, index) => (
|
|
||||||
<div key={index} className="bg-gray-50 p-6 rounded-lg">
|
|
||||||
<p className="text-lg mb-4">"{testimonial.quote}"</p>
|
|
||||||
<p className="font-semibold">{testimonial.author}</p>
|
|
||||||
<p className="text-sm text-gray-600">{testimonial.company}</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -2,6 +2,7 @@ import "./globals.css"
|
|||||||
import { Inter } from "next/font/google"
|
import { Inter } from "next/font/google"
|
||||||
import Navbar from "@/components/navbar"
|
import Navbar from "@/components/navbar"
|
||||||
import MouseMoveEffect from "@/components/mouse-move-effect"
|
import MouseMoveEffect from "@/components/mouse-move-effect"
|
||||||
|
import DocSidebar from "@/components/DocSidebar"
|
||||||
import type React from "react"
|
import type React from "react"
|
||||||
import type { Metadata } from "next"
|
import type { Metadata } from "next"
|
||||||
|
|
||||||
@ -66,7 +67,10 @@ export default function RootLayout({
|
|||||||
<body className={`${inter.className} bg-background text-foreground antialiased`}>
|
<body className={`${inter.className} bg-background text-foreground antialiased`}>
|
||||||
<Navbar />
|
<Navbar />
|
||||||
<MouseMoveEffect />
|
<MouseMoveEffect />
|
||||||
<div className="pt-16 md:pt-16">{children}</div>
|
<div className="flex flex-col md:flex-row min-h-screen">
|
||||||
|
<DocSidebar />
|
||||||
|
<main className="flex-1 p-4 md:p-6 pt-32 md:pt-6">{children}</main>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
)
|
)
|
||||||
|
|||||||
@ -128,9 +128,9 @@ export default function DocSidebar() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="md:hidden fixed top-16 left-0 right-0 z-40 bg-gray-100 border-b border-gray-200">
|
<div className="md:hidden fixed top-16 left-0 right-0 z-40 bg-gray-100 border-b border-gray-200 h-12">
|
||||||
<button
|
<button
|
||||||
className="w-full p-4 text-left flex items-center justify-between"
|
className="w-full h-full px-4 text-left flex items-center justify-between"
|
||||||
onClick={toggleMobileMenu}
|
onClick={toggleMobileMenu}
|
||||||
aria-label="Toggle menu"
|
aria-label="Toggle menu"
|
||||||
>
|
>
|
||||||
@ -139,7 +139,7 @@ export default function DocSidebar() {
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<nav
|
<nav
|
||||||
className={`fixed md:static top-[104px] left-0 w-full h-[calc(100vh-104px)] md:h-auto md:w-64 bg-gray-100 p-4 md:p-6 transform ${
|
className={`fixed md:static top-[112px] left-0 w-full h-[calc(100vh-112px)] md:h-auto md:w-64 bg-gray-100 p-4 md:p-6 transform ${
|
||||||
isMobileMenuOpen ? "translate-y-0" : "-translate-y-full"
|
isMobileMenuOpen ? "translate-y-0" : "-translate-y-full"
|
||||||
} md:translate-y-0 transition-transform duration-300 ease-in-out overflow-y-auto z-30`}
|
} md:translate-y-0 transition-transform duration-300 ease-in-out overflow-y-auto z-30`}
|
||||||
>
|
>
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 605 KiB After Width: | Height: | Size: 739 KiB |
Loading…
x
Reference in New Issue
Block a user