From b38479751d60e4081603c565cdf6b66e27089de3 Mon Sep 17 00:00:00 2001 From: "HanuCh@udhary" <137854084+hanuchaudhary@users.noreply.github.com> Date: Fri, 7 Feb 2025 21:15:11 +0530 Subject: [PATCH 1/7] New Landing --- app/layout.tsx | 23 +- app/page.tsx | 499 ++++++++++-------- components/DashboardV2/BenefitsSection.tsx | 86 +++ components/DashboardV2/CommunitySection.tsx | 47 ++ components/DashboardV2/ContactSection.tsx | 245 +++++++++ components/DashboardV2/FAQSection.tsx | 72 +++ components/DashboardV2/FeaturesSection.tsx | 92 ++++ components/DashboardV2/FooterSection.tsx | 119 +++++ components/DashboardV2/HeroSection.tsx | 75 +++ components/DashboardV2/Icons/DiscordIcon.tsx | 20 + components/DashboardV2/Icons/GithubIcon.tsx | 18 + components/DashboardV2/Icons/LinkedinIcon.tsx | 19 + components/DashboardV2/Icons/XIcon.tsx | 18 + components/DashboardV2/PricingSection.tsx | 140 +++++ components/DashboardV2/ServicesSection.tsx | 81 +++ components/DashboardV2/SponsorsSection.tsx | 75 +++ components/DashboardV2/TeamSection.tsx | 244 +++++++++ components/DashboardV2/TestimonialSection.tsx | 141 +++++ components/DashboardV2/ToggleTheme.tsx | 27 + components/DashboardV2/V2Navbar.tsx | 191 +++++++ components/ui/avatar.tsx | 50 ++ components/ui/navigation-menu.tsx | 128 +++++ components/ui/textarea.tsx | 22 + package-lock.json | 230 +++++++- package.json | 3 + 25 files changed, 2431 insertions(+), 234 deletions(-) create mode 100644 components/DashboardV2/BenefitsSection.tsx create mode 100644 components/DashboardV2/CommunitySection.tsx create mode 100644 components/DashboardV2/ContactSection.tsx create mode 100644 components/DashboardV2/FAQSection.tsx create mode 100644 components/DashboardV2/FeaturesSection.tsx create mode 100644 components/DashboardV2/FooterSection.tsx create mode 100644 components/DashboardV2/HeroSection.tsx create mode 100644 components/DashboardV2/Icons/DiscordIcon.tsx create mode 100644 components/DashboardV2/Icons/GithubIcon.tsx create mode 100644 components/DashboardV2/Icons/LinkedinIcon.tsx create mode 100644 components/DashboardV2/Icons/XIcon.tsx create mode 100644 components/DashboardV2/PricingSection.tsx create mode 100644 components/DashboardV2/ServicesSection.tsx create mode 100644 components/DashboardV2/SponsorsSection.tsx create mode 100644 components/DashboardV2/TeamSection.tsx create mode 100644 components/DashboardV2/TestimonialSection.tsx create mode 100644 components/DashboardV2/ToggleTheme.tsx create mode 100644 components/DashboardV2/V2Navbar.tsx create mode 100644 components/ui/avatar.tsx create mode 100644 components/ui/navigation-menu.tsx create mode 100644 components/ui/textarea.tsx diff --git a/app/layout.tsx b/app/layout.tsx index 8d2356a..7e00d5d 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,28 +1,29 @@ -import './globals.css' -import type { Metadata } from 'next' -import { Inter } from 'next/font/google' -import { ThemeProvider } from "@/components/theme-provider" +import "./globals.css"; +import type { Metadata } from "next"; +import { Inter } from "next/font/google"; +import { ThemeProvider } from "@/components/theme-provider"; +import { V2Navbar } from "@/components/DashboardV2/V2Navbar"; -const inter = Inter({ subsets: ['latin'] }) +const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { - title: 'LeetCode Journal', - description: 'Track your LeetCode progress and boost your coding skills', -} + title: "LeetCode Journal", + description: "Track your LeetCode progress and boost your coding skills", +}; export default function RootLayout({ children, }: { - children: React.ReactNode + children: React.ReactNode; }) { return ( + {children} - ) + ); } - diff --git a/app/page.tsx b/app/page.tsx index be28c11..9b073e6 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,231 +1,286 @@ -"use client"; -import { Button } from "@/components/ui/button"; -import { cn } from "@/lib/utils"; -import { motion } from "framer-motion"; -import Navbar1 from "@/components/navbar"; -import { Tabs, TabsContent, TabsList, TabsTrigger } from "@radix-ui/react-tabs"; -import { - Card, - CardContent, - CardDescription, - CardHeader, - CardTitle, -} from "@/components/ui/card"; -import Footer from "@/components/footer"; -import { useRouter } from "next/navigation"; -import { SparklesText } from "@/components/ui/sparkles-text"; -import { BackgroundBeamsWithCollision } from "@/components/ui/background-beams-with-collision"; -import SupportSection from "@/components/ui/support-section"; +// "use client"; +// import { Button } from "@/components/ui/button"; +// import { cn } from "@/lib/utils"; +// import { motion } from "framer-motion"; +// import Navbar1 from "@/components/navbar"; +// import { Tabs, TabsContent, TabsList, TabsTrigger } from "@radix-ui/react-tabs"; +// import { +// Card, +// CardContent, +// CardDescription, +// CardHeader, +// CardTitle, +// } from "@/components/ui/card"; +// import Footer from "@/components/footer"; +// import { useRouter } from "next/navigation"; +// import { SparklesText } from "@/components/ui/sparkles-text"; +// import { BackgroundBeamsWithCollision } from "@/components/ui/background-beams-with-collision"; +// import SupportSection from "@/components/ui/support-section"; -//@ts-ignore -const Highlight = ({ children, className }) => { - const words = children.split(" "); - return ( - - +import { BenefitsSection } from "@/components/DashboardV2/BenefitsSection"; +import { CommunitySection } from "@/components/DashboardV2/CommunitySection"; +import { ContactSection } from "@/components/DashboardV2/ContactSection"; +import { FAQSection } from "@/components/DashboardV2/FAQSection"; +import { FeaturesSection } from "@/components/DashboardV2/FeaturesSection"; +import { FooterSection } from "@/components/DashboardV2/FooterSection"; +import { HeroSection } from "@/components/DashboardV2/HeroSection"; +import { PricingSection } from "@/components/DashboardV2/PricingSection"; +import { ServicesSection } from "@/components/DashboardV2/ServicesSection"; +import { SponsorsSection } from "@/components/DashboardV2/SponsorsSection"; +import { TeamSection } from "@/components/DashboardV2/TeamSection"; +import { TestimonialSection } from "@/components/DashboardV2/TestimonialSection"; - {words.map((word: any, i: any) => ( - - {word} - - ))} - - ); -}; +// //@ts-ignore +// const Highlight = ({ children, className }) => { +// const words = children.split(" "); +// return ( +// +// -//@ts-ignore -const Star = ({ style }) => ( -
- - - -
-); +// {words.map((word: any, i: any) => ( +// +// {word} +// +// ))} +// +// ); +// }; -export default function LandingPage() { - const router = useRouter(); - return ( -
- {/* Header */} - +// //@ts-ignore +// const Star = ({ style }) => ( +//
+// +// +// +//
+// ); - {/* Main Content */} -
- {/* Hero Section */} -
- - {/* */} -
-

