diff --git a/app/FAQ/component/contact-section.tsx b/app/FAQ/component/contact-section.tsx deleted file mode 100644 index 45a49a5..0000000 --- a/app/FAQ/component/contact-section.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { Button } from "@/components/ui/button" -import { Mail, Phone } from 'lucide-react' - -export default function ContactSection() { - return ( -
-

Still have questions?

-

Our support team is here to help you

-
- - -
-
- ) -} - diff --git a/app/FAQ/component/faq-component.tsx b/app/FAQ/component/faq-component.tsx deleted file mode 100644 index bd09823..0000000 --- a/app/FAQ/component/faq-component.tsx +++ /dev/null @@ -1,86 +0,0 @@ -'use client' - -import { useState } from 'react' -import { Input } from "@/components/ui/input" -import { - Accordion, - AccordionContent, - AccordionItem, - AccordionTrigger, -} from "@/components/ui/accordion" -import { Search } from 'lucide-react' - -const faqs = [ - { - question: "What is Leetcode Journal, and how can it help me?", - answer: "Leetcode Journal is a tool designed to help developers track, organize, and review their Leetcode solutions. It provides an intuitive interface to save solutions, categorize problems, monitor progress, and analyze performance. It's great for personal learning and showcasing problem-solving skills." - }, - { - question: "Can I import my existing Leetcode solutions into the platform?", - answer: "Yes, Leetcode Journal supports solution imports. You can upload your solutions as files or manually enter them to categorize and analyze them within the platform." - }, - { - question: "How does the progress monitoring feature work?", - answer: "The progress monitoring feature provides detailed statistics on your problem-solving journey, including the number of problems solved by difficulty, topic, and monthly trends. It also shows your streaks and acceptance rates to keep you motivated." - }, - { - question: "Is my data secure on Leetcode Journal?", - answer: "We take data security seriously. All your solutions and progress data are encrypted and securely stored on our servers. You have complete control over your data, and it is never shared without your consent." - }, - { - question: "Can I share my Leetcode Journal with others?", - answer: "Yes, you can create a shareable portfolio of your solutions to showcase your problem-solving skills to potential employers or peers. You can customize what information is shared." - }, - { - question: "Does Leetcode Journal support team collaboration?", - answer: "Currently, Leetcode Journal is focused on individual users. However, we are exploring features for team collaboration and knowledge sharing in future updates." - } -] - -export default function FAQComponent() { - const [searchTerm, setSearchTerm] = useState('') - - const filteredFaqs = faqs.filter(faq => - faq.question.toLowerCase().includes(searchTerm.toLowerCase()) || - faq.answer.toLowerCase().includes(searchTerm.toLowerCase()) - ) - - return ( -
-
- setSearchTerm(e.target.value)} - className="w-full pl-10 pr-4 py-2 rounded-full border-2 border-purple-300 focus:border-purple-500 focus:ring focus:ring-purple-200 focus:ring-opacity-50 transition duration-300" - /> - -
- - {filteredFaqs.map((faq, index) => ( - - - {faq.question} - - -

- {faq.answer} -

-
-
- ))} -
- {filteredFaqs.length === 0 && ( -
-

No matching questions found.

-

Try adjusting your search terms or browse all FAQs above.

-
- )} -
- ) -} diff --git a/app/FAQ/component/layout.tsx b/app/FAQ/component/layout.tsx deleted file mode 100644 index 47ced76..0000000 --- a/app/FAQ/component/layout.tsx +++ /dev/null @@ -1,15 +0,0 @@ -export default function FAQLayout({ - children, - }: { - children: React.ReactNode - }) { - return ( -
-
- {children} -
-
- ) - } - - \ No newline at end of file diff --git a/app/FAQ/page.tsx b/app/FAQ/page.tsx deleted file mode 100644 index ef025bf..0000000 --- a/app/FAQ/page.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { Metadata } from "next"; -import FAQComponent from "./component/faq-component"; -import ContactSection from "./component/contact-section"; -import Navbar1 from "@/components/navbar"; -import Footer from "@/components/footer"; - -export const metadata: Metadata = { - title: "FAQ - Your Company Name", - description: "Frequently Asked Questions about our products and services", -}; - -export default function FAQPage() { - return ( -
- -
- {/* Added x-padding */} -
-

- Frequently Asked Questions -

-

- Find answers to common questions about our products and services -

-
- -
- {/* Changed width for small screens */} - -
-
-
- ); -} diff --git a/app/globals.css b/app/globals.css index 831c2e6..55f9d8e 100644 --- a/app/globals.css +++ b/app/globals.css @@ -2,87 +2,149 @@ @tailwind components; @tailwind utilities; +html { + scroll-behavior: smooth; +} + +/* *=========== Default theme =========== */ @layer base { :root { --background: 0 0% 100%; - --foreground: 0 0% 3.9%; - --card: 0 0% 100%; - --card-foreground: 0 0% 3.9%; + --foreground: 240 10% 3.9%; + + --muted: 240 4.8% 95.9%; + --muted-foreground: 240 3.8% 46.1%; + --popover: 0 0% 100%; - --popover-foreground: 0 0% 3.9%; - --primary: 0 0% 9%; + --popover-foreground: 240 10% 3.9%; + + --card: 0 0% 100%; + --card-foreground: 240 10% 3.9%; + + --border: 240 5.9% 90%; + --input: 240 5.9% 90%; + + --primary: 240 5.9% 10%; --primary-foreground: 0 0% 98%; - --secondary: 0 0% 96.1%; - --secondary-foreground: 0 0% 9%; - --muted: 0 0% 96.1%; - --muted-foreground: 0 0% 45.1%; - --accent: 0 0% 96.1%; - --accent-foreground: 0 0% 9%; + + --secondary: 240 4.8% 95.9%; + --secondary-foreground: 240 5.9% 10%; + + --accent: 240 4.8% 95.9%; + --accent-foreground: 240 5.9% 10%; + --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; - --border: 0 0% 89.8%; - --input: 0 0% 89.8%; - --ring: 0 0% 3.9%; - --chart-1: 12 76% 61%; - --chart-2: 173 58% 39%; - --chart-3: 197 37% 24%; - --chart-4: 43 74% 66%; - --chart-5: 27 87% 67%; + + --ring: 240 10% 3.9%; + --radius: 0.5rem; - --sidebar-background: 0 0% 98%; - --sidebar-foreground: 240 5.3% 26.1%; - --sidebar-primary: 240 5.9% 10%; - --sidebar-primary-foreground: 0 0% 98%; - --sidebar-accent: 240 4.8% 95.9%; - --sidebar-accent-foreground: 240 5.9% 10%; - --sidebar-border: 220 13% 91%; - --sidebar-ring: 217.2 91.2% 59.8%; - --color-1: 0 100% 63%; - --color-2: 270 100% 63%; - --color-3: 210 100% 63%; - --color-4: 195 100% 63%; - --color-5: 90 100% 63%; } .dark { - --background: 0 0% 3.9%; + --background: 240 10% 3.9%; --foreground: 0 0% 98%; - --card: 0 0% 3.9%; - --card-foreground: 0 0% 98%; - --popover: 0 0% 3.9%; + + --muted: 240 3.7% 15.9%; + --muted-foreground: 240 5% 64.9%; + + --popover: 240 10% 3.9%; --popover-foreground: 0 0% 98%; + + --card: 240 10% 3.9%; + --card-foreground: 0 0% 98%; + + --border: 240 3.7% 15.9%; + --input: 240 3.7% 15.9%; + --primary: 0 0% 98%; - --primary-foreground: 0 0% 9%; - --secondary: 0 0% 14.9%; + --primary-foreground: 240 5.9% 10%; + + --secondary: 240 3.7% 15.9%; --secondary-foreground: 0 0% 98%; - --muted: 0 0% 14.9%; - --muted-foreground: 0 0% 63.9%; - --accent: 0 0% 14.9%; + + --accent: 240 3.7% 15.9%; --accent-foreground: 0 0% 98%; + --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 0% 98%; - --border: 0 0% 14.9%; - --input: 0 0% 14.9%; - --ring: 0 0% 83.1%; - --chart-1: 220 70% 50%; - --chart-2: 160 60% 45%; - --chart-3: 30 80% 55%; - --chart-4: 280 65% 60%; - --chart-5: 340 75% 55%; - --sidebar-background: 240 5.9% 10%; - --sidebar-foreground: 240 4.8% 95.9%; - --sidebar-primary: 224.3 76.3% 48%; - --sidebar-primary-foreground: 0 0% 100%; - --sidebar-accent: 240 3.7% 15.9%; - --sidebar-accent-foreground: 240 4.8% 95.9%; - --sidebar-border: 240 3.7% 15.9%; - --sidebar-ring: 217.2 91.2% 59.8%; - --color-1: 0 100% 63%; - --color-2: 270 100% 63%; - --color-3: 210 100% 63%; - --color-4: 195 100% 63%; - --color-5: 90 100% 63%; + + --ring: 240 4.9% 83.9%; + } +} + +/* *=========== indigo theme =========== */ +/* @layer base { + :root { + --background: 0 0% 100%; + --foreground: 222.2 47.4% 11.2%; + + --card: 0 0% 100%; + --card-foreground: 222.2 47.4% 11.2%; + + --popover: 0 0% 100%; + --popover-foreground: 222.2 47.4% 11.2%; + + --primary: 226 70% 55%; + --primary-foreground: 210 20% 98%; + + --secondary: 230 16% 85%; + --secondary-foreground: 225 20% 20%; + + --muted: 230 16% 85%; + --muted-foreground: 228 13% 50%; + + --accent: 230 16% 85%; + --accent-foreground: 225 20% 20%; + + --destructive: 0 72.2% 50.6%; + --destructive-foreground: 210 20% 98%; + + --border: 228 13% 75%; + --input: 228 13% 75%; + --ring: 226 70% 55%; + --radius: 0.5rem; } + + .dark { + + --background: 240 10% 3.9%; + --foreground: 0 0% 98%; + + --card: 228 20% 15%; + --card-foreground: 210 20% 98%; + + --popover: 222.2 47.4% 11.2%; + --popover-foreground: 210 20% 98%; + + --primary: 226 70% 55%; + --primary-foreground: 210 20% 98%; + + --secondary: 228 20% 20%; + --secondary-foreground: 210 20% 98%; + + --muted: 228 20% 20%; + --muted-foreground: 225 13% 60%; + + --accent: 228 20% 20%; + --accent-foreground: 210 20% 98%; + + --destructive: 0 72.2% 50.6%; + --destructive-foreground: 210 20% 98%; + + --border: 228 20% 20%; + --input: 228 20% 20%; + --ring: 226 70% 55%; + } +} */ + + +.shadow-light { + box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.085); +} + +.shadow-dark { + box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.141); } @layer base { @@ -92,4 +154,4 @@ body { @apply bg-background text-foreground; } -} +} \ No newline at end of file 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..b1abbdb 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,231 +1,57 @@ -"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 ( - - - - {words.map((word: any, i: any) => ( - - {word} - - ))} - - ); +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 { TeamSection } from "@/components/DashboardV2/TeamSection"; +import { TestimonialSection } from "@/components/DashboardV2/TestimonialSection"; + +export const metadata = { + title: "LeetCode Journal - Your Coding Companion", + description: "LeetCode Journal helps you organize your problem-solving journey, track your progress, and achieve your coding interview goals.", + openGraph: { + type: "website", + url: "https://leetcode-journal.vercel.app/", + title: "LeetCode Journal - Your Coding Companion", + description: "LeetCode Journal helps you organize your problem-solving journey, track your progress, and achieve your coding interview goals.", + 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", + ], + }, }; -//@ts-ignore -const Star = ({ style }) => ( -
- - - -
-); - -export default function LandingPage() { - const router = useRouter(); +export default function Home() { return ( -
- {/* Header */} - - - {/* Main Content */} -
- {/* Hero Section */} -
- - {/* */} -
-

-
- - - -
-

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

- -

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

- -
- - -
-
-
-
-
-
-

- 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
  • -
-
-
-
-
-
-
- -
-
+
+ + + + + + + + + + +
); -} - -// if (typeof document !== "undefined") { -// const style = document.createElement("style"); -// style.textContent = starStyles; -// document.head.appendChild(style); -// } +} \ No newline at end of file diff --git a/components/DashboardV2/BenefitsSection.tsx b/components/DashboardV2/BenefitsSection.tsx new file mode 100644 index 0000000..2a74823 --- /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..dda18ff --- /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..b916fc7 --- /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 + +