Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy.git synced 2026-06-15 20:25:23 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #606 from PaiJi/chore/i18n-zh-hans

Browse Source 
feat(i18n): add zh-Hans for Pricing and Sponsor
This commit is contained in:
Mauricio Siu
2024-10-27 02:05:24 -06:00
committed by GitHub
parent 38a72806a7 ecc98b0944
commit 1a6bf06929
5 changed files with 279 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/website/components/Header.tsx
View File

@@ -144,7 +144,7 @@ export function Header() {
<Logo className="h-10 w-auto" /> <Logo className="h-10 w-auto" />
</Link> </Link>
<div className="hidden md:flex md:gap-x-6"> <div className="hidden md:flex md:gap-x-6">
<NavLink href="/pricing">Pricing</NavLink> <NavLink href="/pricing">{t("navigation.pricing")}</NavLink>
<NavLink href="/#faqs">{t("navigation.faqs")}</NavLink> <NavLink href="/#faqs">{t("navigation.faqs")}</NavLink>
<NavLink href={linkT("docs.intro")} target="_blank"> <NavLink href={linkT("docs.intro")} target="_blank">
{t("navigation.docs")} {t("navigation.docs")}
@@ -172,7 +172,7 @@ export function Header() {
target="_blank" target="_blank"
// className="flex flex-row items-center gap-2 text-white" // className="flex flex-row items-center gap-2 text-white"
> >
Dashboard {t("navigation.dashboard")}
</Link> </Link>
</Button> </Button>
<div className="-mr-1 md:hidden"> <div className="-mr-1 md:hidden">

66
apps/website/components/Hero.tsx
View File

@@ -72,22 +72,22 @@ export function Hero() {
</div> </div>
<div className="relative"> <div className="relative">
<Link href="/pricing" className="relative z-10"> <Link href="/pricing" className="relative z-10 mb-4 inline-block">
<div className="flex items-center justify-center"> <div className="flex items-center justify-center">
<div <div
className={cn( className={cn(
"group rounded-full border border-black/5 bg-neutral-100 text-sm font-medium text-white transition-all ease-in hover:cursor-pointer hover:bg-neutral-200 dark:border-white/5 dark:bg-neutral-900 dark:hover:bg-neutral-800", "group rounded-full border border-black/5 bg-neutral-100 text-sm font-medium text-white transition-all ease-in hover:cursor-pointer hover:bg-neutral-200 dark:border-white/5 dark:bg-neutral-900 dark:hover:bg-neutral-800",
)} )}
> >
<AnimatedShinyText className="inline-flex items-center justify-center px-4 py-1 transition ease-out text-neutral-800 hover:text-neutral-900 hover:duration-300 hover:dark:text-neutral-400"> <AnimatedShinyText className="inline-flex items-center justify-center px-4 py-1 text-neutral-800 transition ease-out hover:text-neutral-900 hover:duration-300 hover:dark:text-neutral-400">
<span>🚀 Introducing Dokploy Cloud </span> <span>🚀 {t("hero.cloud")} </span>
<ArrowRightIcon className="ml-1 size-3 transition-transform duration-300 ease-in-out group-hover:translate-x-0.5" /> <ArrowRightIcon className="ml-1 size-3 transition-transform duration-300 ease-in-out group-hover:translate-x-0.5" />
</AnimatedShinyText> </AnimatedShinyText>
</div> </div>
</div> </div>
</Link> </Link>
<h1 className="mx-auto max-w-4xl font-display text-5xl font-medium tracking-tight text-muted-foreground sm:text-7xl"> <h1 className="mx-auto max-w-4xl font-display text-5xl font-medium tracking-tight text-muted-foreground sm:text-7xl">
{t("hero.deploy")}{" "} {t("hero.deploy")}{" "}
<span className="relative whitespace-nowrap text-primary"> <span className="relative whitespace-nowrap text-primary">
<svg <svg
@@ -144,8 +144,8 @@ export function Hero() {
</Link> </Link>
</Button> */} </Button> */}
</div> </div>
<div className="flex flex-wrap items-center justify-center gap-3 md:flex-nowrap max-w-sm mx-auto w-full"> <div className="mx-auto flex w-full max-w-sm flex-wrap items-center justify-center gap-3 md:flex-nowrap">
<Button className="rounded-xl w-full" asChild> <Button className="w-full rounded-xl" asChild>
<Link <Link
href="https://github.com/dokploy/dokploy" href="https://github.com/dokploy/dokploy"
aria-label="Dokploy on GitHub" aria-label="Dokploy on GitHub"
@@ -159,7 +159,7 @@ export function Hero() {
</Link> </Link>
</Button> </Button>
<Button <Button
className="rounded-xl bg-[#5965F2] hover:bg-[#4A55E0] w-full" className="w-full rounded-xl bg-[#5965F2] hover:bg-[#4A55E0]"
asChild asChild
> >
<Link <Link
@@ -223,22 +223,20 @@ export function Hero() {
} }
export const ShowSponsors = () => { export const ShowSponsors = () => {
const t = useTranslations("HomePage");
return ( return (
<div className="mt-20 flex flex-col justify-center gap-y-10"> <div className="mt-20 flex flex-col justify-center gap-y-10">
<div className="flex flex-col gap-4 justify-start"> <div className="flex flex-col justify-start gap-4">
<h1 className="mx-auto max-w-2xl font-display text-3xl font-medium tracking-tight text-primary sm:text-5xl"> <h1 className="mx-auto max-w-2xl font-display text-3xl font-medium tracking-tight text-primary sm:text-5xl">
Sponsors {t("hero.sponsors.title")}
</h1> </h1>
<p className="mx-auto max-w-2xl text-lg tracking-tight text-muted-foreground"> <p className="mx-auto max-w-2xl text-lg tracking-tight text-muted-foreground">
Dokploy is an open source project that is maintained by a community of {t("hero.sponsors.description")}
volunteers. We would like to thank our sponsors for their support and
contributions to the project, which help us to continue to develop and
improve Dokploy.
</p> </p>
</div> </div>
<div className="flex flex-col gap-4 md:gap-6 justify-start"> <div className="flex flex-col items-center justify-start gap-4 md:gap-6">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Hero Sponsors 🎖 {t("hero.sponsors.level.hero")} 🎖
</h2> </h2>
<div className="flex flex-wrap items-center gap-4"> <div className="flex flex-wrap items-center gap-4">
<a <a
@@ -250,7 +248,7 @@ export const ShowSponsors = () => {
<img <img
src="https://raw.githubusercontent.com/Dokploy/dokploy/canary/.github/sponsors/hostinger.jpg" src="https://raw.githubusercontent.com/Dokploy/dokploy/canary/.github/sponsors/hostinger.jpg"
alt="hostinger.com" alt="hostinger.com"
className="rounded-xl w-[190px] h-auto" className="h-auto w-[190px] rounded-xl"
/> />
</a> </a>
<a <a
@@ -262,16 +260,16 @@ export const ShowSponsors = () => {
<img <img
src="https://raw.githubusercontent.com/Dokploy/dokploy/canary/.github/sponsors/lxaer.png" src="https://raw.githubusercontent.com/Dokploy/dokploy/canary/.github/sponsors/lxaer.png"
alt="lxaer.com" alt="lxaer.com"
className="rounded-xl w-[70px] h-auto" className="h-auto w-[70px] rounded-xl"
/> />
</a> </a>
</div> </div>
</div> </div>
<div className="flex flex-col gap-4 md:gap-8 justify-start"> <div className="flex flex-col items-center justify-start gap-4 md:gap-8">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Premium Supporters 🥇 {t("hero.sponsors.level.premium")} 🥇
</h2> </h2>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"> <div className="flex flex-col items-center justify-start gap-4 md:gap-6">
<a <a
href="https://supafort.com/?ref=dokploy" href="https://supafort.com/?ref=dokploy"
target="_blank" target="_blank"
@@ -286,9 +284,9 @@ export const ShowSponsors = () => {
</a> </a>
</div> </div>
</div> </div>
<div className="flex flex-col gap-4 md:gap-8 justify-start"> <div className="flex flex-col items-center justify-start gap-4 md:gap-8">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Supporting Members 🥉 {t("hero.sponsors.level.supporting")} 🥉
</h2> </h2>
<div className="flex flex-row gap-10"> <div className="flex flex-row gap-10">
<a <a
@@ -317,9 +315,9 @@ export const ShowSponsors = () => {
</a> </a>
</div> </div>
</div> </div>
<div className="flex flex-col gap-4 md:gap-8 justify-start"> <div className="justify-star flex flex-col items-center gap-4 md:gap-8">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Community Backers 🤝 {t("hero.sponsors.level.community")} 🤝
</h2> </h2>
<div className="flex flex-row gap-10"> <div className="flex flex-row gap-10">
<a <a
@@ -361,9 +359,9 @@ export const ShowSponsors = () => {
</a> </a>
</div> </div>
</div> </div>
<div className="flex flex-col gap-4 md:gap-8 justify-start"> <div className="flex flex-col items-center justify-start gap-4 md:gap-8">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Organizations: {t("hero.sponsors.level.organizations")}
</h2> </h2>
<div className="flex flex-row gap-10"> <div className="flex flex-row gap-10">
<a <a
@@ -378,9 +376,9 @@ export const ShowSponsors = () => {
</a> </a>
</div> </div>
</div> </div>
<div className="flex flex-col gap-4 md:gap-8 justify-start"> <div className="flex flex-col items-center justify-start gap-4 md:gap-8">
<h2 className="font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl text-left"> <h2 className="text-left font-display text-2xl font-medium tracking-tight text-primary sm:text-2xl">
Individuals: {t("hero.sponsors.level.individuals")}
</h2> </h2>
<div className="flex flex-row gap-10"> <div className="flex flex-row gap-10">
<a <a

166
apps/website/components/pricing.tsx
View File

@@ -3,9 +3,10 @@ import clsx from "clsx";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { ArrowRight, MinusIcon, PlusIcon } from "lucide-react"; import { ArrowRight, MinusIcon, PlusIcon } from "lucide-react";
import { useTranslations } from "next-intl";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useState } from "react"; import { use, useState } from "react";
import { Container } from "./Container"; import { Container } from "./Container";
import { trackGAEvent } from "./analitycs"; import { trackGAEvent } from "./analitycs";
import { Badge } from "./ui/badge"; import { Badge } from "./ui/badge";
@@ -89,7 +90,7 @@ function Plan({
<section <section
className={clsx( className={clsx(
"flex flex-col rounded-3xl px-6 sm:px-8", "flex flex-col rounded-3xl px-6 sm:px-8",
featured ? "order-first bg-black border py-8 lg:order-none" : "lg:py-8", featured ? "order-first border bg-black py-8 lg:order-none" : "lg:py-8",
)} )}
> >
<div className="absolute inset-0"> <div className="absolute inset-0">
@@ -147,7 +148,7 @@ function Plan({
label: `${name} - ${price}`, label: `${name} - ${price}`,
}); });
}} }}
className="rounded-full mt-8" className="mt-8 rounded-full"
> >
{buttonText} {buttonText}
</Button> </Button>
@@ -158,6 +159,7 @@ function Plan({
export function Pricing() { export function Pricing() {
const router = useRouter(); const router = useRouter();
const t = useTranslations("Pricing");
const [isAnnual, setIsAnnual] = useState(true); const [isAnnual, setIsAnnual] = useState(true);
const [serverQuantity, setServerQuantity] = useState(3); const [serverQuantity, setServerQuantity] = useState(3);
const featured = true; const featured = true;
@@ -165,7 +167,7 @@ export function Pricing() {
<section <section
id="pricing" id="pricing"
aria-label="Pricing" aria-label="Pricing"
className="bg-black border-t border-border/30 py-20 sm:py-32" className="border-t border-border/30 bg-black py-20 sm:py-32"
> >
<div className="absolute inset-0"> <div className="absolute inset-0">
<svg viewBox="0 0 2000 1000" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 2000 1000" xmlns="http://www.w3.org/2000/svg">
@@ -189,48 +191,52 @@ export function Pricing() {
<h2 className="font-display text-3xl tracking-tight text-white sm:text-4xl"> <h2 className="font-display text-3xl tracking-tight text-white sm:text-4xl">
<span className="relative whitespace-nowrap"> <span className="relative whitespace-nowrap">
<SwirlyDoodle className="absolute left-0 top-1/2 h-[1em] w-full fill-muted-foreground" /> <SwirlyDoodle className="absolute left-0 top-1/2 h-[1em] w-full fill-muted-foreground" />
<span className="relative"> Simple & Affordable,</span> <span className="relative">{t("swirlyDoodleTitle")}</span>
</span>{" "} </span>{" "}
Pricing. {t("restTitle")}
</h2> </h2>
<p className="mt-4 text-lg text-muted-foreground"> <p className="mt-4 text-lg text-muted-foreground">
Deploy Smarter, Scale Faster – Without Breaking the Bank {t("description")}
</p> </p>
</div> </div>
<div className=" mt-10 mx-auto"> <div className=" mx-auto mt-10">
<div className="mt-16 flex flex-col gap-10 mx-auto w-full lg:-mx-8 xl:mx-0 xl:gap-x-8 justify-center items-center"> <div className="mx-auto mt-16 flex w-full flex-col items-center justify-center gap-10 lg:-mx-8 xl:mx-0 xl:gap-x-8">
<Tabs <Tabs
defaultValue="monthly" defaultValue="monthly"
value={isAnnual ? "annual" : "monthly"} value={isAnnual ? "annual" : "monthly"}
onValueChange={(e) => setIsAnnual(e === "annual")} onValueChange={(e) => setIsAnnual(e === "annual")}
> >
<TabsList> <TabsList>
<TabsTrigger value="monthly">Monthly</TabsTrigger> <TabsTrigger value="monthly">
<TabsTrigger value="annual">Annual</TabsTrigger> {t("billingCycle.monthly")}
</TabsTrigger>
<TabsTrigger value="annual">
{t("billingCycle.annual")}
</TabsTrigger>
</TabsList> </TabsList>
</Tabs> </Tabs>
<div className="flex max-w-4xl gap-4 mx-auto max-sm:flex-wrap-reverse max-sm:justify-center sm:flex-row-reverse"> <div className="mx-auto flex max-w-4xl gap-4 max-sm:flex-wrap-reverse max-sm:justify-center sm:flex-row-reverse">
<section <section
className={clsx( className={clsx(
"flex flex-col rounded-3xl border-dashed border-muted border-2 px-4 max-w-sm", "flex max-w-sm flex-col rounded-3xl border-2 border-dashed border-muted px-4",
featured featured
? "order-first bg-black border py-8 lg:order-none" ? "order-first border bg-black py-8 lg:order-none"
: "lg:py-8", : "lg:py-8",
)} )}
> >
<div className="flex flex-row gap-2 items-center"> <div className="flex flex-row items-center gap-2">
<p className=" text-2xl font-semibold tracking-tight text-primary "> <p className=" text-2xl font-semibold tracking-tight text-primary ">
Free {t("plan.free.title")}
</p> </p>
| |
<p className=" text-base font-semibold tracking-tight text-muted-foreground"> <p className=" text-base font-semibold tracking-tight text-muted-foreground">
Open Source {t("plan.free.subTitle")}
</p> </p>
</div> </div>
<h3 className="mt-5 font-medium text-lg text-white"> <h3 className="mt-5 text-lg font-medium text-white">
Dokploy Open Source {t("plan.free.section.title")}
</h3> </h3>
<p <p
className={clsx( className={clsx(
@@ -238,8 +244,7 @@ export function Pricing() {
featured ? "text-white" : "text-slate-400", featured ? "text-white" : "text-slate-400",
)} )}
> >
Manager your own infrastructure installing dokploy ui in your {t("plan.free.section.description")}
own server.
</p> </p>
<ul <ul
@@ -250,14 +255,14 @@ export function Pricing() {
)} )}
> >
{[ {[
"Complete Flexibility: Install Dokploy UI on your own infrastructure", t("plan.free.features.f1"),
"Unlimited Deployments", t("plan.free.features.f2"),
"Self-hosted Infrastructure", t("plan.free.features.f3"),
"Community Support", t("plan.free.features.f4"),
"Access to Core Features", t("plan.free.features.f5"),
"Dokploy Integration", t("plan.free.features.f6"),
"Basic Backups", t("plan.free.features.f7"),
"Access to All Updates", t("plan.free.features.f8"),
].map((feature) => ( ].map((feature) => (
<li key={feature} className="flex text-muted-foreground"> <li key={feature} className="flex text-muted-foreground">
<CheckIcon /> <CheckIcon />
@@ -265,17 +270,17 @@ export function Pricing() {
</li> </li>
))} ))}
</ul> </ul>
<div className="flex flex-col gap-2 mt-4"> <div className="mt-4 flex flex-col gap-2">
<div className="flex flex-col items-center gap-2 justify-center"> <div className="flex flex-col items-center justify-center gap-2">
<span className="text-sm text-muted-foreground"> <span className="text-sm text-muted-foreground">
Unlimited Servers {t("plan.free.features.f9")}
</span> </span>
<Link <Link
href="https://docs.dokploy.com/en/docs/core/get-started/installation#docker" href="https://docs.dokploy.com/en/docs/core/get-started/installation#docker"
target="_blank" target="_blank"
className="text-sm text-primary flex items-start" className="flex items-start text-sm text-primary"
> >
Installation{" "} {t("plan.free.go")}{" "}
<ArrowRight className="ml-2 size-4 self-center" /> <ArrowRight className="ml-2 size-4 self-center" />
</Link> </Link>
</div> </div>
@@ -283,20 +288,20 @@ export function Pricing() {
</section> </section>
<section <section
className={clsx( className={clsx(
"flex flex-col rounded-3xl border-dashed border-2 px-4 max-w-sm", "flex max-w-sm flex-col rounded-3xl border-2 border-dashed px-4",
featured featured
? "order-first bg-black border py-8 lg:order-none" ? "order-first border bg-black py-8 lg:order-none"
: "lg:py-8", : "lg:py-8",
)} )}
> >
{isAnnual && ( {isAnnual && (
<div className="flex flex-row gap-2 items-center mb-4"> <div className="mb-4 flex flex-row items-center gap-2">
<Badge>Recommended 🚀</Badge> <Badge>{t("plan.cloud.title")} 🚀</Badge>
</div> </div>
)} )}
{isAnnual ? ( {isAnnual ? (
<div className="flex flex-row gap-2 items-center"> <div className="flex flex-row items-center gap-2">
<p className=" text-2xl font-semibold tracking-tight text-primary "> <p className=" text-2xl font-semibold tracking-tight text-primary ">
$ {calculatePrice(serverQuantity, isAnnual).toFixed(2)}{" "} $ {calculatePrice(serverQuantity, isAnnual).toFixed(2)}{" "}
USD USD
@@ -311,12 +316,12 @@ export function Pricing() {
</p> </p>
</div> </div>
) : ( ) : (
<p className=" text-2xl font-semibold tracking-tight text-primary "> <p className=" text-2xl font-semibold tracking-tight text-primary">
$ {calculatePrice(serverQuantity, isAnnual).toFixed(2)} USD $ {calculatePrice(serverQuantity, isAnnual).toFixed(2)} USD
</p> </p>
)} )}
<h3 className="mt-5 font-medium text-lg text-white"> <h3 className="mt-5 text-lg font-medium text-white">
Dokploy Plan {t("plan.cloud.section.title")}
</h3> </h3>
<p <p
className={clsx( className={clsx(
@@ -324,8 +329,7 @@ export function Pricing() {
featured ? "text-white" : "text-slate-400", featured ? "text-white" : "text-slate-400",
)} )}
> >
No need to manage Dokploy UI infrastructure, we take care of {t("plan.cloud.section.description")}
it for you.
</p> </p>
<ul <ul
@@ -336,9 +340,9 @@ export function Pricing() {
)} )}
> >
{[ {[
"Managed Hosting: No need to manage your own servers", t("plan.cloud.features.f1"),
"Priority Support", t("plan.cloud.features.f2"),
"Future-Proof Features", t("plan.cloud.features.f3"),
].map((feature) => ( ].map((feature) => (
<li key={feature} className="flex text-muted-foreground"> <li key={feature} className="flex text-muted-foreground">
<CheckIcon /> <CheckIcon />
@@ -346,10 +350,12 @@ export function Pricing() {
</li> </li>
))} ))}
</ul> </ul>
<div className="flex flex-col gap-2 mt-4"> <div className="mt-4 flex flex-col gap-2">
<div className="flex items-center gap-2 justify-center"> <div className="flex items-center justify-center gap-2">
<span className="text-sm text-muted-foreground"> <span className="text-sm text-muted-foreground">
{serverQuantity} Servers (You bring the servers) {t("plan.cloud.servers", {
serverQuantity,
})}
</span> </span>
</div> </div>
@@ -384,16 +390,18 @@ export function Pricing() {
<div <div
className={cn( className={cn(
"justify-between", "justify-between",
"flex flex-row items-center gap-2 mt-4", "mt-4 flex flex-row items-center gap-2",
)} )}
> >
<div className="justify-end w-full"> <div className="w-full justify-end">
<Link <Link
href="https://app.dokploy.com/register" href="https://app.dokploy.com/register"
target="_blank" target="_blank"
className={buttonVariants({ className: "w-full" })} className={buttonVariants({
className: "w-full",
})}
> >
Subscribe {t("plan.cloud.go")}
</Link> </Link>
</div> </div>
</div> </div>
@@ -412,53 +420,46 @@ export function Pricing() {
const faqs = [ const faqs = [
[ [
{ {
question: "How does Dokploy's Open Source plan work?", question: "faq.q1",
answer: answer: "faq.a1",
"You can host Dokploy UI on your own infrastructure and you will be responsible for the maintenance and updates.",
}, },
{ {
question: "Do I need to provide my own server for the managed plan?", question: "faq.q2",
answer: answer: "faq.a2",
"Yes, in the managed plan, you provide your own server eg(Hetzner, Hostinger, AWS, ETC.) VPS, and we manage the Dokploy UI infrastructure for you.",
}, },
{ {
question: "What happens if I need more than one server?", question: "faq.q3",
answer: answer: "faq.a3",
"The first server costs $4.50/month, if you buy more than one it will be $3.50/month per server.",
}, },
], ],
[ [
{ {
question: "Is there a limit on the number of deployments?", question: "faq.q4",
answer: answer: "faq.a4",
"No, there is no limit on the number of deployments in any of the plans.",
}, },
{ {
question: "What happens if I exceed my purchased server limit?", question: "faq.q5",
answer: answer: "faq.a5",
"The most recently added servers will be deactivated. You won't be able to create services on inactive servers until they are reactivated.",
}, },
{ {
question: "Do you offer a refunds?", question: "faq.q6",
answer: answer: "faq.a6",
"We do not offer refunds. However, you can cancel your subscription at any time. Feel free to try our open-source version for free before making a purchase.",
}, },
], ],
[ [
{ {
question: "What kind of support do you offer?", question: "faq.q7",
answer: answer: "faq.a7",
"We offer community support for the open source version and priority support for paid plans.",
}, },
{ {
question: "Is Dokploy open-source?", question: "faq.q8",
answer: answer: "faq.a8",
"Yes, Dokploy is fully open-source. You can contribute or modify it as needed for your projects.",
}, },
], ],
]; ];
export function Faqs() { export function Faqs() {
const t = useTranslations("Pricing");
return ( return (
<section <section
id="faqs" id="faqs"
@@ -471,11 +472,10 @@ export function Faqs() {
id="faq-title" id="faq-title"
className="font-display text-3xl tracking-tight text-primary sm:text-4xl" className="font-display text-3xl tracking-tight text-primary sm:text-4xl"
> >
{"Frequently asked questions"} {t("faq.title")}
</h2> </h2>
<p className="mt-4 text-lg tracking-tight text-muted-foreground"> <p className="mt-4 text-lg tracking-tight text-muted-foreground">
If you can’t find what you’re looking for, please send us an email {t("faq.description")}:{" "}
to:{" "}
<Link href={"mailto:support@dokploy.com"} className="text-primary"> <Link href={"mailto:support@dokploy.com"} className="text-primary">
support@dokploy.com support@dokploy.com
</Link> </Link>
@@ -488,10 +488,10 @@ export function Faqs() {
{column.map((faq, faqIndex) => ( {column.map((faq, faqIndex) => (
<li key={faqIndex}> <li key={faqIndex}>
<h3 className="font-display text-lg leading-7 text-primary"> <h3 className="font-display text-lg leading-7 text-primary">
{faq.question} {t(faq.question)}
</h3> </h3>
<p className="mt-4 text-sm text-muted-foreground"> <p className="mt-4 text-sm text-muted-foreground">
{faq.answer} {t(faq.answer)}
</p> </p>
</li> </li>
))} ))}

82
apps/website/locales/en.json
View File

@@ -4,18 +4,33 @@
"features": "Features", "features": "Features",
"faqs": "FAQ", "faqs": "FAQ",
"docs": "Docs", "docs": "Docs",
"pricing": "Pricing",
"support": "Support", "support": "Support",
"dashboard": "Dashboard",
"discord": "Discord", "discord": "Discord",
"i18nButtonPlaceholder": "Language", "i18nButtonPlaceholder": "Language",
"i18nEn": "English", "i18nEn": "English",
"i18nZh-Hans": "简体中文" "i18nZh-Hans": "简体中文"
}, },
"hero": { "hero": {
"cloud": "Introducing Dokploy Cloud",
"deploy": "Deploy", "deploy": "Deploy",
"anywhere": "Anywhere", "anywhere": "Anywhere",
"with": "with Total Freedom and Ease.", "with": "with Total Freedom and Ease.",
"des": "Streamline your operations with our all-in-one platform—perfect for managing projects, data, and system health with simplicity and efficiency.", "des": "Streamline your operations with our all-in-one platform—perfect for managing projects, data, and system health with simplicity and efficiency.",
"featuredIn": "Featured in" "featuredIn": "Featured in",
"sponsors": {
"title": "Sponsors",
"description": "Dokploy is an open source project that is maintained by a community of volunteers. We would like to thank our sponsors for their support and contributions to the project, which help us to continue to develop and improve Dokploy.",
"level": {
"hero": "Hero Sponsors",
"premium": "Premium Supporters",
"supporting": "Supporting Members",
"community": "Community Backers",
"organizations": "Organizations",
"individuals": "Individuals"
}
}
}, },
"primaryFeatures": { "primaryFeatures": {
"title": "Comprehensive Control for Your Digital Ecosystem", "title": "Comprehensive Control for Your Digital Ecosystem",
@@ -92,5 +107,70 @@
"intro": "https://docs.dokploy.com/get-started/introduction", "intro": "https://docs.dokploy.com/get-started/introduction",
"install": "https://docs.dokploy.com/en/docs/core/get-started/introduction" "install": "https://docs.dokploy.com/en/docs/core/get-started/introduction"
} }
},
"Pricing": {
"swirlyDoodleTitle": "Simple & Affordable,",
"restTitle": "Pricing.",
"description": "Deploy Smarter, Scale Faster – Without Breaking the Bank",
"billingCycle": {
"monthly": "Monthly",
"annual": "Annual"
},
"plan": {
"free": {
"title": "Free",
"subTitle": "Open Source",
"section": {
"title": "Dokploy Open Source",
"description": "Manager your own infrastructure installing dokploy ui in your own server."
},
"features": {
"f1": "Complete Flexibility: Install Dokploy UI on your own infrastructure",
"f2": "Unlimited Deployments",
"f3": "Self-hosted Infrastructure",
"f4": "Community Support",
"f5": "Access to Core Features",
"f6": "Dokploy Integration",
"f7": "Basic Backups",
"f8": "Access to All Updates",
"f9": "Unlimited Servers"
},
"go": "Installation"
},
"cloud": {
"title": "Recommended",
"section": {
"title": "Dokploy Plan",
"description": " to manage Dokploy UI infrastructure, we take care of it for you."
},
"servers": "{serverQuantity}Servers (You bring the servers)",
"features": {
"f1": "Managed Hosting: No need to manage your own servers",
"f2": "Priority Support",
"f3": "Future-Proof Features"
},
"go": "Subscribe"
}
},
"faq": {
"title": "Frequently asked questions",
"description": "If you can’t find what you’re looking for, please send us an email to",
"q1": "How does Dokploy's Open Source plan work?",
"a1": "You can host Dokploy UI on your own infrastructure and you will be responsible for the maintenance and updates.",
"q2": "Do I need to provide my own server for the managed plan?",
"a2": "Yes, in the managed plan, you provide your own server eg(Hetzner, Hostinger, AWS, ETC.) VPS, and we manage the Dokploy UI infrastructure for you.",
"q3": "What happens if I need more than one server?",
"a3": "The first server costs $4.50/month, if you buy more than one it will be $3.50/month per server.",
"q4": "Is there a limit on the number of deployments?",
"a4": "No, there is no limit on the number of deployments in any of the plans.",
"q5": "What happens if I exceed my purchased server limit?",
"a5": "The most recently added servers will be deactivated. You won't be able to create services on inactive servers until they are reactivated.",
"q6": "Do you offer a refunds?",
"a6": "We do not offer refunds. However, you can cancel your subscription at any time. Feel free to try our open-source version for free before making a purchase.",
"q7": "What kind of support do you offer?",
"a7": "We offer community support for the open source version and priority support for paid plans.",
"q8": "Is Dokploy open-source?",
"a8": "Yes, Dokploy is fully open-source. You can contribute or modify it as needed for your projects."
}
} }
} }

82
apps/website/locales/zh-Hans.json
View File

@@ -4,18 +4,33 @@
"features": "特性", "features": "特性",
"faqs": "FAQ", "faqs": "FAQ",
"docs": "文档", "docs": "文档",
"pricing": "价格",
"support": "赞助", "support": "赞助",
"dashboard": "控制台",
"discord": "Discord", "discord": "Discord",
"i18nButtonPlaceholder": "语言", "i18nButtonPlaceholder": "语言",
"i18nEn": "English", "i18nEn": "English",
"i18nZh-Hans": "简体中文" "i18nZh-Hans": "简体中文"
}, },
"hero": { "hero": {
"cloud": "隆重介绍 Dokploy 云",
"deploy": "部署在", "deploy": "部署在",
"anywhere": "任何设施之上", "anywhere": "任何设施之上",
"with": "", "with": "",
"des": "以前所未有的简洁和高效提供一站式项目、数据的管理以及系统监控。", "des": "以前所未有的简洁和高效提供一站式项目、数据的管理以及系统监控。",
"featuredIn": "发布于" "featuredIn": "发布于",
"sponsors": {
"title": "赞助名单",
"description": "Dokploy 是由社区成员共同支持的完全免费的开源项目，您的慷慨解囊将帮助我们继续开发和改进 Dokploy。",
"level": {
"hero": "特别赞助",
"premium": "金牌赞助",
"supporting": "银牌赞助",
"community": "铜牌赞助",
"organizations": "组织赞助",
"individuals": "个人赞助"
}
}
}, },
"primaryFeatures": { "primaryFeatures": {
"title": "全面掌控您的基础设施", "title": "全面掌控您的基础设施",
@@ -92,5 +107,70 @@
"intro": "https://docs.dokploy.com/cn/docs/core/get-started/introduction", "intro": "https://docs.dokploy.com/cn/docs/core/get-started/introduction",
"install": "https://docs.dokploy.com/cn/docs/core/get-started/introduction" "install": "https://docs.dokploy.com/cn/docs/core/get-started/introduction"
} }
},
"Pricing": {
"swirlyDoodleTitle": "简洁明了的,",
"restTitle": "定价",
"description": "更聪明的部署方式，更快的扩容速度，以及不会让你破产的账单。",
"billingCycle": {
"monthly": "按月",
"annual": "按年"
},
"plan": {
"free": {
"title": "免费",
"subTitle": "开源版本",
"section": {
"title": "部署Dokploy的开源版本",
"description": "自行管理您的基础设施，不收取任何费用"
},
"features": {
"f1": "灵活的架构，您可以单独部署 Dokploy 管理端",
"f2": "无限数量的部署",
"f3": "自维护的基础设施",
"f4": "来自社区的有限支持",
"f5": "所有功能可用",
"f6": "Dokploy 集成",
"f7": "基础备份服务",
"f8": "跟随开源版本更新",
"f9": "无限服务器数量"
},
"go": "立即开始"
},
"cloud": {
"title": "推荐（年付更优惠）",
"section": {
"title": "Dokploy 云",
"description": "使用我们的云服务，一站式管理您所有的部署。"
},
"servers": "{serverQuantity}台受控服务器",
"features": {
"f1": "由 Dokploy 云提供支持的独立控制面板",
"f2": "优先技术支持",
"f3": "优先体验先行功能"
},
"go": "订阅"
}
},
"faq": {
"title": "常见问题",
"description": "如果您的问题不在以下列表，请随时向我们致信",
"q1": "Dokploy 的开源版本是什么？",
"a1": "您可以免费安装 Dokploy 开源版本，并自行负责 Dokploy 的日后维护工作",
"q2": "付费计划还需要自己的服务器吗？",
"a2": "是的，在付费计划中，您依然需要提供您用于实际运行服务的服务器（如阿里云、腾讯云、AWS 等），我们会为您管理 Dokploy 控制面板。",
"q3": "如果我需要管理更多的服务器怎么办？",
"a3": "第一台服务器的费用为 $4.5/月，之后每台的费用是 $3.5/月。",
"q4": "部署服务的数量有限制吗？",
"a4": "不管您如何使用 Dokploy，我们都不会限制您部署服务的数量。",
"q5": "如果我意外超过了最大服务器数量怎么办？",
"a5": "最新添加的服务器将被停用，您将不能向其创建服务，直到它们被重新激活。",
"q6": "关于退款服务的政策？",
"a6": "您可以随时取消您的订阅，但请原谅我们无法提供退款服务，您可以无限试用开源版本，然后再购买。",
"q7": "关于技术支持?",
"a7": "付费计划可以得到优先的技术支持，开源版本则是由社区提供技术支持。",
"q8": "Dokploy 开源吗?",
"a8": "是的，Dokploy 完全开源，您可以参与贡献或者是 Fork 后自行修改以用于您的私人需求。"
}
} }
} }