-
- - - -
-

- - - Track Your Progress - - - -
- -

+// export default function LandingPage() { +// const router = useRouter(); +// return ( +//
+// {/* Header */} +// -

- LeetCode Journal helps you organize your problem-solving journey, - track your progress, and achieve your coding interview goals. -

+// {/* Main Content */} +//
+// {/* Hero Section */} +//
+// +// {/* */} +//
+//

+//
+// +// +// +//
+//

+// +// +// Track Your Progress +// +// +// +//
+// +//

-
- - -
-
- -
-
-
-

- Features -

- - - Track - Analyze - Improve - - - - - Problem Tracking - - Log and organize all the LeetCode problems you've - attempted and solved. - - - -

Keep a detailed record of your LeetCode journey:

-
    -
  • Mark problems as solved, attempted, or to-do
    • -
  • Add notes and solutions for future reference
    • -
  • Tag problems by difficulty, topic, or company
    • -
- - - - - - - Progress Analytics - - Visualize your progress with detailed charts and - statistics. - - - -

Gain insights into your LeetCode performance:

-
    -
  • Track solved problems over time
    • -
  • - Analyze your performance by problem type and difficulty -
    • -
  • Identify areas for improvement
    • -
- - - - - - - Skill Improvement - - Enhance your problem-solving skills with targeted - practice. - - - -

