aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/docs/components/pages/repo-home
diff options
context:
space:
mode:
author简律纯 <hsiangnianian@outlook.com>2023-05-03 01:09:49 +0800
committer简律纯 <hsiangnianian@outlook.com>2023-05-03 01:09:49 +0800
commita2f8df3b14979f74c03a79b2ffaf081739837899 (patch)
treef2d8e8eb2a3d323502ebcec0a7d02ae9a8daed01 /docs/components/pages/repo-home
parentfade13d683c0420d83f523703d7038edbefe97f6 (diff)
downloadHydroRoll-a2f8df3b14979f74c03a79b2ffaf081739837899.tar.gz
HydroRoll-a2f8df3b14979f74c03a79b2ffaf081739837899.zip
Diffstat (limited to 'docs/components/pages/repo-home')
-rw-r--r--docs/components/pages/repo-home/RepoFeatures.tsx15
-rw-r--r--docs/components/pages/repo-home/RepoHero.tsx114
-rw-r--r--docs/components/pages/repo-home/RepoLetter.tsx118
-rw-r--r--docs/components/pages/repo-home/index.tsx22
4 files changed, 0 insertions, 269 deletions
diff --git a/docs/components/pages/repo-home/RepoFeatures.tsx b/docs/components/pages/repo-home/RepoFeatures.tsx
deleted file mode 100644
index 4499725..0000000
--- a/docs/components/pages/repo-home/RepoFeatures.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { REPO_HOME_FEATURES } from "../../../content/features";
-import { FadeIn } from "../home-shared/FadeIn";
-import { FeaturesBento } from "../home-shared/FeaturesBento";
-
-export function RepoFeatures() {
- return (
- <FadeIn className="py-16 md:py-24 lg:py-32">
- <FeaturesBento
- header="Why Turborepo?"
- body="Turborepo reimagines build system techniques used by Facebook and Google to remove maintenance burden and overhead."
- features={REPO_HOME_FEATURES}
- />
- </FadeIn>
- );
-}
diff --git a/docs/components/pages/repo-home/RepoHero.tsx b/docs/components/pages/repo-home/RepoHero.tsx
deleted file mode 100644
index a63777a..0000000
--- a/docs/components/pages/repo-home/RepoHero.tsx
+++ /dev/null
@@ -1,114 +0,0 @@
-import cn from "classnames";
-import Image from "next/image";
-import Link from "next/link";
-import gradients from "../home-shared/gradients.module.css";
-import { HeroText, SectionSubtext } from "../home-shared/Headings";
-import { Gradient } from "../home-shared/Gradient";
-import { FadeIn } from "../home-shared/FadeIn";
-import { CTAButton } from "../home-shared/CTAButton";
-import RepoLogo from "../../logos/RepoLogo";
-
-export function RepoHero() {
- return (
- <>
- <FadeIn
- noVertical
- className="font-sans w-auto pb-16 pt-[48px] md:pb-24 lg:pb-32 md:pt-16 lg:pt-20 flex justify-between gap-8 items-center flex-col relative z-0"
- >
- <FadeIn className="z-50 flex items-center justify-center w-full ">
- <div className="absolute min-w-[614px] min-h-[614px]">
- {/* TODO: On dark mode, there should be a "breathing" gradient inside the inner circle */}
- <Image
- alt="Turborepo"
- src="/images/docs/repo/repo-hero-circles-dark.svg"
- width={614}
- height={614}
- className="hidden dark:block"
- />
- <Image
- alt="Turborepo"
- src="/images/docs/repo/repo-hero-circles-light.svg"
- width={614}
- height={614}
- className="block dark:hidden"
- />
- </div>
- <div className="absolute z-50 flex items-center justify-center w-64 h-64">
- <Gradient
- small
- width={120}
- height={120}
- conic
- className="dark:opacity-100 opacity-40"
- />
- </div>
-
- <div className="w-[120px] h-[120px] z-50">
- <Image
- alt=""
- src={`/images/docs/repo/repo-hero-logo-dark.svg`}
- width={120}
- height={120}
- className="hidden dark:block"
- />
- <Image
- alt=""
- src={`/images/docs/repo/repo-hero-logo-light.svg`}
- width={120}
- height={120}
- className="block dark:hidden"
- />
- </div>
- </FadeIn>
- <Gradient
- width={1000}
- height={1000}
- className="top-[-500px] dark:opacity-20 opacity-[0.15]"
- conic
- />
- <div className="absolute top-0 z-10 w-full h-48 dark:from-black from-white to-transparent bg-gradient-to-b" />
- <FadeIn
- delay={0.15}
- className="z-50 flex flex-col items-center justify-center gap-5 px-6 text-center lg:gap-6"
- >
- <RepoLogo
- alt="Turborepo"
- width="200"
- className="w-[160px] md:w-[200px] fill-black dark:fill-white"
- />
- <HeroText h1>The build system that makes ship happen</HeroText>
- <SectionSubtext hero>
- Turborepo is a high-performance build system for JavaScript and
- TypeScript codebases.
- </SectionSubtext>
- </FadeIn>
- <FadeIn
- delay={0.3}
- className="z-50 flex flex-col items-center w-full max-w-md gap-5 px-6"
- >
- <div className="flex flex-col w-full gap-3 md:!flex-row">
- <CTAButton>
- <Link href="/repo/docs" className="block py-3">
- Get Started
- </Link>
- </CTAButton>
- <CTAButton outline>
- <a
- target="_blank"
- rel="noreferrer"
- href="https://github.com/vercel/turbo"
- className="block py-3"
- >
- GitHub
- </a>
- </CTAButton>
- </div>
- <p className="text-sm text-[#666666]">License: MPL-2.0</p>
- </FadeIn>
- <FadeIn delay={0.5} className="relative w-full">
- <div className="absolute bottom-0 w-full dark:from-black from-white to-transparent h-72 bg-gradient-to-t" />
- </FadeIn>
- </FadeIn>
- </>
- );
-}
diff --git a/docs/components/pages/repo-home/RepoLetter.tsx b/docs/components/pages/repo-home/RepoLetter.tsx
deleted file mode 100644
index 7093a3a..0000000
--- a/docs/components/pages/repo-home/RepoLetter.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import { HeroText } from "../home-shared/Headings";
-import Image from "next/image";
-import cn from "classnames";
-import gradients from "../home-shared/gradients.module.css";
-import { FadeIn } from "../home-shared/FadeIn";
-import { CTAButton } from "../home-shared/CTAButton";
-import Link from "next/link";
-import { Gradient } from "../home-shared/Gradient";
-
-export function RepoLetter() {
- return (
- <section className="relative flex flex-col items-center px-6 py-16 font-sans md:py-24 lg:py-32 gap-14">
- <FadeIn>
- <HeroText className="lg:text-[65px]">
- Scaling your Codebase
- <br />
- shouldn&apos;t be so difficult
- </HeroText>
- </FadeIn>
- <div className="flex flex-col max-w-xl leading-6 md:text-lg lg:text-lg">
- <FadeIn className="opacity-70">
- <p>
- The bigger your project grows, the slower it gets. Tasks like
- linting, testing, and building begin to take enormous amounts of
- time.
- </p>
- <br />
- <p>
- If you&apos;re serving multiple applications, you might reach for a
- monorepo. They&apos;re incredible for productivity, especially on
- the frontend, but the tooling can be a nightmare. There&apos;s a lot
- of stuff to do (and things to mess up). Nothing &ldquo;just
- works.&rdquo; It&apos;s become completely normal to waste entire
- days or weeks on plumbing—tweaking configs, writing one-off scripts,
- and stitching stuff together.
- </p>
- <br />
- <p>We need something else.</p>
- <br></br>
- <p>
- A fresh take on the whole setup. Designed to glue everything
- together. A toolchain that works for you and not against you. With
- sensible defaults, but even better escape hatches. Built with the
- same techniques used by the big guys, but in a way that doesn&apos;t
- require PhD to learn or a staff to maintain.
- </p>
- <br />
- <p>With Turborepo, we&apos;re doing just that.</p>
- <br />
- <p>
- We&apos;re building a build system that can keep up with your team.
- You&apos;ll see your CI get faster, duplicated work get cut, and
- your NPM scripts get simpler. You&apos;ll get a world-class
- development environment, without the maintenance burden.
- </p>
- </FadeIn>
- <FadeIn noVertical viewTriggerOffset className="relative h-2 md:h-12">
- <span
- className={cn(
- "w-full h-[1px] -bottom-8 md:-bottom-4 lg:-bottom-4 absolute",
- gradients.letterLine
- )}
- />
- </FadeIn>
- <FadeIn
- viewTriggerOffset
- noVertical
- className="flex items-end justify-center gap-3 md:self-start md:-ml-4 lg:self-start lg:-ml-4 min-w-[300px]"
- >
- <div className="w-24 h-24 min-w-[96px] min-h-[96px] rounded-full border dark:border-white/10 border-black/10 flex items-center justify-center ">
- <Image
- alt="Image of Jared Palmer"
- src="/images/people/jaredpalmer.jpeg"
- width={64}
- height={64}
- className="rounded-full grayscale"
- />
- </div>
- <div className="flex flex-col">
- <Image
- alt="Jared Palmer's hand written signature"
- src="/images/docs/repo/jared-signature-light.svg"
- width={190}
- height={90}
- className="block mt-3 mb-4 ml-3 dark:hidden"
- />
- <Image
- alt="Jared Palmer's hand written signature"
- src="/images/docs/repo/jared-signature-dark.svg"
- width={209}
- height={116}
- className="hidden -mt-2 dark:block"
- />
- <div className="flex gap-2 flex-wrap text-sm leading-none text-[#888888] max-w-[156px] md:max-w-xl lg:max-w-xl">
- <p className="font-bold">Jared Palmer</p>
- <p>Founder of Turborepo</p>
- </div>
- </div>
- </FadeIn>
- </div>
- <FadeIn noVertical className="relative flex justify-center w-full mt-16">
- <div className="max-w-[180px] w-full">
- <CTAButton>
- <Link href="/repo/docs" className="block py-3 font-sans">
- Start Building
- </Link>
- </CTAButton>
- </div>
- <Gradient
- width={1200}
- height={300}
- className="bottom-[-200px] -z-10 opacity-20"
- conic
- />
- </FadeIn>
- </section>
- );
-}
diff --git a/docs/components/pages/repo-home/index.tsx b/docs/components/pages/repo-home/index.tsx
deleted file mode 100644
index 992a614..0000000
--- a/docs/components/pages/repo-home/index.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { RepoHero } from "./RepoHero";
-import { RepoFeatures } from "./RepoFeatures";
-import { RepoLetter } from "./RepoLetter";
-import { GradientSectionBorder } from "../home-shared/GradientSectionBorder";
-import { LandingPageGlobalStyles } from "../home-shared/GlobalStyles";
-
-export default function Home() {
- return (
- <>
- <LandingPageGlobalStyles />
- <main className="relative">
- <RepoHero />
- <GradientSectionBorder>
- <RepoFeatures />
- </GradientSectionBorder>
- <GradientSectionBorder>
- <RepoLetter />
- </GradientSectionBorder>
- </main>
- </>
- );
-}