Skip to content

Commit

Permalink
Merge pull request #68 from heavenmei/main
Browse files Browse the repository at this point in the history 
new home preview
  • Loading branch information
@yangchuansheng
yangchuansheng authored Oct 15, 2024
2 parents 36eab16 + 6c71a39 commit 65df45e
Show file tree
Hide file tree
Showing 63 changed files with 3,012 additions and 1,725 deletions.
50 changes: 26 additions & 24 deletions projects/fastgpt/app/[[...lang]]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,7 @@ import CTA from '@/components/home/CTA';
import FAQ from '@/components/home/FAQ';
import Feature from '@/components/home/Feature';
import Hero from '@/components/home/Hero';
import Pricing from '@/components/home/Pricing';
import SocialProof from '@/components/home/SocialProof';
// import SocialProof from '@/components/home/SocialProof';
import VideoPlayer from '@/components/home/Video';
import { defaultLocale, getDictionary, localeNames } from '@/lib/i18n';

Expand All @@ -21,32 +20,35 @@ export default async function LangHome({ params: { lang } }: { params: { lang?:
if (stargazers_count) {
stars = stargazers_count;
}
} catch (error) {}
} catch (error) { }

return (
<>
<Header dict={dict} />
<main className="flex flex-col items-center py-6">
{/* Hero Section */}
<Hero locale={dict.Hero} CTALocale={dict.CTAButton} stars={stars} />
<SocialProof locale={dict.SocialProof} />
{/* Can be used to display technology stack, partners, project honors, etc. */}
{/*<ScrollingLogos />*/}
<VideoPlayer dict={dict} />

<Ability id="Ability" locale={dict.Ability} langName={langName} />

{/* USP (Unique Selling Proposition) */}
<Feature id="Features" locale={dict.Feature} langName={langName} />

{/* Pricing */}
<Pricing id="Pricing" locale={dict.Pricing} langName={langName} />

{/* FAQ (Frequently Asked Questions) */}
<FAQ id="FAQ" locale={dict.FAQ} langName={langName} />

{/* CTA (Call to Action) */}
<CTA locale={dict.CTA} CTALocale={dict.CTAButton} stars={stars} />
<main className="flex flex-col items-center mt-12 sm:mt-14 lg:mt-20 ">
<div className='mx-4 sm:mx-6 md:mx-12 xl:mx-[60px] 2xl:max-w-7xl 2xl:mx-auto flex flex-col items-center'>
{/* Hero Section */}
<Hero locale={dict.Hero} CTALocale={dict.CTAButton} stars={stars} />
{/* <SocialProof locale={dict.SocialProof} /> */}
{/* Can be used to display technology stack, partners, project honors, etc. */}
{/*<ScrollingLogos />*/}
<VideoPlayer dict={dict} />

<Ability id="Ability" locale={dict.Ability} langName={langName} />

{/* USP (Unique Selling Proposition) */}
<Feature id="Features" locale={dict.Feature} langName={langName} />

{/* Pricing */}
{/* <Pricing id="Pricing" locale={dict.Pricing} langName={langName} /> */}

{/* FAQ (Frequently Asked Questions) */}
<FAQ id="FAQ" locale={dict.FAQ} langName={langName} />

{/* CTA (Call to Action) Footer */}
<CTA locale={dict.CTA} CTALocale={dict.CTAButton} stars={stars} />
</div>
{/* <InterModal locale={dict.InterModal} /> */}
</main>
</>
);
Expand Down
7 changes: 4 additions & 3 deletions projects/fastgpt/app/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import BaiDuAnalytics from '@/app/BaiDuAnalytics';
import GoogleAnalytics from '@/app/GoogleAnalytics';
import { TailwindIndicator } from '@/components/TailwindIndicator';
import { ThemeProvider } from '@/components/ThemeProvider';
import Footer from '@/components/footer/Footer';
import { siteConfig } from '@/config/site';
import { defaultLocale } from '@/lib/i18n';
import { cn } from '@/lib/utils';
Expand Down Expand Up @@ -48,10 +47,12 @@ export default async function RootLayout({
return (
<html lang={(lang && lang[0]) || defaultLocale} suppressHydrationWarning>
<head />
<body className={cn('min-h-screen bg-background font-sans antialiased', fontSans.variable)}>
<body className={cn('min-h-screen font-sans antialiased', fontSans.variable)}
// style={{background: 'var(--background-gradient)'}}
>
<ThemeProvider attribute="class" defaultTheme={siteConfig.nextThemeColor} enableSystem>
{children}
<Footer />
{/* <Footer /> */}
<Analytics />
<TailwindIndicator />
</ThemeProvider>
Expand Down
5 changes: 4 additions & 1 deletion projects/fastgpt/components/ThemedButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,11 @@ export function ThemedButton() {
setIsClient(typeof window !== "undefined");
}, []);
return (
<div onClick={() => setTheme(theme === "light" ? "dark" : "light")}>
<div onClick={() => setTheme(theme === "light" ? "dark" : "light")} className="flex gap-4 font-medium p-1 hover:bg-white/10 cursor-pointer rounded-md">
{theme === "light" && isClient ? <PhMoonFill /> : <PhSunBold />}
<div className="md:hidden">
{theme === "light" && isClient ? "Night Mode" : "Light Mode"}
</div>
</div>
);
}
Expand Down
197 changes: 88 additions & 109 deletions projects/fastgpt/components/header/Header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import Image from "next/image";
import Link from "next/link";
import { useState } from "react";
import { CgClose } from "react-icons/cg";
import { ThemedButton } from "../ThemedButton";

const Header = ({
dict,
Expand All @@ -20,125 +19,105 @@ const Header = ({
};
}) => {
const [isMenuOpen, setIsMenuOpen] = useState(false);
return (
<header className="py-10 mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<nav className="relative z-50 flex justify-between">
<div className="flex items-center md:gap-x-12">


const LogoFC = () => (<div className="flex items-center md:gap-x-12">
<Link
href="/"
aria-label="FastGPT"
title="FastGPT"
className="flex items-center space-x-3 font-bold "
>
<Image
alt={siteConfig.name}
src="/logo.svg"
className="w-[30px] h-[30px] bg-[#E9E9E9] p-1 rounded-md dark:bg-opacity-20"
width={32}
height={32}
/>
<span className="text-white hidden md:block">
FastGPT
</span>
</Link>

<ul className="hidden items-center gap-5 md:flex">
{dict?.links.map((link) => (
<li key={link.label} className="cursor-pointer hover:bg-white/10 px-2 py-1 rounded-md">
<Link
href="/"
aria-label="FastGPT"
title="FastGPT"
className="flex items-center space-x-1 font-bold"
href={link.href}
aria-label={link.label}
title={link.label}
className="tracking-wide transition-colors duration-200 font-norma"
>
<Image
alt={siteConfig.name}
src="/logo.svg"
className="w-8 h-8"
width={32}
height={32}
/>
<span className="text-gray-950 dark:text-gray-300 hidden md:block">
FastGPT
</span>
{link.label}
</Link>
</div>

<ul className="hidden items-center gap-6 md:flex">
{dict?.links.map((link) => (
<li key={link.label}>
<Link
href={link.href}
aria-label={link.label}
title={link.label}
className="tracking-wide transition-colors duration-200 font-norma"
>
{link.label}
</Link>
</li>
))}
</ul>
</li>
))}
</ul>
</div>)

<div className="hidden md:flex items-center gap-x-6">
return (
<header className="relative py-2 mx-auto max-w-8xl px-4 sm:px-6 lg:px-8 flex justify-between">
<nav className="z-50 flex justify-between w-full">
<LogoFC />
<div className="hidden md:flex items-center gap-x-4">
<HeaderLinks />
<ThemedButton />
{/* <ThemedButton /> */}
<LangSwitcher />
</div>
</nav>

<div className="md:hidden">
<button
aria-label="Open Menu"
title="Open Menu"
className="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline hover:bg-deep-purple-50 focus:bg-deep-purple-50"
onClick={() => setIsMenuOpen(true)}
>
<MenuIcon />
</button>
{isMenuOpen && (
<div className="absolute top-0 left-0 w-full z-50">
<div className="p-5 bg-background border rounded shadow-sm">
<div className="flex items-center justify-between mb-4">
<div>
<Link
href="/"
aria-label="FastGPT"
title="FastGPT"
className="inline-flex items-center"
>
<Image
alt={siteConfig.name}
src="/logo.svg"
className="w-8 h-8"
width={32}
height={32}
/>
<span className="ml-2 text-xl font-bold tracking-wide text-gray-950 dark:text-gray-300">
FastGPT
</span>
</Link>
</div>
<div>
<button
aria-label="Close Menu"
title="Close Menu"
className="tracking-wide transition-colors duration-200 font-norma"
onClick={() => setIsMenuOpen(false)}
>
<CgClose />
</button>
</div>
</div>
<nav>
<ul className="space-y-4">
{dict?.links.map((link) => (
<li key={link.label}>
<Link
href={link.href}
aria-label={link.label}
title={link.label}
className="font-medium tracking-wide transition-colors duration-200 hover:text-deep-purple-accent-400"
onClick={() => setIsMenuOpen(false)}
>
{link.label}
</Link>
</li>
))}
</ul>
</nav>
<div className="pt-2">
<div className="py-2 font-bold">Links</div>
<div className="flex items-center gap-x-5 justify-between">
<HeaderLinks />
<div className="flex items-center justify-end gap-x-5">
<ThemedButton />
<LangSwitcher />
</div>
</div>
<div className="md:hidden">
<button
aria-label="Open Menu"
title="Open Menu"
className="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline hover:bg-deep-purple-50 focus:bg-deep-purple-50"
onClick={() => setIsMenuOpen(true)}
>
<MenuIcon />
</button>
{isMenuOpen && (
<div className="absolute top-0 left-0 z-50 w-screen h-screen bg-overlay/50">
<div className="p-5 bg-background rounded shadow-sm">
<div className="flex items-center justify-between mb-4">
<LogoFC />
<div>
<button
aria-label="Close Menu"
title="Close Menu"
className="tracking-wide transition-colors duration-200 font-norma"
onClick={() => setIsMenuOpen(false)}
>
<CgClose />
</button>
</div>
</div>
<nav>
<ul className="space-y-4">
{dict?.links.map((link) => (
<li key={link.label}>
<Link
href={link.href}
aria-label={link.label}
title={link.label}
className="font-medium tracking-wide transition-colors duration-200 hover:text-deep-purple-accent-400 hover:bg-white/10 p-1 rounded-md"
onClick={() => setIsMenuOpen(false)}
>
{link.label}
</Link>
</li>
))}
</ul>
</nav>
<div className="mt-4 border-t-1 flex flex-col gap-6 pt-4 border-white/10">
<HeaderLinks />
{/* <ThemedButton /> */}
<LangSwitcher />
</div>
</div>
)}
</div>
</nav>
</div>
)}
</div>
</header>
);
};
Expand Down
26 changes: 21 additions & 5 deletions projects/fastgpt/components/header/HeaderLinks.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,25 +1,41 @@
"use client";
import PhMoonFill from "@/components/icons/moon";
import PhSunBold from "@/components/icons/sun";
import { siteConfig } from "@/config/site";
import { Button } from "@/components/ui/button";
import { useTheme } from "next-themes";
import Link from "next/link";
import React from "react";
import React, { useEffect, useState } from "react";

const HeaderLinks = () => {
const links = siteConfig.headerLinks;
const { theme, setTheme } = useTheme();
const [isClient, setIsClient] = useState(false);

useEffect(() => {
setIsClient(typeof window !== "undefined");
}, []);

return (
<div className="flex flex-row items-center gap-6">
<div className="flex items-start gap-4 md:flex-row flex-col w-full">
{links.map((link, index) => (
<Link
key={link.name}
href={link.href}
target="_blank"
rel="noopener norefferer nofollow"
className={` flex max-w-[24px] flex-col items-center justify-center`}
className={` flex items-center justify-center gap-4 hover:bg-white/10 p-1 rounded-md`}
>
{link.icon &&
React.createElement(link.icon, { className: "text-lg" })}
React.createElement(link.icon, { className: "text-2xl" })}
<div className="md:hidden font-medium">{link.name}</div>
</Link>
))}
<div onClick={() => setTheme(theme === "light" ? "dark" : "light")} className="flex gap-4 font-medium p-1 hover:bg-white/10 cursor-pointer rounded-md">
{theme === "light" && isClient ? <PhMoonFill /> : <PhSunBold />}
<div className="md:hidden">
{theme === "light" && isClient ? "Night Mode" : "Light Mode"}
</div>
</div>
</div>
);
};
Expand Down
4 changes: 2 additions & 2 deletions projects/fastgpt/components/header/LangSwitcher.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ import {
SelectTrigger,
SelectValue
} from '@/components/ui/select';
import { useParams, useRouter } from 'next/navigation';
import { defaultLocale, localeNames } from '@/lib/i18n';
import { useParams, useRouter } from 'next/navigation';
import { useEffect } from 'react';

export const LangSwitcher = () => {
Expand Down Expand Up @@ -36,7 +36,7 @@ export const LangSwitcher = () => {

return (
<Select value={langName} onValueChange={handleSwitchLanguage}>
<SelectTrigger className="w-fit">
<SelectTrigger className="w-fit bg-white/20 hover:bg-white/10">
<SelectValue placeholder="Language" />
</SelectTrigger>
<SelectContent>
Expand Down
Loading

0 comments on commit 65df45e

Please sign in to comment.