Boost your coding interview readiness:

-
    -
  • Get personalized problem recommendations
    • -
  • Access curated problem sets for specific topics
    • -
  • Track your improvement over time
    • -
- - - - -
-
- -
-
-
- ); -} +//

+// LeetCode Journal helps you organize your problem-solving journey, +// track your progress, and achieve your coding interview goals. +//

-// if (typeof document !== "undefined") { -// const style = document.createElement("style"); -// style.textContent = starStyles; -// document.head.appendChild(style); +//
+// +// +//
+//
+// +//
+//
+//
+//

+// Features +//

+// +// +// Track +// Analyze +// Improve +// +// +// +// +// Problem Tracking +// +// Log and organize all the LeetCode problems you've +// attempted and solved. +// +// +// +//

Keep a detailed record of your LeetCode journey:

+//
    +//
  • Mark problems as solved, attempted, or to-do
    • +//
  • Add notes and solutions for future reference
    • +//
  • Tag problems by difficulty, topic, or company
    • +//
+// +// +// +// +// +// +// Progress Analytics +// +// Visualize your progress with detailed charts and +// statistics. +// +// +// +//

Gain insights into your LeetCode performance:

+//
    +//
  • Track solved problems over time
    • +//
  • +// Analyze your performance by problem type and difficulty +//
    • +//
  • Identify areas for improvement
    • +//
+// +// +// +// +// +// +// Skill Improvement +// +// Enhance your problem-solving skills with targeted +// practice. +// +// +// +//

Boost your coding interview readiness:

+//
    +//
  • Get personalized problem recommendations
    • +//
  • Access curated problem sets for specific topics
    • +//
  • Track your improvement over time
    • +//
+// +// +// +// +//
+//
+// +//
+//
+// ); // } + + +export const metadata = { + title: "Shadcn - Landing template", + description: "Free Shadcn landing page for developers", + openGraph: { + type: "website", + url: "https://github.com/nobruf/shadcn-landing-page.git", + title: "Shadcn - Landing template", + description: "Free Shadcn landing page for developers", + images: [ + { + url: "https://res.cloudinary.com/dbzv9xfjp/image/upload/v1723499276/og-images/shadcn-vue.jpg", + width: 1200, + height: 630, + alt: "Shadcn - Landing template", + }, + ], + }, + twitter: { + card: "summary_large_image", + site: "https://github.com/nobruf/shadcn-landing-page.git", + title: "Shadcn - Landing template", + description: "Free Shadcn landing page for developers", + images: [ + "https://res.cloudinary.com/dbzv9xfjp/image/upload/v1723499276/og-images/shadcn-vue.jpg", + ], + }, +}; + +export default function Home() { + return ( +
+ + + + + + + + + + + + +
+ ); +} \ No newline at end of file diff --git a/components/DashboardV2/BenefitsSection.tsx b/components/DashboardV2/BenefitsSection.tsx new file mode 100644 index 0000000..5b8569e --- /dev/null +++ b/components/DashboardV2/BenefitsSection.tsx @@ -0,0 +1,86 @@ +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +// import { Icon } from "@/components/DashboardV2/Icons/DiscordIcon"; +import { icons } from "lucide-react"; + +interface BenefitsProps { + icon: string; + title: string; + description: string; +} + +const benefitList: BenefitsProps[] = [ + { + icon: "Blocks", + title: "Build Brand Trust", + description: + "Lorem ipsum dolor sit amet consectetur adipisicing elit. A odio velit cum aliquam. Natus consectetur dolores.", + }, + { + icon: "LineChart", + title: "More Leads", + description: + "Lorem ipsum dolor sit amet consectetur adipisicing elit. A odio velit cum aliquam, natus consectetur.", + }, + { + icon: "Wallet", + title: "Higher Conversions", + description: + "Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus consectetur. A odio velit cum aliquam", + }, + { + icon: "Sparkle", + title: "Test Marketing Ideas", + description: + "Lorem ipsum dolor sit amet consectetur adipisicing elit. A odio velit cum aliquam. Natus consectetur dolores.", + }, +]; + +export const BenefitsSection = () => { + return ( +
+
+
+

Benefits

+ +

+ Your Shortcut to Success +

+

+ Lorem ipsum dolor sit amet consectetur, adipisicing elit. Non + ducimus reprehenderit architecto rerum similique facere odit + deleniti necessitatibus quo quae. +

+
+ +
+ {benefitList.map(({ icon, title, description }, index) => ( + + +
+ {/* */} + + 0{index + 1} + +
+ + {title} + + + + {description} + + + ))} +
+
+
+ ); +}; \ No newline at end of file diff --git a/components/DashboardV2/CommunitySection.tsx b/components/DashboardV2/CommunitySection.tsx new file mode 100644 index 0000000..2a6c0e6 --- /dev/null +++ b/components/DashboardV2/CommunitySection.tsx @@ -0,0 +1,47 @@ +import { Button } from "@/components/ui/button"; +import { + Card, + CardContent, + CardFooter, + CardHeader, + CardTitle, +} from "@/components/ui/card"; +import DiscordIcon from "./Icons/DiscordIcon"; + +export const CommunitySection = () => { + return ( +
+
+
+
+ + + + +
+ Ready to join this + + Community? + +
+ + + + Join our vibrant Discord community! Connect, share, and grow with + like-minded enthusiasts. Click to dive in! 🚀 + + + + + + +
+
+
+
+ ); +}; \ No newline at end of file diff --git a/components/DashboardV2/ContactSection.tsx b/components/DashboardV2/ContactSection.tsx new file mode 100644 index 0000000..524e201 --- /dev/null +++ b/components/DashboardV2/ContactSection.tsx @@ -0,0 +1,245 @@ +"use client"; +import { + Card, + CardContent, + CardFooter, + CardHeader, +} from "@/components/ui/card"; +import { Building2, Clock, Mail, Phone } from "lucide-react"; +import { useForm } from "react-hook-form"; +import { z } from "zod"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from "@/components/ui/form"; +import { Input } from "@/components/ui/input"; +import { Button } from "@/components/ui/button"; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "@/components/ui/select"; +import { Textarea } from "@/components/ui/textarea"; + +const formSchema = z.object({ + firstName: z.string().min(2).max(255), + lastName: z.string().min(2).max(255), + email: z.string().email(), + subject: z.string().min(2).max(255), + message: z.string(), +}); + +export const ContactSection = () => { + const form = useForm>({ + resolver: zodResolver(formSchema), + defaultValues: { + firstName: "", + lastName: "", + email: "", + subject: "Web Development", + message: "", + }, + }); + + function onSubmit(values: z.infer) { + const { firstName, lastName, email, subject, message } = values; + console.log(values); + + const mailToLink = `mailto:leomirandadev@gmail.com?subject=${subject}&body=Hello I am ${firstName} ${lastName}, my Email is ${email}. %0D%0A${message}`; + + window.location.href = mailToLink; + } + + return ( +
+
+
+
+

+ Contact +

+ +

Connect With Us

+
+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatum + ipsam sint enim exercitationem ex autem corrupti quas tenetur +

+ +
+
+
+ +
Find us
+
+ +
742 Evergreen Terrace, Springfield, IL 62704
+
+ +
+
+ +
Call us
+
+ +
+1 (619) 123-4567
+
+ +
+
+ +
Mail US
+
+ +
leomirandadev@gmail.com
+
+ +
+
+ +
Visit us
+
+ +
+
Monday - Friday
+
8AM - 4PM
+
+
+
+
+ + + + +
+ +
+ ( + + First Name + + + + + + )} + /> + ( + + Last Name + + + + + + )} + /> +
+ +
+ ( + + Email + + + + + + )} + /> +
+ +
+ ( + + Subject + + + + )} + /> +
+ +
+ ( + + Message + +