Merge branch 'pmf-page' into main
@@ -11,7 +11,7 @@ import { Prose } from "@/components/shared/Prose";
|
||||
import { Search } from "@/components/shared/Search";
|
||||
import { ThemeSelector } from "@/components/shared/ThemeSelector";
|
||||
import navigation from "@/lib/docsNavigation";
|
||||
import Button from "../shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import MetaInformation from "../shared/MetaInformation";
|
||||
|
||||
function GitHubIcon(props: any) {
|
||||
|
||||
@@ -2,7 +2,7 @@ import clsx from "clsx";
|
||||
import { usePlausible } from "next-plausible";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import Button from "../shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { SurveyPage } from "./engineTypes";
|
||||
|
||||
interface SurveyProps {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "../shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { SurveyElement } from "./engineTypes";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
|
||||
@@ -24,9 +24,6 @@ const features = [
|
||||
export default function Features() {
|
||||
return (
|
||||
<div className="relative px-4 pt-16 pb-20 sm:px-6 lg:px-8 lg:pt-24 lg:pb-28">
|
||||
<div className="absolute inset-0">
|
||||
<div className="h-1/3 sm:h-2/3" />
|
||||
</div>
|
||||
<div className="relative mx-auto max-w-7xl">
|
||||
<HeadingCentered
|
||||
closer
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "../shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import HeroAnimation from "../shared/HeroAnimation";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
@@ -29,7 +29,7 @@ export default function Hero({}: Props) {
|
||||
<Button variant="secondary" onClick={() => router.push("#best-practices")}>
|
||||
Best practices
|
||||
</Button>
|
||||
<Button variant="primary" className="ml-3" onClick={() => router.push("/waitlist")}>
|
||||
<Button variant="highlight" className="ml-3" onClick={() => router.push("/waitlist")}>
|
||||
Get Access
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
@@ -39,7 +39,7 @@ export default function Highlights({}) {
|
||||
<br />
|
||||
<span className="font-light">ask specific user cohorts.</span>
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-3xl leading-7 text-slate-500 dark:text-slate-400">
|
||||
<p className="text-md mt-6 max-w-lg leading-7 text-slate-500 dark:text-slate-400">
|
||||
Email is spammy and ineffective. Create cohorts based on usage data and reach out to specific
|
||||
cohorts in-app.
|
||||
</p>
|
||||
@@ -64,7 +64,7 @@ export default function Highlights({}) {
|
||||
<br />
|
||||
<span className="font-light">analytics and interviews.</span>
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-3xl leading-7 text-slate-500 dark:text-slate-400">
|
||||
<p className="text-md mt-6 max-w-md leading-7 text-slate-500 dark:text-slate-400">
|
||||
Product analytics tell you WHAT users do, not WHY. Complement user interviews with a constant
|
||||
flow of qualitative user insights.
|
||||
</p>
|
||||
@@ -81,7 +81,7 @@ export default function Highlights({}) {
|
||||
<br />
|
||||
<span className="font-light">Never ask something twice.</span>
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-3xl leading-7 text-slate-500 dark:text-slate-400">
|
||||
<p className="text-md mt-6 max-w-md leading-7 text-slate-500 dark:text-slate-400">
|
||||
With Formbricks you build a database of everyone who signs up to your product. Enrich their
|
||||
profile at key moments in the user journey.
|
||||
</p>
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
import Button from "./Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { useRouter } from "next/router";
|
||||
import clsx from "clsx";
|
||||
|
||||
interface Props {
|
||||
teaser: string;
|
||||
headline: string;
|
||||
subheadline: string;
|
||||
cta: string;
|
||||
href: string;
|
||||
inverted?: boolean;
|
||||
}
|
||||
|
||||
export default function JoinWaitlist({ inverted = false }: Props) {
|
||||
export default function BreakerCTA({ inverted = false, teaser, headline, subheadline, cta, href }: Props) {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<div
|
||||
@@ -14,31 +19,36 @@ export default function JoinWaitlist({ inverted = false }: Props) {
|
||||
inverted
|
||||
? "from-slate-800 via-slate-800 to-slate-700 dark:from-slate-200 dark:to-slate-300"
|
||||
: "from-slate-200 to-slate-300 dark:from-slate-800 dark:via-slate-800 dark:to-slate-700",
|
||||
"mx-auto mb-12 w-full max-w-5xl bg-gradient-to-br sm:rounded-xl md:mb-0 "
|
||||
"xs:mx-auto xs:w-full mx-4 mb-12 max-w-5xl rounded-xl bg-gradient-to-br md:mb-0 "
|
||||
)}>
|
||||
<div className="relative px-4 py-8 sm:px-6 sm:pt-8 sm:pb-12 lg:px-8 lg:pt-12">
|
||||
<div className="absolute right-10 md:top-1/2 md:-translate-y-1/2">
|
||||
<Button variant="highlight" onClick={() => router.push("/waitlist")}>
|
||||
Get Access
|
||||
<div className="xs:block xs:absolute xs:right-10 hidden md:top-1/2 md:-translate-y-1/2">
|
||||
<Button variant="highlight" onClick={() => router.push(`${href}`)}>
|
||||
{cta}
|
||||
</Button>
|
||||
</div>
|
||||
<p className="lg:text-md dark:text-brand-dark text-brand-light text-sm font-semibold uppercase">
|
||||
Curious?
|
||||
{teaser}
|
||||
</p>
|
||||
<h2
|
||||
className={clsx(
|
||||
inverted ? "text-slate-200 dark:text-slate-800" : "text-slate-800 dark:text-slate-200",
|
||||
"mt-4 text-2xl font-bold tracking-tight lg:text-3xl "
|
||||
)}>
|
||||
Get access now!
|
||||
{headline}
|
||||
</h2>
|
||||
<p
|
||||
className={clsx(
|
||||
inverted ? "text-slate-300 dark:text-slate-500" : "text-slate-500 dark:text-slate-300",
|
||||
"text-md mt-4 max-w-3xl lg:text-lg"
|
||||
)}>
|
||||
We’re onboarding design partners regularly. Sign up to get early access.
|
||||
{subheadline}
|
||||
</p>
|
||||
<div className="xs:hidden mt-4">
|
||||
<Button variant="highlight" onClick={() => router.push(`${href}`)}>
|
||||
{cta}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -1,149 +0,0 @@
|
||||
import Link, { LinkProps } from "next/link";
|
||||
import React, { forwardRef } from "react";
|
||||
import clsx from "clsx";
|
||||
|
||||
type SVGComponent = React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
|
||||
|
||||
export type ButtonBaseProps = {
|
||||
variant?: "highlight" | "primary" | "secondary" | "minimal" | "warn" | "alert";
|
||||
size?: "base" | "sm" | "lg" | "fab" | "icon";
|
||||
loading?: boolean;
|
||||
disabled?: boolean;
|
||||
onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
||||
StartIcon?: SVGComponent;
|
||||
startIconClassName?: string;
|
||||
EndIcon?: SVGComponent;
|
||||
endIconClassName?: string;
|
||||
shallow?: boolean;
|
||||
};
|
||||
export type ButtonProps = ButtonBaseProps &
|
||||
(
|
||||
| (Omit<JSX.IntrinsicElements["a"], "href" | "onClick"> & LinkProps)
|
||||
| (Omit<JSX.IntrinsicElements["button"], "onClick"> & { href?: never })
|
||||
);
|
||||
|
||||
export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, ButtonProps>(function Button(
|
||||
props: ButtonProps,
|
||||
forwardedRef
|
||||
) {
|
||||
const {
|
||||
loading = false,
|
||||
variant = "primary",
|
||||
size = "base",
|
||||
StartIcon,
|
||||
startIconClassName,
|
||||
endIconClassName,
|
||||
EndIcon,
|
||||
shallow,
|
||||
// attributes propagated from `HTMLAnchorProps` or `HTMLButtonProps`
|
||||
...passThroughProps
|
||||
} = props;
|
||||
// Buttons are **always** disabled if we're in a `loading` state
|
||||
const disabled = props.disabled || loading;
|
||||
|
||||
// If pass an `href`-attr is passed it's `<a>`, otherwise it's a `<button />`
|
||||
const isLink = typeof props.href !== "undefined";
|
||||
const elementType = isLink ? "a" : "button";
|
||||
|
||||
const element = React.createElement(
|
||||
elementType,
|
||||
{
|
||||
...passThroughProps,
|
||||
disabled,
|
||||
ref: forwardedRef,
|
||||
className: clsx(
|
||||
// base styles independent what type of button it is
|
||||
"inline-flex items-center appearance-none",
|
||||
// different styles depending on size
|
||||
size === "sm" && "px-3 py-2 text-sm leading-4 font-medium rounded-lg",
|
||||
size === "base" && "px-6 py-2 text-sm font-medium rounded-xl",
|
||||
size === "lg" && "px-4 py-2 text-base font-medium rounded-lg",
|
||||
size === "icon" &&
|
||||
"w-10 h-10 justify-center group p-2 border rounded-lg border-transparent text-neutral-400 hover:border-gray-200 transition",
|
||||
// turn button into a floating action button (fab)
|
||||
size === "fab" ? "fixed" : "relative",
|
||||
size === "fab" && "justify-center bottom-20 right-8 rounded-full p-4 w-14 h-14",
|
||||
|
||||
// different styles depending on variant
|
||||
variant === "highlight" &&
|
||||
(disabled
|
||||
? "border border-transparent bg-gray-400 text-white"
|
||||
: "text-slate-900 bg-gradient-to-b from-brand-light to-brand-dark hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-slate-900 transition ease-in-out delay-50 hover:scale-105"),
|
||||
variant === "primary" &&
|
||||
(disabled
|
||||
? "border border-transparent bg-gray-400 text-white"
|
||||
: "text-slate-900 bg-gradient-to-b from-brand-light to-brand-dark hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-slate-900"),
|
||||
|
||||
variant === "secondary" &&
|
||||
(disabled
|
||||
? "border border-gray-200 text-gray-400 bg-white"
|
||||
: "hover:text-slate-600 hover:bg-slate-300 bg-slate-200 text-slate-700 hover:shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-neutral-900 dark:text-slate-400 dark:hover:text-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 transition ease-in-out delay-50 hover:scale-105"),
|
||||
variant === "alert" &&
|
||||
(disabled
|
||||
? "border border-transparent bg-gray-400 text-white"
|
||||
: "border border-transparent dark:text-darkmodebrandcontrast text-brandcontrast bg-red-600 dark:bg-darkmodebrand hover:bg-opacity-90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-neutral-900"),
|
||||
variant === "minimal" &&
|
||||
(disabled
|
||||
? "text-slate-400 dark:text-slate-500 bg-slate-200 dark:bg-slate-800"
|
||||
: "text-slate-600 hover:text-slate-500 bg-slate-200 hover:bg-slate-100 dark:bg-slate-800 dark:text-slate-300 dark:hover:text-slate-400 dark:hover:bg-slate-900 focus:outline-none focus:ring-2 focus:ring-offset-1 dark:focus:bg-slate-900 focus:bg-slate-700 focus:ring-neutral-500 transition ease-in-out delay-50 hover:scale-105"),
|
||||
variant === "warn" &&
|
||||
(disabled
|
||||
? "text-gray-400 bg-transparent"
|
||||
: "text-gray-700 bg-transparent hover:text-red-700 hover:bg-red-100 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:bg-red-50 focus:ring-red-500"),
|
||||
|
||||
// set not-allowed cursor if disabled
|
||||
loading ? "cursor-wait" : disabled ? "cursor-not-allowed" : "",
|
||||
props.className
|
||||
),
|
||||
// if we click a disabled button, we prevent going through the click handler
|
||||
onClick: disabled
|
||||
? (e: React.MouseEvent<HTMLElement, MouseEvent>) => {
|
||||
e.preventDefault();
|
||||
}
|
||||
: props.onClick,
|
||||
},
|
||||
<>
|
||||
{StartIcon && (
|
||||
<StartIcon
|
||||
className={clsx(
|
||||
"inline",
|
||||
size === "icon" ? "h-4 w-4 " : "-ml-1 h-4 w-4 ltr:mr-2 rtl:ml-2 rtl:-mr-1",
|
||||
startIconClassName || ""
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
{props.children}
|
||||
{loading && (
|
||||
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transform">
|
||||
<svg
|
||||
className={clsx(
|
||||
"mx-4 h-5 w-5 animate-spin",
|
||||
variant === "primary" ? "text-white dark:text-slate-900" : "text-slate-900"
|
||||
)}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24">
|
||||
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
|
||||
<path
|
||||
className="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
)}
|
||||
{EndIcon && (
|
||||
<EndIcon className={clsx("-mr-1 inline h-5 w-5 ltr:ml-2 rtl:mr-2", endIconClassName || "")} />
|
||||
)}
|
||||
</>
|
||||
);
|
||||
return props.href ? (
|
||||
<Link passHref href={props.href} shallow={shallow && shallow}>
|
||||
{element}
|
||||
</Link>
|
||||
) : (
|
||||
element
|
||||
);
|
||||
});
|
||||
|
||||
export default Button;
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "@/components/shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { useRouter } from "next/router";
|
||||
import HeadingCentered from "./HeadingCentered";
|
||||
|
||||
|
||||
35
apps/formbricks-com/components/shared/EarlyBirdDeal.tsx
Normal file
@@ -0,0 +1,35 @@
|
||||
import { useRouter } from "next/router";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import Image from "next/image";
|
||||
import EarlyBird from "@/images/early bird deal for open source jotform alternative typeform and surveymonkey_v2.svg";
|
||||
|
||||
export default function EarlyBirdDeal() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<div className="bg-brand-dark relative mx-4 max-w-7xl overflow-hidden rounded-xl p-6 pb-16 sm:p-8 sm:pb-16 md:py-8 md:px-12 lg:flex lg:items-center">
|
||||
<div className="lg:w-0 lg:flex-1 ">
|
||||
<h2
|
||||
className="mb-1 text-2xl font-bold tracking-tight text-white sm:text-2xl"
|
||||
id="newsletter-headline">
|
||||
50% off for early birds.
|
||||
</h2>
|
||||
<h2 className="text-xl font-semibold tracking-tight text-slate-200 sm:text-lg">
|
||||
Limited Early Bird deal. Only{" "}
|
||||
<span className="bg- rounded-sm bg-slate-200/40 px-2 py-0.5 text-slate-100">17</span> left.
|
||||
</h2>
|
||||
|
||||
<div className="mt-6">
|
||||
<Button variant="secondary" onClick={() => router.push("https://app.formbricks.com/auth/signup")}>
|
||||
Get Early Bird Deal
|
||||
</Button>
|
||||
</div>
|
||||
<p className="mt-2 mb-24 max-w-3xl text-xs tracking-tight text-slate-200 md:mb-0 md:max-w-sm lg:max-w-none">
|
||||
This saves you $588 every year.
|
||||
</p>
|
||||
<div className="absolute -right-20 -bottom-36 mx-auto h-96 w-96 scale-75 sm:-right-10">
|
||||
<Image src={EarlyBird} fill alt="formbricks favicon open source forms typeform alternative" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "./Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { useRouter } from "next/router";
|
||||
import clsx from "clsx";
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@ import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import { Fragment } from "react";
|
||||
import Button from "./Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { FooterLogo } from "./Logo";
|
||||
import { ThemeSelector } from "./ThemeSelector";
|
||||
|
||||
|
||||
112
apps/formbricks-com/components/shared/HeaderPMF.tsx
Normal file
@@ -0,0 +1,112 @@
|
||||
import { Popover, Transition } from "@headlessui/react";
|
||||
import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import { Fragment } from "react";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { FooterLogo } from "./Logo";
|
||||
import { ThemeSelector } from "./ThemeSelector";
|
||||
|
||||
export default function Header() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Popover className="relative" as="header">
|
||||
<div className="flex items-center justify-between px-4 py-6 sm:px-6 md:justify-start ">
|
||||
<div className="flex w-0 flex-1 justify-start">
|
||||
<Link href="/">
|
||||
<span className="sr-only">Formbricks</span>
|
||||
<FooterLogo className="h-8 w-auto sm:h-10" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="-my-2 -mr-2 md:hidden">
|
||||
<Popover.Button className="inline-flex items-center justify-center rounded-md bg-gray-100 p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-teal-500 dark:bg-slate-700 dark:text-slate-200">
|
||||
<span className="sr-only">Open menu</span>
|
||||
<Bars3Icon className="h-6 w-6" aria-hidden="true" />
|
||||
</Popover.Button>
|
||||
</div>
|
||||
<Popover.Group as="nav" className="hidden space-x-10 md:flex">
|
||||
<Link
|
||||
href="#howitworks"
|
||||
className="text-base font-medium text-slate-400 hover:text-slate-700 dark:hover:text-slate-300">
|
||||
How it works
|
||||
</Link>
|
||||
<Link
|
||||
href="#pricing"
|
||||
className="text-base font-medium text-slate-400 hover:text-slate-700 dark:hover:text-slate-300">
|
||||
Pricing <p className="bg-brand inline rounded-full px-2 text-xs text-white">50%</p>
|
||||
</Link>
|
||||
</Popover.Group>
|
||||
<div className="hidden flex-1 items-center justify-end md:flex">
|
||||
<ThemeSelector className="relative z-10 mr-5" />
|
||||
<Button variant="secondary" className="ml-2" href="https://app.formbricks.com/demo" target="_blank">
|
||||
Try Demo
|
||||
</Button>
|
||||
<Button
|
||||
variant="highlight"
|
||||
className="ml-2"
|
||||
href="https://app.formbricks.com/auth/signup"
|
||||
target="_blank">
|
||||
Sign Up
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Transition
|
||||
as={Fragment}
|
||||
enter="duration-200 ease-out"
|
||||
enterFrom="opacity-0 scale-95"
|
||||
enterTo="opacity-100 scale-100"
|
||||
leave="duration-100 ease-in"
|
||||
leaveFrom="opacity-100 scale-100"
|
||||
leaveTo="opacity-0 scale-95">
|
||||
<Popover.Panel
|
||||
focus
|
||||
className="absolute inset-x-0 top-0 z-20 origin-top-right transform p-2 transition md:hidden">
|
||||
<div className="dark:divide-slate divide-y-2 divide-gray-100 rounded-lg bg-gray-200 shadow-lg ring-1 ring-black ring-opacity-5 dark:divide-gray-700 dark:bg-slate-800">
|
||||
<div className="px-5 pt-5 pb-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<FooterLogo className="h-8 w-auto" />
|
||||
</div>
|
||||
<div className="-mr-2">
|
||||
<Popover.Button className="inline-flex items-center justify-center rounded-md bg-white p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-teal-500 dark:bg-slate-700 dark:text-slate-200">
|
||||
<span className="sr-only">Close menu</span>
|
||||
<XMarkIcon className="h-6 w-6" aria-hidden="true" />
|
||||
</Popover.Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="px-5 py-6">
|
||||
<div className="flex flex-col space-y-5 text-center text-sm dark:text-slate-300">
|
||||
<Link href="#howitworks">How it works</Link>
|
||||
<Link href="#pricing">Pricing</Link>
|
||||
<Button
|
||||
variant="secondary"
|
||||
target="_blank"
|
||||
onClick={() => router.push("https://app.formbricks.com/demo")}
|
||||
className="flex w-full justify-center fill-slate-800 dark:fill-slate-200">
|
||||
Try Demo
|
||||
</Button>
|
||||
<Button
|
||||
variant="primary"
|
||||
target="_blank"
|
||||
onClick={() => router.push("https://app.formbricks.com/auth/signup")}
|
||||
className="flex w-full justify-center">
|
||||
Sign Up
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Popover.Panel>
|
||||
</Transition>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
|
||||
function GitHubIcon(props: any) {
|
||||
return (
|
||||
<svg aria-hidden="true" viewBox="0 0 16 16" {...props}>
|
||||
<path d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z" />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
@@ -17,7 +17,7 @@ import clsx from "clsx";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import { Fragment } from "react";
|
||||
import Button from "./Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { FooterLogo } from "./Logo";
|
||||
import { ThemeSelector } from "./ThemeSelector";
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@ import Image from "next/image";
|
||||
import clsx from "clsx";
|
||||
import Highlight, { defaultProps } from "prism-react-renderer";
|
||||
|
||||
import { Button } from "@/components/shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { HeroBackground } from "@/components/shared/HeroBackground";
|
||||
import blurCyanImage from "@/images/blur-cyan.png";
|
||||
import blurIndigoImage from "@/images/blur-indigo.png";
|
||||
|
||||
@@ -25,6 +25,7 @@ const BestPractices = [
|
||||
description: "Find out how disappointed people would be if they could not use your service any more.",
|
||||
category: "In-Moment",
|
||||
icon: PMFIcon,
|
||||
href: "/pmf",
|
||||
},
|
||||
{
|
||||
title: "Feature Chaser",
|
||||
|
||||
24
apps/formbricks-com/components/shared/LayoutPMF.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import Footer from "./Footer";
|
||||
import HeaderPMF from "./HeaderPMF";
|
||||
import MetaInformation from "./MetaInformation";
|
||||
|
||||
interface LayoutProps {
|
||||
children: React.ReactNode;
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
export default function Layout({ title, description, children }: LayoutProps) {
|
||||
return (
|
||||
<div className="flex h-screen flex-col justify-between">
|
||||
<MetaInformation title={title} description={description} />
|
||||
<HeaderPMF />
|
||||
{
|
||||
<main className="max-w-8xl relative mx-auto mb-auto flex w-full flex-col justify-center sm:px-2 lg:px-8 xl:px-12">
|
||||
{children}
|
||||
</main>
|
||||
}
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "@/components/shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { useRouter } from "next/router";
|
||||
import HeadingCentered from "./HeadingCentered";
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "./Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { DocumentDuplicateIcon } from "@heroicons/react/24/outline";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import Image from "next/image";
|
||||
import Button from "@/components/shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import Friends from "@/images/newsletter-signup-gif.gif";
|
||||
|
||||
export default function WaitlistForm() {
|
||||
|
||||
110
apps/formbricks-com/components/shared/PricingPmf.tsx
Normal file
@@ -0,0 +1,110 @@
|
||||
import { useRouter } from "next/router";
|
||||
import HeadingCentered from "./HeadingCentered";
|
||||
import clsx from "clsx";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import EarlyBirdDeal from "./EarlyBirdDeal";
|
||||
|
||||
const tiers = [
|
||||
{
|
||||
name: "Self-hosting",
|
||||
href: "#",
|
||||
priceMonthly: "tba",
|
||||
button: "secondary",
|
||||
discounted: false,
|
||||
highlight: false,
|
||||
paymentRythm: "/month",
|
||||
description: "Host Formbricks on your own server.",
|
||||
ctaName: "Contact us",
|
||||
ctaAction: () => window.open("mailto:hola@formbricks.com"),
|
||||
},
|
||||
{
|
||||
name: "Cloud",
|
||||
href: "#",
|
||||
priceMonthly: "$99",
|
||||
button: "highlight",
|
||||
discounted: true,
|
||||
highlight: true,
|
||||
paymentRythm: "/month",
|
||||
description: "Use the managed cloud, gather insights immediately.",
|
||||
ctaName: "Sign up now",
|
||||
ctaAction: () => window.open("https://app.formbricks.com/auth/signup"),
|
||||
},
|
||||
];
|
||||
|
||||
export default function PricingPmf() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<div className="-mt-10 pb-20">
|
||||
<div className="mx-auto max-w-7xl py-4 sm:px-6 sm:pb-6 lg:px-8 ">
|
||||
<HeadingCentered heading="One price, unlimited usage." teaser="Pricing" />
|
||||
|
||||
<div className="mx-auto space-y-4 px-4 sm:grid sm:grid-cols-2 sm:gap-6 sm:space-y-0 md:px-0 lg:max-w-5xl">
|
||||
{tiers.map((tier) => (
|
||||
<div
|
||||
key={tier.name}
|
||||
className={clsx(
|
||||
`rounded-lg shadow-sm`,
|
||||
tier.highlight
|
||||
? "border border-slate-300 bg-slate-200 dark:border-slate-500 dark:bg-slate-600"
|
||||
: "bg-slate-100 dark:bg-slate-700"
|
||||
)}>
|
||||
<div className="p-8">
|
||||
<h2
|
||||
className={clsx(
|
||||
"inline-flex text-3xl font-bold",
|
||||
tier.highlight
|
||||
? "text-slate-700 dark:text-slate-200"
|
||||
: "text-slate-500 dark:text-slate-300"
|
||||
)}>
|
||||
{tier.name}
|
||||
</h2>
|
||||
<p
|
||||
className={clsx(
|
||||
"mt-4 whitespace-pre-wrap text-sm",
|
||||
tier.highlight ? "text-gray-600 dark:text-slate-300" : "text-gray-500 dark:text-slate-300"
|
||||
)}>
|
||||
{tier.description}
|
||||
</p>
|
||||
<p className="mt-8">
|
||||
<span
|
||||
className={clsx(
|
||||
`text-4xl font-light`,
|
||||
tier.highlight
|
||||
? "text-slate-800 dark:text-slate-100"
|
||||
: "text-slate-500 dark:text-slate-200",
|
||||
tier.discounted ? "decoration-brand line-through" : ""
|
||||
)}>
|
||||
{tier.priceMonthly}
|
||||
</span>{" "}
|
||||
<span className="text-4xl font-bold text-slate-900 dark:text-slate-50">
|
||||
{tier.discounted && "$49"}
|
||||
</span>
|
||||
<span
|
||||
className={clsx(
|
||||
"text-base font-medium",
|
||||
tier.highlight
|
||||
? "text-gray-500 dark:text-slate-400"
|
||||
: "text-gray-400 dark:text-slate-500"
|
||||
)}>
|
||||
{tier.paymentRythm}
|
||||
</span>
|
||||
</p>
|
||||
{tier.ctaName && tier.ctaAction && (
|
||||
<Button
|
||||
onClick={tier.ctaAction}
|
||||
className="mt-6 w-full justify-center py-4 text-lg shadow-sm"
|
||||
variant={tier.highlight ? "highlight" : "secondary"}>
|
||||
{tier.ctaName}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx-auto max-w-5xl">
|
||||
<EarlyBirdDeal />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import Button from "../shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { DocumentDuplicateIcon } from "@heroicons/react/24/outline";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
|
||||
BIN
apps/formbricks-com/images/dashboard-mockup-dark.png
Normal file
|
After Width: | Height: | Size: 270 KiB |
BIN
apps/formbricks-com/images/dashboard-mockup.png
Normal file
|
After Width: | Height: | Size: 283 KiB |
@@ -0,0 +1,276 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 26.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 983.1 626" style="enable-background:new 0 0 983.1 626;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#F7941E;}
|
||||
.st1{fill:#FFF200;}
|
||||
.st2{fill:#FFFFFF;}
|
||||
.st3{fill:#BE1E2D;}
|
||||
.st4{fill:#231F20;}
|
||||
.st5{fill:#FFFFFF;stroke:#000000;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
|
||||
.st6{fill:none;}
|
||||
.st7{fill:none;stroke:#000000;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
|
||||
.st8{fill:none;stroke:#000000;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;}
|
||||
</style>
|
||||
<g id="Layer_1">
|
||||
<path class="st0" d="M458,504.7c-1.3-1.6-2.1-3.6-2.3-5.7c-2.8-5.9-2.4-14.1-2.8-20.1c-0.3-4.1-1.6-10.9-0.8-16.3
|
||||
c-3.5-0.2-7-0.5-10.5-0.8c0.8,5.1,1,10.5,1.4,15.6c0.7,7.3,1.7,14.6,1.7,22c0,1.6-0.9,3-2.3,3.6c-2.4,4.9-6.5,8.3-11.2,11.2
|
||||
c-6.6,4.1-13.1,8.1-19.3,13c-10.8,8.7-20.3,18.8-28.2,30.1c8.1-2.4,16-10.5,21.6-15.4c7.4-6.4,14.4-13.4,20.9-20.7
|
||||
c3.3-3.7,8.4,1,6.5,5c-5,10.3-9.4,21-13.2,31.8c-1.8,5.1-3.4,10.2-4.9,15.4c-0.8,2.8-1.6,5.5-2.3,8.3c-0.8,3-2.9,6.7,0.4,8.6
|
||||
c1.4,1.8,2.5,1.6,3.1-0.7c0.6-1.1,1.2-2.2,1.8-3.4c1.3-2.5,2.6-5.1,3.8-7.7c2.5-5.1,4.9-10.3,7.1-15.5c4.4-10.1,8.4-20.4,12-30.8
|
||||
c1.6-4.7,7.6-3.5,8.2,1.1c2.4,19.2,5,38.5,12.3,56.5c1.4-3.2,1.2-7.3,1.1-10.6c-0.1-6.5-0.2-13.1-0.3-19.6
|
||||
c-0.2-13.9-0.4-27.7-0.6-41.6c0.1-1.8,1.3-3.5,3-4c8.1-3.4,14.5-9.8,17.8-17.9c-6.5,2.5-12.7,5.9-18.4,10
|
||||
C461.8,507.7,459.3,506.4,458,504.7z"/>
|
||||
<path class="st0" d="M299.5,303.9c-1.6,1.9-2.9,4-4.2,6.2c-3.7,6.6-7.1,13.5-10.3,20.4c-3.7,7.7-7.1,15.5-10.3,23.4
|
||||
c-1.7,4.2-3.8,8.7-5,13.3l10-10.9c2.6-2.8,8.5-0.8,7.9,3.3c-1.7,13.4-2.5,26.9-2.5,40.5c0,6.8,0.2,13.5,0.7,20.3
|
||||
c0.4,6,0.1,13.3,2.7,18.8c4.1,8.7,9.1,1.3,10.8-4.1c2-6.3,3.7-12.7,5.6-19.1l10.7-37c-2.8-5.3-5.2-10.7-7.2-16.3
|
||||
C301.8,343.8,298.7,323.9,299.5,303.9z"/>
|
||||
<path class="st1" d="M356.6,416.8c11.3,11.5,23.5,20.8,38.9,26c30.6,10.3,64.4,10.8,96.4,9.6c17.2-0.6,35.1-1.2,52.1-4.2
|
||||
c16-2.9,29.9-10.5,44-18.2c26.1-14.2,50.6-30.5,64.1-58c12.7-25.7,16.7-56.7,16.2-85.1c-0.6-31.2-16.3-62.5-35.7-86.5
|
||||
c-18.6-23-45-39.5-75.2-39.3c-5.7,0-5.5-8.2,0-8.7c5.3-0.4,10.7-0.3,16,0.4c-0.2-3.5,0.1-6.9,0.8-10.3c0.8-4.5,2.3-9,0.7-13.5
|
||||
c-3.9-11.1-18.8,3.9-22.6,8.6c-2.8,3.5-7.8,0.2-8-3.3c-0.6-7.3-1.3-14.7-2.4-21.9c-0.4-2.6-0.3-6.2-3.5-4.7c-2.3,1.1-4,4.4-5.4,6.3
|
||||
c-7.4,10.6-13.7,22-18.7,34c-1.6,3.8-8.5,5.3-9.3,0c-2.8-17.7-6.8-35.2-12.1-52.3c-2.5-8.2-5.4-16.3-8.4-24.4c-1.5-4-3.1-8-4.7-12
|
||||
c-0.3-0.8-2-5.6-3-6.2c-2.4-1.5-5.2,1.3-6.7,2.8c-10.8,10.4-18.2,26.4-22.4,40.5c-4.6,15-5.9,30.8-3.7,46.3c0.7,4.6-4.7,7-7.4,3.1
|
||||
c-4-5.5-33.3-46.2-40.6-33.4c-2.1,3.6,0.3,9.8,1.4,13.3c1.3,4.3,3,8.5,5,12.5c3.8,7.6,8.4,14.9,13.6,21.6c4.9-0.3,9.9,0,14.8,0.7
|
||||
c2.4,0.4,2.4,4.6,0,4.9c-15.6,2.3-31.4,5.4-45.7,12.1c-14.2,6.7-27.1,16.1-37.8,27.6c-21.7,23.3-33.9,54.7-37.2,86.1
|
||||
c0,0.2,0,0.3-0.1,0.5c-0.1,0.7-0.2,1.4-0.2,2.1c-2.6,29.8,2.3,60.6,17.7,86.5C335.4,393.9,345.8,405.7,356.6,416.8z M640.8,305.5
|
||||
c-0.4,1-2.1,0.9-2-0.3c0.8-7.7,0.9-15.4,0.3-23.1c-0.1-1.2,1.6-1.2,1.9-0.2C643.7,289.5,643.6,297.9,640.8,305.5z M609,194.2
|
||||
c11.3,7.1,20.2,17.5,25.5,29.9c4.6,10.6,9.4,26.6,4.9,37.9c-0.3,0.9-1.8,1.1-2,0c-1.1-6.2-0.5-12.6-1.5-18.8
|
||||
c-1-6.1-2.7-12.1-5.2-17.9c-5.1-11.6-12.7-21.9-22.3-30.2C607.8,194.7,608.5,193.9,609,194.2z M603.3,299.9c0.3-1,0.8-1.9,1.5-2.6
|
||||
c1.6-1.6,4.1-2.1,6.2-1.2c2.1,0.9,3.5,2.9,3.5,5.2c0,0.1,0,0.1,0,0.2v-0.2c0.1,0.8-0.1,1.6-0.4,2.4c-0.3,0.8-0.9,1.6-1.6,2.1
|
||||
c-0.6,0.5-1.3,0.8-2,1h-0.1l-0.3,0.1c-1.2,0.2-2.4,0.1-3.5-0.3c-0.7-0.2-1.3-0.6-1.8-1.2c-0.2-0.2-0.3-0.3-0.5-0.5
|
||||
c-0.2-0.2-0.4-0.5-0.6-0.8c-0.2-0.4-0.3-0.8-0.5-1.1C603,301.8,603,300.8,603.3,299.9L603.3,299.9z M534.8,128.6
|
||||
c0.1-1,1.6-1.4,1.9-0.3c0.9,3.3,1.3,7.6-0.4,10.7c-0.3,0.6-1.1,0.8-1.7,0.4c-0.3-0.2-0.5-0.4-0.5-0.7
|
||||
C533.6,135.5,534.3,131.8,534.8,128.6z M517.3,248.2c2-14.9,9.8-29.4,22.5-36c5.6-3.6,13-4.9,19.4-4.5c5.5,0.4,12.1,0.7,17.3,3
|
||||
s8.1,6.7,11.1,11.1c11.5,17.7,18.5,41.3,5.2,60.1c-11.1,15.6-31.6,22.8-49.5,15.5C523,289,514.5,269,517.3,248.2z M487.3,120.8
|
||||
c1.7,4.6,4.5,10.6,2.6,15.6c-0.2,0.6-0.8,0.9-1.4,0.8c-0.4-0.1-0.7-0.4-0.8-0.8c-0.9-2.2-0.8-4.5-1-6.9c-0.1-2.8-0.5-5.6-1-8.3
|
||||
c-0.1-0.5,0.1-0.9,0.6-1C486.8,120.1,487.2,120.4,487.3,120.8L487.3,120.8z M473.4,73.9c4.7,10.7,9.6,22.1,10.5,33.8
|
||||
c0.1,1.5-2,1.5-2.4,0.3c-4.1-10.8-6.3-22.3-10.2-33.3C470.9,73.6,472.9,72.7,473.4,73.9z M447.7,306.7c0.3-8.9,0-18.7,2.7-27.3
|
||||
c-0.3-0.6-0.3-1.4,0.1-2c4-6,13.1-7.8,19.7-9.5c6-1.6,15-4.7,21-2.1c1.9,0.7,2.9,2.8,2.4,4.7c0.6,1.2,0.9,2.5,1,3.8
|
||||
c0.5,5.2,0.4,10.6,0.4,15.8c0,9.6-0.3,19.3-1.2,28.9c-1.3,14-5.5,30.2-20.9,34.4c-14.5,4-23.5-7.8-25-20.9
|
||||
C446.8,323.9,447.4,315.2,447.7,306.7z M398.5,425.2c-5.7,0.6-12.3-4.3-15.5-8.7c-0.5-0.8,0.5-1.9,1.3-1.3c2.2,1.8,4.5,3.3,7,4.6
|
||||
c2.5,1.2,5.4,1.7,7.8,3C400.4,423.5,399.6,425.1,398.5,425.2z M377.3,219.4c10.6-5.4,24-5.6,33.8,0.4c3.8,1.9,7,4.7,9.4,8.1
|
||||
c6.4,9,6.6,20.6,5.2,31.2c-2.4,18-14,33-32.8,35.5c-17.6,2.4-33.9-10.2-38-27.2C350.3,248.6,360.3,228,377.3,219.4z M339.1,342.3
|
||||
c1.6,13.6,3.2,26.2,10.1,38.4c3.3,5.8,7.3,11.2,12.1,15.9c4.5,4.4,9.7,7.7,14.4,11.8c0.4,0.5,0.4,1.2,0,1.6
|
||||
c-0.3,0.3-0.7,0.4-1.1,0.3c-12.7-4.1-23-17-29.1-28.4c-6.2-11.6-10.8-26.6-7.5-39.8C338.1,341.5,339,341.7,339.1,342.3z
|
||||
M327.2,304.7c-0.5-0.6-0.8-1.3-1-2c-0.3-1-0.3-2,0-3c0.4-1.4,1.3-2.6,2.6-3.4c1.3-0.7,2.9-1,4.3-0.6c1.9,0.5,3.4,2,3.9,3.9
|
||||
c0.2,0.7,0.3,1.3,0.3,2c0,1.1-0.3,2.1-0.8,3.1c-0.6,1-1.5,1.8-2.6,2.2c-0.9,0.4-1.8,0.5-2.8,0.4c-1.2-0.1-2.2-0.7-3.1-1.5l-0.8-1.1
|
||||
L327.2,304.7z"/>
|
||||
<path class="st2" d="M399.4,247.7c0.5-3.3-3.7-5.8-6.4-3.9c-1.5,1.1-2,2.7-2.2,4.5c0.1,0.4,0.3,0.7,0.5,1
|
||||
C393.6,252.7,398.8,252,399.4,247.7z"/>
|
||||
<path class="st2" d="M375,280.7c12.7,9.1,31.1,2.8,37.7-10.8c7.4-15.2,7.9-45.8-13.3-47.3c-1.2-0.1-4.6,0-4.7,1.2
|
||||
c-8.3,0.4-16.1,4.1-21.7,10.3C361,247.1,359.5,269.5,375,280.7z M382,242.3c0.8-2.3,2.2-4.4,4.1-6c1.6-1.8,3.8-2.9,6.2-2.9
|
||||
c0.3,0,0.5-0.1,0.8-0.1c10.7-1.2,19.3,9.8,14.3,19.7c-4.9,9.7-19,10-23.8,0.1C381,250.6,380.9,245.6,382,242.3L382,242.3z"/>
|
||||
<path class="st3" d="M468.8,345.3c9.5-1.2,13.2-9.6,15-18.3c-5-2.4-8.3-7.5-13.3-10.2c-4.6-2.4-9.3-2.2-14.1-2.6c0,1.6,0,3.2,0,4.7
|
||||
C456.3,327.5,455.2,347.1,468.8,345.3z"/>
|
||||
<path class="st0" d="M566.7,502.1c-1.4-9.5-1-19.4-0.9-29c0-6.5-0.4-13.7,0.3-20.4c-2.7,1.1-5.4,2-8.2,2.8c1.5,5.9,2,12,2.8,18
|
||||
c0.9,7.3,1.9,14.6,2.5,22c0.1,0.8-0.1,1.6-0.6,2.3c0.5,2.2-2,4.8-4.2,3.2l-2-1.5c-0.5-0.2-1-0.6-1.4-1c-6.8-5.1-13.6-9.7-21.7-12.5
|
||||
c-0.2,5.8,5.9,11.4,9.8,14.7c5.5,4.6,11.7,8.3,18.3,11c2.2,0.7,3.5,3,3,5.2c-3.7,26.5-4.3,52.9-5.2,79.5c2.2-3,2.6-13.4,2.7-15
|
||||
c0.5-5.6,1.1-11.2,1.6-16.9c1.1-11.6,2.2-23.2,3.3-34.9c0-1.9,1.6-3.4,3.5-3.3c1.5,0,2.8,1,3.2,2.4c7.1,20.4,19.2,38.7,34.3,54
|
||||
c0.8-4-1.8-8.9-3.4-12.3c-2.5-5.3-5.1-10.5-7.8-15.6c-5.7-11-11.7-21.8-18-32.5c-2.4-4.1,2.9-7.6,6.2-4.8
|
||||
c10.2,8.6,21.2,16.2,32.7,22.8c8.9,5.2,19.7,12.6,30.5,14.2c-1.6-1.6-3.3-3.1-5.2-4.4c-3.4-2.6-6.9-5.2-10.4-7.7
|
||||
c-6.4-4.6-12.9-9.1-19.4-13.5c-13-8.7-26.3-17-39.9-24.7C570.7,505.9,567.2,505.6,566.7,502.1z"/>
|
||||
<path class="st0" d="M685.5,380.9c2.8,4.4,15.8,24.8,20.4,14.1c2-4.5,1.4-9.9,1.2-14.6c-0.2-6-0.7-12-1.6-18
|
||||
c-1.7-11.4-4.4-22.5-8.3-33.3c-1.5-4.2,4.9-8.1,7.7-4.5l7.8,10.1c-2.7-8.9-5.6-17.6-9.9-25.9c-6.3-12-16.9-20.8-25-31.2
|
||||
c0.8,9.7,0.8,19.5,0,29.3c-0.9,14.2-3.1,28.4-6.5,42.2c0.7,0.6,1.2,1.4,1.4,2.3C675.3,361.8,679.7,371.8,685.5,380.9z"/>
|
||||
<path class="st2" d="M567.9,289.4c21.3-7.2,26.3-29.8,19.1-49.1c-2-5.2-4.6-10.2-7.6-14.8c-3.2-5.1-6.1-7.3-12-8.3
|
||||
c-5.8-1-12.1-2.2-18-1.1c-4.8,0.8-9.3,3.2-12.6,6.8c-9.3,10.7-13,27.1-10.7,40.8C529.3,282.5,549.5,295.6,567.9,289.4z M553.9,233
|
||||
c0.3-0.4,0.6-0.9,1-1.2c3.3-3.5,8.6-3.9,12.8-2c8.8,4.1,11.3,18.8,3,24.7c-8.7,6.3-19-1.7-19.9-11.1
|
||||
C550.5,239.7,551.6,236,553.9,233L553.9,233z"/>
|
||||
<path class="st2" d="M564.2,247.6c3.4-0.7,2.5-6.9,0.6-8.7c-3-2.9-3.8,1.1-5.2,3.1l0,0C559.6,245.3,561.1,248.2,564.2,247.6z"/>
|
||||
<path class="st4" d="M472.8,353.3c15.4-4.2,19.6-20.4,20.9-34.4c0.9-9.6,1.2-19.3,1.2-28.9c0-5.2,0.1-10.6-0.4-15.8
|
||||
c-0.1-1.4-0.2-2.7-0.4-4.5c-0.4-3-0.8-3-3-4c-6-2.6-15,0.5-21,2.1c-6.6,1.7-15.6,3.5-19.7,9.5c-0.7,1.1-1.2,2.2-1.5,3.4
|
||||
c-1.5,9.2-0.9,17-1.2,25.9c-0.3,8.5-0.9,17.3,0.1,25.8C449.4,345.5,458.3,357.3,472.8,353.3z M456.3,319c0-1.6,0-3.2,0-4.7
|
||||
c4.8,0.4,9.5,0.2,14.1,2.6c5,2.6,8.3,7.8,13.3,10.2c-1.7,8.7-5.5,17.1-15,18.3C455.2,347.1,456.3,327.5,456.3,319z"/>
|
||||
<path class="st4" d="M543.2,297.3c18,7.3,38.5,0.2,49.5-15.5c13.3-18.7,6.3-42.4-5.2-60.1c-2.9-4.5-6-8.9-11.1-11.1
|
||||
c-5.1-2.2-11.7-2.6-17.3-3c-6.4-0.4-13.8,0.9-19.4,4.5c-12.8,6.6-20.5,21.1-22.5,36C514.5,269,523,289,543.2,297.3z M536.7,222.8
|
||||
c3.3-3.6,7.8-6,12.6-6.8c5.8-1.1,12.2,0.1,18,1.1c5.9,1.1,8.8,3.2,12,8.3c3.1,4.7,5.6,9.6,7.7,14.8c7.3,19.3,2.2,41.9-19.1,49.1
|
||||
c-18.5,6.2-38.6-7-41.8-25.8C523.7,250,527.4,233.5,536.7,222.8L536.7,222.8z"/>
|
||||
<path class="st4" d="M570.7,254.5c8.2-6,5.8-20.6-3-24.7c-4.2-1.9-9.5-1.5-12.8,2c-0.4,0.4-0.7,0.8-1,1.2c-2.3,3-3.4,6.7-3,10.4
|
||||
C551.7,252.8,562,260.8,570.7,254.5z M559.6,242c1.4-2,2.2-6,5.2-3.1c1.9,1.8,2.8,8-0.6,8.7C561.1,248.2,559.6,245.3,559.6,242
|
||||
C559.6,242,559.6,242,559.6,242z"/>
|
||||
<path class="st4" d="M603.8,303.9c0.2,0.3,0.4,0.6,0.6,0.8c0.1,0.2,0.3,0.4,0.5,0.5c0.5,0.5,1.1,0.9,1.8,1.2
|
||||
c1.1,0.5,2.3,0.6,3.5,0.3l0.3-0.1h0.1c0.7-0.2,1.4-0.5,2-1c0.7-0.5,1.3-1.3,1.6-2.1c0.3-0.8,0.4-1.6,0.4-2.4v0.2c0-0.1,0-0.1,0-0.2
|
||||
c0-2.3-1.4-4.3-3.5-5.2c-2.1-0.9-4.6-0.4-6.2,1.2c-0.7,0.7-1.2,1.6-1.5,2.6c-0.3,1-0.3,2,0,2.9
|
||||
C603.4,303.1,603.6,303.5,603.8,303.9z"/>
|
||||
<path class="st4" d="M392.9,294.5c18.8-2.5,30.4-17.5,32.8-35.5c1.4-10.5,1.2-22.2-5.2-31.2c-2.4-3.4-5.7-6.2-9.4-8.1
|
||||
c-9.8-6-23.1-5.7-33.8-0.4c-17,8.6-26.9,29.2-22.4,47.9C359,284.3,375.3,296.9,392.9,294.5z M373.1,234.1
|
||||
c5.6-6.2,13.4-9.9,21.7-10.3c1.3,0,2.6,0.2,3.9,0.5c20.9,3.4,21.4,30.4,14,45.6c-6.6,13.6-25,20-37.7,10.8
|
||||
C359.5,269.5,361,247.1,373.1,234.1L373.1,234.1z"/>
|
||||
<path class="st4" d="M407.4,253.1c5-9.9-3.5-20.9-14.3-19.7c-0.3,0-0.5,0.1-0.8,0.1c-2.4,0-4.7,1-6.2,2.9c-1.9,1.6-3.3,3.7-4.1,6
|
||||
c-1.1,3.3-1,8.3,1.6,10.9C388.4,263.1,402.5,262.8,407.4,253.1z M393,243.8c2.7-1.9,6.9,0.6,6.4,3.9c-0.6,4.4-5.8,5.1-8.1,1.6
|
||||
c-0.2-0.3-0.4-0.6-0.5-1C391,246.5,391.5,244.8,393,243.8z"/>
|
||||
<path class="st4" d="M331.1,307.3c0.9,0.1,1.9,0,2.8-0.4c1.1-0.4,2-1.2,2.6-2.2c0.5-1,0.8-2,0.8-3.1c0-0.7-0.1-1.3-0.3-2
|
||||
c-0.5-1.9-2-3.4-3.9-3.9c-1.5-0.4-3-0.2-4.3,0.6c-1.3,0.8-2.2,2-2.6,3.4c-0.3,1-0.3,2,0,3c0.2,0.7,0.5,1.4,1,2v0.1l0.8,1.1
|
||||
C328.9,306.7,330,307.2,331.1,307.3z"/>
|
||||
<path class="st4" d="M300.4,290.5c-4.5,2.8-8,7.7-10.8,12.1c-5.1,8-9.2,16.7-13.3,25.3c-4.2,8.7-8,17.6-11.6,26.5
|
||||
c-3.4,8.5-6.6,16.9-4.3,26.1c0.7,2.5,3.3,3.9,5.8,3.2c0.7-0.2,1.4-0.6,2-1.1l8.9-9.6c-1.1,12.8-1.4,25.6-0.9,38.4
|
||||
c0.3,8.4,0.7,17,2.1,25.3c1.1,6.1,3.9,12.1,9.8,14.8c13.8,6.4,19.4-10.2,22.2-20l12-41.2c3.2,5,6.7,9.9,10.5,14.5
|
||||
c10.4,13,22.2,25.8,35.7,35.6c13,9.3,28.4,14.2,43.9,17.3c6.8,1.4,13.6,2.5,20.5,3.3c-0.1,6.2,1,12.6,1.5,18.7
|
||||
c0.6,6.5,1,13,1.9,19.4c-2.7,6.5-11,9.7-16.5,13.3c-18.7,12.2-34.5,28.4-46.3,47.4c-1.1,1.8-0.2,5.1,2.2,5.4
|
||||
c11.5,1.6,20.7-5.3,29.3-12.2c3.9-3.1,7.7-6.4,11.4-9.8c-2.9,7.2-5.5,14.6-7.7,22c-2.7,8.7-11.4,28.6,0.6,34.2s18.4-14.9,22-22.4
|
||||
c4.1-8.6,7.9-17.4,11.4-26.3c2.4,16.8,6,33.3,13.6,48.6c1.2,1.9,3.6,2.6,5.6,1.5c10.7-6.2,8.4-21.4,8.3-31.8
|
||||
c-0.1-16.1-0.3-32.1-0.5-48.2C481.6,515,490,504,492.5,491c0.5-3-1.9-6.1-5.1-5.1c-8,2.5-15.7,5.8-22.9,10c0.1-1.2-0.3-2.4-1.2-3.2
|
||||
c-0.3-5-1.6-10.3-2-14.9s-0.6-9-1-13.4c0-0.4-0.1-0.9-0.1-1.3c2.3,0.1,4.7,0.2,7,0.2c18.8,0.2,37.5-0.5,56.2-2.2
|
||||
c8.9-0.6,17.7-1.8,26.4-3.6c0.3,6,1.3,12.1,2,18.1c0.4,3.7,0.8,7.4,1.2,11.1c-6.4-4.8-13.8-8.2-21.6-10c-1.8-0.5-3.7,0.3-4.7,1.9
|
||||
c-8.5,17.8,14.1,32.9,29,39.7c-3.7,27-6.3,54.9-4.4,82c0.1,1.7,1.2,3.2,2.9,3.8c14,5.3,14.2-16,14.9-23.8
|
||||
c1.1-12.1,2.2-24.1,3.3-36.2c7.9,17.9,19.3,34.1,33.6,47.5c1.5,1.4,3.8,1.4,5.3,0c8.9-8.7,1.3-21.8-3.1-30.9
|
||||
c-4-8.3-8.2-16.5-12.7-24.5c6.5,4.8,13.2,9.3,20.1,13.4c11.7,6.8,25.8,15.7,39.8,13.8c1.8-0.2,3.3-2.5,3.2-4.2
|
||||
c-0.3-7.7-5.8-12-11.5-16.4c-7.5-5.6-15-11.1-22.8-16.4c-15.9-10.9-32.2-21.2-48.9-30.9c0.3-7.8-0.3-15.8-0.5-23.6
|
||||
c-0.1-7.4,0.6-15.5-0.7-23c14.6-7.2,28.7-15.2,42.3-24.2c13.2-8.7,25.2-18.8,34.5-31.6c6.5-9.1,11.8-19,15.5-29.6
|
||||
c3.5,9.8,8.3,19.1,14.5,27.5c5.9,8,16.6,22.6,27.9,14.6c9.8-6.8,7.7-22.8,6.9-32.9c-0.7-8.3-2-16.5-3.8-24.6
|
||||
c2.3,1.8,5.2,2.8,8.1,1.4c5.1-2.3,4.3-7.8,3.1-12.2c-1.7-6-3.6-12-5.7-17.9c-4.1-11.3-9.5-21.7-17.3-30.9
|
||||
c-8-9.4-17.1-17.7-24.7-27.4c-0.2-0.3-0.5-0.5-0.8-0.8c-1.1-4.5-2.5-8.9-4.2-13.2c-6.5-16.6-15.1-32.3-25.5-46.8
|
||||
c-15.3-21-37-39.3-62.1-45.8c0-0.1,0-0.3,0-0.4c-1.7-7.7,2.5-15.1,1.9-22.9c-0.5-5.1-2.5-10.5-6.8-13.6c-7.8-5.6-17.7-0.7-25.1,5.6
|
||||
c-1.1-13.5-4.3-31.7-18.1-24.6c-7.3,3.7-12,12.7-16.1,19.2c-2.6,4.2-5,8.5-7.3,12.9c-3.2-16.3-7.6-32.3-13-48
|
||||
c-3.4-9.8-7.4-19.5-11.8-28.9c-3.4-7.3-8.9-12.8-17.3-8.5c-7.3,3.7-12.6,12.3-16.8,19.1c-4.8,7.7-8.6,15.8-11.5,24.4
|
||||
c-4.5,13.3-6.7,27.2-6.3,41.2c-5.2-6.6-11-12.7-17.2-18.4c-6.5-5.9-17-12.9-25.3-5.8c-7.9,6.8-2.6,20,0.4,27.9
|
||||
c3.5,9.7,8.7,18.7,15.3,26.7c-21.9,3.2-43,14.9-59.2,29.3c-23.1,20.5-38.1,49.1-45,79C302.3,276,301.1,283.2,300.4,290.5z
|
||||
M677.9,306.8c0.8-9.7,0.8-19.5,0-29.3c8.2,10.4,18.8,19.2,25,31.2c4.3,8.2,7.2,17,9.9,25.9l-7.8-10.1c-2.8-3.6-9.2,0.3-7.7,4.5
|
||||
c3.8,10.8,6.6,22,8.3,33.3c0.8,6,1.4,12,1.6,18c0.2,4.8,0.7,10.2-1.2,14.6c-4.6,10.7-17.6-9.7-20.4-14.1
|
||||
c-5.8-9.1-10.1-19.1-12.8-29.6c-0.2-0.9-0.7-1.7-1.4-2.3C674.7,335.2,676.9,321,677.9,306.8z M463.8,506.2
|
||||
c5.7-4.1,11.9-7.5,18.4-10c-3.3,8.1-9.7,14.5-17.8,17.9c-1.8,0.5-3,2.2-3,4c0.2,13.9,0.4,27.7,0.6,41.6c0.1,6.5,0.2,13.1,0.3,19.6
|
||||
c0,3.3,0.2,7.4-1.1,10.6c-7.3-18-10-37.3-12.3-56.5c-0.6-4.6-6.6-5.8-8.2-1.1c-3.6,10.4-7.6,20.7-12,30.8
|
||||
c-2.3,5.2-4.7,10.4-7.2,15.5c-1.2,2.6-2.5,5.1-3.8,7.7c-0.6,1.1-1.2,2.3-1.8,3.4c-0.7,2.3-1.7,2.5-3.1,0.7
|
||||
c-3.3-1.8-1.1-5.6-0.4-8.6c0.7-2.8,1.5-5.5,2.3-8.3c1.5-5.2,3.1-10.3,4.9-15.4c3.8-10.9,8.2-21.5,13.2-31.8c1.9-4-3.2-8.7-6.5-5
|
||||
c-6.5,7.4-13.5,14.3-20.9,20.7c-5.6,4.8-13.5,13-21.6,15.4c7.9-11.3,17.4-21.5,28.2-30.1c6.1-4.9,12.7-8.9,19.3-13
|
||||
c4.7-3,8.8-6.3,11.2-11.2c1.4-0.6,2.3-2.1,2.3-3.6c-0.1-7.3-1-14.7-1.7-22c-0.5-5.1-0.6-10.4-1.4-15.6c3.5,0.3,7,0.6,10.5,0.8
|
||||
c-0.8,5.4,0.5,12.1,0.8,16.3c0.5,6,0.1,14.3,2.8,20.1c0.2,2.1,1,4,2.3,5.7C459.3,506.4,461.8,507.7,463.8,506.2z M613,529
|
||||
c6.6,4.4,13.1,8.9,19.5,13.5c3.5,2.5,7,5.1,10.4,7.7c1.9,1.3,3.6,2.7,5.2,4.4c-10.8-1.6-21.6-9-30.5-14.2
|
||||
c-11.6-6.6-22.5-14.3-32.7-22.8c-3.3-2.8-8.6,0.7-6.2,4.8c6.3,10.7,12.3,21.5,18,32.5c2.7,5.2,5.3,10.4,7.8,15.6
|
||||
c1.6,3.4,4.1,8.3,3.4,12.3c-15.1-15.3-27.2-33.6-34.3-54c-0.6-1.8-2.5-2.8-4.3-2.3c-1.4,0.4-2.4,1.7-2.4,3.2
|
||||
c-1.1,11.6-2.2,23.2-3.3,34.9c-0.5,5.6-1.1,11.2-1.6,16.9c-0.2,1.6-0.5,12-2.7,15c0.8-26.7,1.5-53,5.2-79.5c0.5-2.3-0.8-4.5-3-5.2
|
||||
c-6.7-2.7-12.9-6.4-18.3-11c-3.9-3.3-10-8.9-9.8-14.7c8.1,2.7,14.9,7.4,21.7,12.5c0.4,0.4,0.8,0.8,1.4,1l2,1.5
|
||||
c2.1,1.6,4.7-1,4.2-3.2c0.4-0.7,0.7-1.5,0.6-2.3c-0.5-7.4-1.5-14.7-2.5-22c-0.8-6-1.3-12.1-2.8-18c2.8-0.8,5.5-1.7,8.2-2.8
|
||||
c-0.8,6.8-0.3,13.9-0.3,20.4c-0.1,9.6-0.5,19.5,0.9,29c0.5,3.5,4,3.8,6.4,2.2C586.7,512.1,600,520.3,613,529z M309.8,293.9
|
||||
c0.1-0.7,0.1-1.4,0.2-2.1c0-0.2,0.1-0.3,0.1-0.5c3.2-31.5,15.5-62.8,37.2-86.1c10.7-11.5,23.5-20.9,37.7-27.6
|
||||
c14.3-6.8,30.1-9.9,45.7-12.1c2.4-0.4,2.4-4.6,0-4.9c-4.9-0.7-9.8-1-14.8-0.7c-5.3-6.7-9.8-13.9-13.6-21.6c-2-4-3.7-8.2-5-12.5
|
||||
c-1.1-3.5-3.5-9.7-1.4-13.3c7.3-12.8,36.6,27.8,40.6,33.4c2.8,3.8,8.1,1.5,7.4-3.1c-2.2-15.5-1-31.3,3.7-46.3
|
||||
c4.3-14.1,11.7-30.1,22.4-40.5c1.5-1.4,4.3-4.2,6.7-2.8c1,0.6,2.7,5.5,3,6.2c1.6,4,3.2,8,4.7,12c3,8,5.8,16.2,8.4,24.4
|
||||
c5.3,17.1,9.4,34.6,12.2,52.3c0.9,5.3,7.8,3.8,9.3,0c5-12,11.3-23.3,18.8-33.9c1.4-2,3.1-5.2,5.4-6.3c3.2-1.5,3.1,2.1,3.5,4.7
|
||||
c1.1,7.3,1.9,14.6,2.5,21.9c0.3,3.6,5.2,6.8,8,3.3c3.8-4.7,18.7-19.7,22.5-8.6c1.6,4.5,0.1,9-0.7,13.5c-0.7,3.4-1,6.9-0.8,10.3
|
||||
c-5.3-0.7-10.7-0.8-16-0.4c-5.5,0.4-5.7,8.7,0,8.7c30.2-0.2,56.6,16.3,75.2,39.3c19.3,23.9,35.1,55.3,35.7,86.5
|
||||
c0.5,28.4-3.5,59.4-16.2,85.1c-13.5,27.5-37.9,43.7-64.1,58c-14.1,7.7-28,15.3-44,18.2c-17,3.1-34.8,3.6-52.1,4.2
|
||||
c-32,1.1-65.8,0.7-96.4-9.6c-15.4-5.2-27.6-14.5-38.9-26c-10.9-11.1-21.2-22.9-29.2-36.4C312.1,354.5,307.2,323.7,309.8,293.9z
|
||||
M315.7,379L305,416c-1.9,6.4-3.6,12.8-5.6,19.1c-1.7,5.4-6.7,12.8-10.8,4.1c-2.6-5.5-2.3-12.8-2.7-18.8
|
||||
c-0.5-6.7-0.7-13.5-0.7-20.3c0-13.5,0.8-27.1,2.5-40.5c0.5-4.1-5.4-6.1-7.9-3.3l-10,10.9c1.2-4.6,3.3-9.1,5-13.3
|
||||
c3.1-7.9,6.5-15.8,10.2-23.4c3.3-6.9,6.6-13.7,10.3-20.4c1.2-2.2,2.6-4.2,4.2-6.2c-0.7,20,2.3,39.9,9,58.7
|
||||
C310.5,368.3,312.9,373.7,315.7,379z"/>
|
||||
<path class="st4" d="M630.6,225.3c2.5,5.7,4.2,11.7,5.2,17.9c1,6.2,0.4,12.7,1.5,18.8c0.2,1.1,1.7,0.9,2,0
|
||||
c4.5-11.4-0.3-27.4-4.9-37.9c-5.2-12.3-14.1-22.7-25.5-29.9c-0.5-0.3-1.2,0.4-0.7,0.9C617.9,203.4,625.5,213.7,630.6,225.3z"/>
|
||||
<path class="st4" d="M639.1,282.1c0.6,7.7,0.5,15.4-0.3,23.1c-0.1,1.2,1.6,1.3,2,0.3c2.8-7.6,2.9-16,0.2-23.6
|
||||
C640.7,280.9,639,280.9,639.1,282.1z"/>
|
||||
<path class="st4" d="M345.5,382c6.1,11.4,16.4,24.3,29.1,28.4c0.6,0.2,1.3-0.2,1.4-0.8c0.1-0.4,0-0.8-0.3-1.1
|
||||
c-4.7-4.1-9.9-7.4-14.4-11.8c-4.7-4.7-8.8-10-12.1-15.9c-6.9-12.2-8.5-24.8-10.1-38.4c-0.1-0.6-1-0.9-1.1-0.2
|
||||
C334.7,355.3,339.2,370.4,345.5,382z"/>
|
||||
<path class="st4" d="M399.1,422.8c-2.5-1.3-5.3-1.7-7.8-3c-2.5-1.3-4.8-2.8-7-4.6c-0.8-0.6-1.8,0.5-1.3,1.3
|
||||
c3.2,4.4,9.7,9.3,15.5,8.7C399.6,425.1,400.4,423.5,399.1,422.8z"/>
|
||||
<path class="st4" d="M481.5,108.1c0.5,1.2,2.5,1.2,2.4-0.3c-0.9-11.8-5.7-23.2-10.5-33.8c-0.5-1.2-2.6-0.4-2.1,0.9
|
||||
C475.2,85.8,477.4,97.3,481.5,108.1z"/>
|
||||
<path class="st4" d="M486.8,129.6c0.2,2.3,0.1,4.7,1,6.8c0.2,0.6,0.8,0.9,1.4,0.8c0.4-0.1,0.7-0.4,0.8-0.8c1.9-4.9-0.9-11-2.6-15.6
|
||||
c-0.2-0.4-0.7-0.6-1.1-0.5c-0.4,0.1-0.6,0.5-0.5,0.9C486.3,124,486.6,126.8,486.8,129.6z"/>
|
||||
<path class="st4" d="M536.3,139c1.7-3.1,1.3-7.4,0.4-10.7c-0.3-1.2-1.8-0.8-1.9,0.3c-0.4,3.2-1.2,6.9-0.7,10.2
|
||||
c0.2,0.6,0.9,1,1.5,0.8C535.9,139.5,536.1,139.3,536.3,139z"/>
|
||||
</g>
|
||||
<g id="Ebene_2">
|
||||
<path class="st5" d="M275,265.6c0,0-8.9-2.6-15.4-33.6S288,79,116,107S53,376.3,232,244.2C253,272.6,275,265.6,275,265.6z"/>
|
||||
<g>
|
||||
|
||||
<rect x="43" y="147.2" transform="matrix(0.9977 -6.779442e-02 6.779442e-02 0.9977 -13.861 10.4123)" class="st6" width="207" height="124.5"/>
|
||||
<path d="M62.3,154.9l2,29.9L76,184l0.4,5.6l-18.8,1.3l-2.4-35.5L62.3,154.9z"/>
|
||||
<path d="M77.1,153.9l7.1-0.5l2.4,35.5l-7.1,0.5L77.1,153.9z"/>
|
||||
<path d="M89.7,153l8.1-0.5l13.1,25.6l9.5-27.2l8-0.5l2.4,35.5l-7.1,0.5l-1.6-23.1l-7.9,23.7l-5.4,0.4L97.7,165l1.6,23.1l-7.1,0.5
|
||||
L89.7,153z"/>
|
||||
<path d="M134,150l7.1-0.5l2.4,35.5l-7.1,0.5L134,150z"/>
|
||||
<path d="M144.8,149.3l26-1.8l0.4,5.7l-9.5,0.6l2,29.8l-7.1,0.5l-2-29.8l-9.5,0.6L144.8,149.3z"/>
|
||||
<path d="M195.6,151.6l-13.5,0.9l0.6,8.9l12-0.8l0.4,5.6l-12,0.8l0.6,9.4l13.5-0.9l0.4,5.8l-20.6,1.4l-2.4-35.6l20.6-1.4
|
||||
L195.6,151.6z"/>
|
||||
<path d="M232.5,161.2c0.7,10.7-6.2,18.2-17.5,19l-12.4,0.8l-2.4-35.5l12.4-0.8C223.9,143.9,231.8,150.5,232.5,161.2z M214.3,174.2
|
||||
c7.5-0.5,11.4-5.1,10.9-12.4c-0.5-7.4-5-11.5-12.5-11l-5,0.3l1.6,23.5L214.3,174.2z"/>
|
||||
<path d="M94.3,236.9c-10,0.7-18.7-6.3-19.5-17c-0.7-10.6,7-18.7,17-19.4c10.1-0.7,18.7,6.3,19.4,16.9
|
||||
C111.9,228.1,104.3,236.2,94.3,236.9z M93.8,230.5c6.4-0.4,10.5-5.4,10-12.6s-5.2-11.5-11.6-11c-6.5,0.4-10.6,5.3-10.1,12.5
|
||||
S87.4,231,93.8,230.5z"/>
|
||||
<path d="M113.8,199.5l21.9-1.5l0.4,5.7l-14.8,1l0.6,9.1l11.3-0.8l0.4,5.6l-11.3,0.8l1,15l-7.1,0.5L113.8,199.5z"/>
|
||||
<path d="M139.3,197.8l21.9-1.5l0.4,5.7l-14.8,1l0.6,9.1l11.3-0.8l0.4,5.6l-11.3,0.8l1,15l-7.1,0.5L139.3,197.8z"/>
|
||||
<path d="M185.8,200.4l-13.5,0.9l0.6,8.9l12-0.8l0.4,5.6l-12,0.8l0.6,9.4l13.5-0.9l0.4,5.8l-20.6,1.4l-2.4-35.6l20.6-1.4
|
||||
L185.8,200.4z"/>
|
||||
<path d="M203.7,193.4c8.5-0.6,13.2,4.1,13.6,10c0.3,4.3-1.8,8.9-7.4,10.8l9.5,13.8l-8.2,0.6l-8.8-13.3l-3.4,0.2l0.9,13.8l-7.1,0.5
|
||||
l-2.4-35.5L203.7,193.4z M203.9,199.3l-6,0.4l0.7,10.4l6-0.4c4-0.3,5.6-2.5,5.4-5.7C209.7,200.9,207.8,199.1,203.9,199.3z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g id="Ebene_3">
|
||||
<path class="st7" d="M712.8,187.5c-3,20.7-12.4,25.7-12.4,25.7s20.2-1.9,27.8,4.3"/>
|
||||
<path class="st8" d="M702.7,212.4c0,0,35.7-9.3,55-38.4"/>
|
||||
<g>
|
||||
|
||||
<rect x="737.2" y="82.8" transform="matrix(0.9741 -0.2263 0.2263 0.9741 -10.077 185.1429)" class="st6" width="130.6" height="107.4"/>
|
||||
<path d="M749.2,127.7c-0.2,0.3-0.6,0.5-1.3,0.6c-0.7,0.1-1.3,0.1-1.9,0c-0.6-0.1-1-0.3-1.3-0.7c-0.3-0.3-0.2-0.8,0.3-1.5
|
||||
c0.2-0.3,0.5-0.5,0.7-0.7c0.3-0.2,0.6-0.3,0.9-0.5c0.3-0.2,0.5-0.4,0.7-0.6c0.2-0.2,0.2-0.6,0.2-1c-0.3-1.7-0.6-3.4-0.8-5.2
|
||||
c-0.2-1.8-0.1-3.4,0.3-4.9c0.3-1.5,1-2.8,2.1-3.9c1-1.1,2.6-1.8,4.7-2.1c0.7-0.2,1.6-0.2,2.6-0.1c1,0.1,2,0.4,3,0.8
|
||||
c1,0.4,1.9,0.9,2.7,1.5c0.8,0.6,1.4,1.4,1.8,2.3c0.3,0.3,0.3,0.8-0.1,1.5c-0.4,0.7-1.1,1.5-1.9,2.4s-1.8,1.9-2.9,2.9
|
||||
c-1.1,1-2.1,1.9-3.2,2.8c-1,0.9-1.9,1.7-2.7,2.4c-0.8,0.7-1.3,1.1-1.5,1.4c0.6,1.4,1.1,2.8,1.8,4.4c0.6,1.5,1.3,2.9,2.1,4.1
|
||||
c0.8,1.2,1.6,2.2,2.6,2.9s1.9,0.9,3,0.7c1.6-0.3,3-0.8,4-1.7c1-0.9,1.8-1.9,2.4-3c0.5-1.1,0.9-2.3,1.1-3.6
|
||||
c0.2-1.2,0.3-2.4,0.3-3.5c0-1.1,0-2-0.1-2.7c-0.1-0.7-0.1-1.2,0-1.2c0.4-0.3,0.8-0.4,1.4-0.3c0.6,0.1,1,0.6,1.3,1.4
|
||||
c0.4,1.4,0.4,3.1,0.2,5.1c-0.2,2-0.8,3.9-1.6,5.7c-0.8,1.8-1.9,3.4-3.3,4.7c-1.4,1.3-3,2-4.9,2.2c-1.9,0.4-3.5,0.2-4.8-0.6
|
||||
c-1.3-0.8-2.5-1.9-3.5-3.2c-1-1.3-1.8-2.8-2.5-4.4C750.4,130.3,749.8,128.9,749.2,127.7z M760.9,112.5c-1.6-1.3-3-2.1-4.3-2.3
|
||||
s-2.6,0-3.8,0.5c-0.7,0.3-1.3,0.8-1.8,1.6c-0.4,0.7-0.7,1.6-0.9,2.7c-0.2,1-0.2,2.1,0,3.3c0.1,1.2,0.4,2.4,0.8,3.6L760.9,112.5z"
|
||||
/>
|
||||
<path d="M795.5,131.9c-0.7-0.7-1.3-1.6-1.7-2.8c-0.4-1.2-0.8-2.5-1.1-3.9s-0.7-2.7-0.9-4.1c-0.3-1.3-0.7-2.5-1.1-3.4
|
||||
c-0.8,4.2-1.8,7.5-2.8,10c-1,2.5-2.1,4.3-3.1,5.5c-1.1,1.2-2.1,1.9-3.2,2c-1.1,0.1-2,0-2.9-0.5c-0.9-0.5-1.6-1.1-2.2-2
|
||||
s-1.1-1.7-1.3-2.5c-0.6-1.3-1-3-1.2-5c-0.2-2-0.3-4.2-0.1-6.4s0.4-4.5,0.9-6.7c0.5-2.2,1.1-4.2,2-6c0.9-1.7,1.9-3.1,3.1-4.2
|
||||
c1.2-1,2.6-1.5,4.2-1.3c0.7-0.2,1.3-0.4,1.9-0.3c0.5,0,1,0.2,1.4,0.5c0.4,0.3,0.8,0.8,1.1,1.5c0.3,0.7,0.6,1.6,1,2.7
|
||||
c0.8,3.6,1.6,6.6,2.4,9c0.9,2.4,1.7,4.6,2.5,6.4c0.8,1.8,1.6,3.5,2.3,4.9c0.7,1.5,1.3,3,1.8,4.7c0.1,0.6,0.1,1.1-0.1,1.5
|
||||
c-0.2,0.4-0.5,0.7-0.9,0.8c-0.3,0.2-0.7,0.2-1,0.2C795.8,132.4,795.6,132.2,795.5,131.9z M785.8,104.8c-1.2-1-2.2-1.2-3.2-0.8
|
||||
c-1,0.4-1.9,1.3-2.6,2.6c-0.8,1.3-1.4,3-1.9,4.9c-0.5,2-0.9,4-1.1,6.2c-0.2,2.1-0.2,4.2-0.1,6.3c0.1,2,0.5,3.8,1,5.3
|
||||
c0.9,1.5,1.8,2.4,2.6,2.5c0.8,0.2,1.6-0.1,2.3-0.9c0.7-0.8,1.4-1.9,2-3.3c0.6-1.5,1.1-3,1.6-4.6c0.5-1.6,0.9-3.3,1.2-4.9
|
||||
c0.3-1.6,0.5-2.9,0.7-4L785.8,104.8z"/>
|
||||
<path d="M801.1,130c-1.3-5.1-2.4-9.3-3.3-12.8c-0.9-3.5-1.6-6.4-2.2-8.7c-0.6-2.3-1-4.1-1.3-5.4c-0.3-1.3-0.6-2.3-0.7-2.9
|
||||
c-0.2-0.6-0.3-1-0.3-1.1s0-0.2-0.1-0.2c0-0.3,0.1-0.7,0.3-0.9c0.2-0.3,0.5-0.5,0.9-0.6c0.3-0.1,0.7-0.2,1.1-0.1
|
||||
c0.4,0.1,0.7,0.3,0.9,0.6l3.1,12.7c0-2.7,0.4-5,1.2-7c0.8-2,1.9-3.6,3.2-5c1.3-1.3,2.8-2.3,4.4-3c1.6-0.7,3.2-1.1,4.6-1.1
|
||||
c0.5,0,0.9,0.1,1.2,0.4c0.3,0.2,0.5,0.5,0.6,0.9c0.1,0.3,0.1,0.7,0,1.1c-0.1,0.4-0.3,0.7-0.6,0.9c-1.7,0.3-3.2,0.8-4.6,1.5
|
||||
c-1.4,0.7-2.6,1.6-3.6,2.6c-1,1-1.9,2.2-2.5,3.4c-0.7,1.2-1.1,2.5-1.4,3.7c-0.4,1.8-0.5,3.7-0.4,5.6c0.1,1.9,0.4,3.7,0.8,5.5
|
||||
c0.4,1.8,0.8,3.5,1.2,5.1c0.4,1.6,0.8,3,1,4.2c0.1,0.4,0,0.8-0.3,1c-0.3,0.3-0.6,0.5-1,0.6c-0.4,0.1-0.8,0.1-1.2,0
|
||||
S801.4,130.4,801.1,130z"/>
|
||||
<path d="M813.8,79.7c0.2-0.2,0.4-0.4,0.6-0.6c0.2-0.2,0.4-0.4,0.7-0.5c0.2-0.1,0.5-0.1,0.7-0.1c0.2,0.1,0.5,0.3,0.7,0.6l10.9,45.4
|
||||
c-0.1,0.4-0.3,0.7-0.5,0.9c-0.3,0.2-0.6,0.3-0.9,0.3c-0.3,0-0.6,0-0.9-0.2c-0.3-0.1-0.5-0.3-0.6-0.6L813.8,79.7z"/>
|
||||
<path d="M843.3,121.4l-18.6-24.9c-0.4-0.4-0.6-0.8-0.5-1.3c0-0.5,0.2-0.9,0.5-1.3c0.3-0.3,0.7-0.5,1.2-0.6c0.5-0.1,1,0.1,1.6,0.6
|
||||
l15.8,21.9l-1.6-28.5c0.2-0.2,0.4-0.3,0.7-0.5c0.3-0.1,0.6-0.2,0.9-0.3c0.3,0,0.6,0,0.9,0.1c0.3,0.1,0.5,0.4,0.7,0.8
|
||||
c0.2,1.5,0.3,3.5,0.5,5.8c0.2,2.4,0.3,4.8,0.4,7.3c0.1,2.5,0.2,4.9,0.3,7.2c0.1,2.3,0.2,4.1,0.2,5.4c0,0.8,0.1,1.9,0.2,3.2
|
||||
c0.1,1.4,0.2,2.8,0.2,4.4c0.1,1.6,0.2,3.3,0.2,5c0.1,1.7,0.2,3.4,0.2,5c0.1,1.6,0.1,3.1,0.2,4.4c0,1.3,0,2.4,0,3.2
|
||||
c0,0.5-0.1,0.8-0.4,1.1c-0.3,0.3-0.7,0.5-1.2,0.6c-0.4,0.1-0.9,0-1.3-0.2c-0.4-0.2-0.7-0.5-0.9-1L843.3,121.4z"/>
|
||||
<path d="M779.4,190.5c-1-3.2-1.9-6.3-2.6-9.3c-0.8-3-1.6-6.2-2.5-9.7c-0.8-3.5-1.8-7.4-2.8-11.7c-1-4.3-2.3-9.4-3.8-15.2
|
||||
c0.5-0.1,0.9-0.2,1.3-0.4s0.8-0.2,1.1-0.3c0.3,0,0.6,0,0.8,0.2c0.2,0.2,0.4,0.5,0.5,1.1c0.4,1.5,0.7,3,1,4.4
|
||||
c0.3,1.4,0.7,3,1.1,4.7c0.4,1.7,0.9,3.6,1.4,5.8c0.5,2.2,1.1,4.7,1.8,7.7c1-2.2,2-4,2.9-5.4c0.9-1.4,1.9-2.5,2.8-3.3
|
||||
c0.9-0.8,1.9-1.4,2.9-1.8c1-0.4,2-0.6,3.1-0.7c1.2-0.3,2.2-0.3,3.1,0.1s1.7,0.8,2.3,1.6c0.7,0.7,1.2,1.6,1.6,2.6
|
||||
c0.4,1,0.8,2.1,1,3.2c0.2,0.8,0.3,1.7,0.4,2.7s0.2,2,0.1,3.2c-0.1,1.2-0.4,2.4-0.8,3.8c-0.5,1.3-1.2,2.8-2.3,4.4
|
||||
c-1,1.6-2.4,3.4-4.1,5.2c-1.7,1.9-3.9,3.9-6.5,6c-0.9,0.5-1.6,0.8-2.1,1c-0.5,0.2-0.9,0.3-1.2,0.4c-0.3,0-0.5,0-0.5,0
|
||||
C779.4,190.6,779.4,190.5,779.4,190.5z M781.3,186.3c0.1-0.2,0.6-0.6,1.4-1.2c0.8-0.6,1.6-1.4,2.7-2.3s2.1-2,3.2-3.3
|
||||
c1.1-1.3,2.1-2.7,2.9-4.2c0.9-1.5,1.5-3.2,1.9-5c0.4-1.8,0.5-3.7,0.2-5.7c-0.1-0.6-0.4-1.1-0.7-1.8c-0.3-0.6-0.7-1.2-1.2-1.7
|
||||
s-1-0.9-1.7-1.1c-0.6-0.3-1.3-0.3-2-0.1c-1.5,0.4-2.8,1-3.8,2.1c-1.1,1-1.9,2.2-2.7,3.6c-0.7,1.4-1.3,2.8-1.8,4.3
|
||||
c-0.4,1.5-0.8,2.9-1,4.2L781.3,186.3z"/>
|
||||
<path d="M793.7,139.7c-0.1-0.5,0-0.8,0.3-1.1c0.3-0.2,0.6-0.4,1-0.5c0.8-0.2,1.4,0,1.7,0.4c0.3,0.5,0.6,1.1,0.7,1.8
|
||||
c-0.1,0.5-0.3,0.9-0.7,1.1c-0.3,0.3-0.7,0.4-1.1,0.4c-0.4,0-0.8-0.2-1.2-0.5C794.2,141,793.9,140.5,793.7,139.7z M797,150.8
|
||||
c0.2-0.2,0.4-0.3,0.7-0.5c0.3-0.1,0.6-0.2,0.8-0.3c0.3-0.1,0.6-0.1,0.8,0c0.3,0.1,0.5,0.2,0.7,0.5c0.6,2.4,1.2,5,1.9,7.7
|
||||
c0.7,2.8,1.4,5.6,2.2,8.4c0.8,2.8,1.5,5.6,2.2,8.4c0.7,2.7,1.4,5.3,2,7.6c0.2,0.5,0.1,1-0.1,1.4c-0.3,0.4-0.6,0.6-1,0.7
|
||||
c-0.4,0.1-0.8,0-1.2-0.2s-0.7-0.6-0.8-1.2L797,150.8z"/>
|
||||
<path d="M811.5,182.1c-1.3-5-2.4-9.3-3.3-12.8c-0.9-3.5-1.6-6.4-2.2-8.7c-0.6-2.3-1-4.1-1.3-5.4c-0.3-1.3-0.6-2.3-0.7-2.9
|
||||
c-0.2-0.6-0.3-1-0.3-1.1c0-0.1,0-0.2-0.1-0.2c0-0.3,0.1-0.7,0.3-0.9s0.5-0.5,0.9-0.6c0.3-0.1,0.7-0.2,1.1-0.1
|
||||
c0.4,0.1,0.7,0.3,0.9,0.6l3.1,12.7c0-2.7,0.4-5,1.2-7c0.8-2,1.9-3.6,3.2-5c1.3-1.3,2.8-2.3,4.4-3c1.6-0.7,3.2-1.1,4.6-1.1
|
||||
c0.5,0,0.9,0.1,1.2,0.4c0.3,0.2,0.5,0.5,0.6,0.9c0.1,0.3,0.1,0.7,0,1.1c-0.1,0.4-0.3,0.7-0.6,0.9c-1.7,0.3-3.2,0.8-4.6,1.5
|
||||
c-1.4,0.7-2.6,1.6-3.6,2.6c-1,1-1.9,2.2-2.5,3.4c-0.7,1.2-1.1,2.5-1.4,3.7c-0.4,1.8-0.5,3.7-0.4,5.6s0.4,3.7,0.8,5.5
|
||||
c0.4,1.8,0.8,3.5,1.2,5.1c0.4,1.6,0.8,3,1,4.2c0.1,0.4,0,0.8-0.3,1c-0.3,0.3-0.6,0.5-1,0.6c-0.4,0.1-0.8,0.1-1.2,0
|
||||
C812,182.7,811.7,182.4,811.5,182.1z"/>
|
||||
<path d="M842.5,164.8c-0.2,1-0.6,2.2-1.1,3.6c-0.5,1.4-1.2,2.8-2,4.1c-0.8,1.3-1.8,2.5-2.9,3.5c-1.1,1-2.3,1.7-3.7,2
|
||||
c-0.6,0.1-1.1,0.2-1.5,0.1c-0.4-0.1-0.7-0.2-1.1-0.4c-0.3-0.2-0.7-0.5-1-0.8c-0.3-0.4-0.7-0.7-1.1-1.2c-0.8-1.8-1.4-3.8-1.9-6
|
||||
c-0.5-2.2-0.9-4.5-1-6.9c-0.1-2.4-0.1-4.7,0.2-6.9c0.3-2.3,0.9-4.3,1.9-6c0.9-1.8,2.2-3.2,3.8-4.2c1.6-1.1,3.7-1.6,6.2-1.6
|
||||
c-0.3-2.4-0.8-4.7-1.6-7c-0.7-2.3-1.4-4.7-2.1-7.2c-0.1-0.4,0-0.7,0.3-0.9c0.3-0.2,0.6-0.4,1.1-0.6c0.4-0.2,0.8-0.3,1.2-0.3
|
||||
c0.4-0.1,0.7,0,0.8,0c0.7,3.3,1.4,6.4,2,9.1c0.6,2.8,1.2,5.4,1.8,7.8c0.6,2.4,1.1,4.8,1.6,7.1c0.5,2.3,1.1,4.6,1.7,7
|
||||
c0.6,2.4,1.2,4.9,1.8,7.5s1.3,5.5,2.1,8.7c0.3,0.5,0.4,1.1,0.2,1.5c-0.2,0.5-0.5,0.8-0.8,1c-0.4,0.2-0.8,0.2-1.3,0.1
|
||||
c-0.5-0.1-0.8-0.5-1.1-1.1L842.5,164.8z M835.7,147.6c-1.4,0.1-2.7,0.8-3.7,2c-1,1.3-1.8,2.8-2.4,4.7c-0.6,1.9-0.9,4-1.1,6.2
|
||||
c-0.1,2.2-0.1,4.3,0.2,6.3c0.3,2,0.8,3.7,1.5,5.2c0.7,1.5,1.6,2.4,2.7,2.8c0.9-0.2,1.7-0.7,2.5-1.6c0.7-0.8,1.4-1.9,1.9-3
|
||||
c0.6-1.2,1-2.5,1.4-3.9c0.4-1.4,0.7-2.7,1-4c0.2-1.3,0.4-2.5,0.4-3.5c0.1-1,0-1.8-0.1-2.3c-0.1-0.4-0.3-1.1-0.5-2.2
|
||||
c-0.2-1-0.5-2.1-0.9-3.1c-0.4-1-0.8-1.9-1.3-2.7C836.8,147.8,836.3,147.5,835.7,147.6z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 27 KiB |
BIN
apps/formbricks-com/images/pipelines-dark.png
Normal file
|
After Width: | Height: | Size: 75 KiB |
BIN
apps/formbricks-com/images/pipelines.png
Normal file
|
After Width: | Height: | Size: 74 KiB |
BIN
apps/formbricks-com/images/pre-segmentation-dark.png
Normal file
|
After Width: | Height: | Size: 124 KiB |
BIN
apps/formbricks-com/images/pre-segmentation.png
Normal file
|
After Width: | Height: | Size: 83 KiB |
89
apps/formbricks-com/images/pre-segmentation.svg
Normal file
|
After Width: | Height: | Size: 84 KiB |
@@ -1,6 +1,6 @@
|
||||
import Layout from "@/components/shared/Layout";
|
||||
import HeroTitle from "@/components/shared/HeroTitle";
|
||||
import Button from "@/components/shared/Button";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline";
|
||||
import { useRouter } from "next/router";
|
||||
import { ChatBubbleOvalLeftEllipsisIcon, EnvelopeIcon } from "@heroicons/react/24/solid";
|
||||
|
||||
@@ -3,7 +3,7 @@ import Hero from "@/components/home/Hero";
|
||||
import Features from "@/components/home/Features";
|
||||
import Highlights from "@/components/home/Highlights";
|
||||
import InsightOppos from "@/components/shared/InsightOppos";
|
||||
import JoinWaitlist from "@/components/shared/JoinWaitlist";
|
||||
import BreakerCTA from "@/components/shared/BreakerCTA";
|
||||
|
||||
const IndexPage = () => (
|
||||
<Layout
|
||||
@@ -11,10 +11,23 @@ const IndexPage = () => (
|
||||
description="Build qualitative user research into your product. Leverage Best practices to increase Product-Market Fit.">
|
||||
<Hero />
|
||||
<Features />
|
||||
<JoinWaitlist />
|
||||
<BreakerCTA
|
||||
teaser="Curious?"
|
||||
headline="Get access now"
|
||||
subheadline="We’re onboarding design partners regularly. Sign up to get early access."
|
||||
cta="Get access"
|
||||
href="/waitlist"
|
||||
/>
|
||||
<Highlights />
|
||||
<InsightOppos />
|
||||
<JoinWaitlist inverted />
|
||||
<BreakerCTA
|
||||
teaser="Curious?"
|
||||
headline="Get access now"
|
||||
subheadline="We’re onboarding design partners regularly. Sign up to get early access."
|
||||
cta="Get access"
|
||||
href="/waitlist"
|
||||
inverted
|
||||
/>
|
||||
</Layout>
|
||||
);
|
||||
|
||||
|
||||
191
apps/formbricks-com/pages/pmf.tsx
Normal file
@@ -0,0 +1,191 @@
|
||||
import LayoutPMF from "@/components/shared/LayoutPMF";
|
||||
import { Button } from "@formbricks/ui";
|
||||
import { useRouter } from "next/router";
|
||||
import BreakerCTA from "@/components/shared/BreakerCTA";
|
||||
import Features from "@/components/home/Features";
|
||||
import PricingPmf from "@/components/shared/PricingPmf";
|
||||
import Image from "next/image";
|
||||
import DashboardMockup from "@/images/dashboard-mockup.png";
|
||||
import Pipelines from "@/images/pipelines.png";
|
||||
import PreSegmentation from "@/images/pre-segmentation.png";
|
||||
import DashboardMockupDark from "@/images/dashboard-mockup-dark.png";
|
||||
import PipelinesDark from "@/images/pipelines-dark.png";
|
||||
import PreSegmentationDark from "@/images/pre-segmentation-dark.png";
|
||||
import PmfDummy from "@/components/shared/PmfDummy";
|
||||
import EarlyBirdDeal from "@/components/shared/EarlyBirdDeal";
|
||||
|
||||
export default function GetStartedPage() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<LayoutPMF
|
||||
title="Continuous Product-Market Fit Score"
|
||||
description="Measure the Product-Market Fit continuously. Use the Superhuman Product-Market-Fit to your advantage.">
|
||||
<div className="px-4 py-20 text-center sm:px-6 lg:px-8 lg:py-28">
|
||||
<h1 className="text-3xl font-bold tracking-tight text-slate-800 dark:text-slate-200 sm:text-4xl md:text-5xl">
|
||||
<span className="xl:inline">Measure</span>{" "}
|
||||
<span className="from-brand-light to-brand-dark bg-gradient-to-b bg-clip-text text-transparent xl:inline">
|
||||
Product-Market Fit
|
||||
</span>{" "}
|
||||
<span className="inline ">continuously</span>
|
||||
</h1>
|
||||
|
||||
<p className="xs:max-w-none mx-auto mt-3 max-w-xs text-base text-slate-500 dark:text-slate-300 sm:text-lg md:mt-5 md:text-xl">
|
||||
Gather actionable user insights with highly specific in-app surveys.
|
||||
<br />
|
||||
<span className="hidden md:block">
|
||||
Always know how your users perceive your product. Find PMF faster.
|
||||
</span>
|
||||
</p>
|
||||
|
||||
<div className="mx-auto mt-5 max-w-md sm:flex sm:justify-center md:mt-8">
|
||||
<Button
|
||||
variant="secondary"
|
||||
onClick={() => router.push("https://app.formbricks.com/demo")}
|
||||
target="_blank">
|
||||
Try it out
|
||||
</Button>
|
||||
<Button
|
||||
variant="highlight"
|
||||
className="ml-3"
|
||||
onClick={() => router.push("https://app.formbricks.com/auth/signup")}
|
||||
target="_blank">
|
||||
Sign Up
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
{/* Video */}
|
||||
|
||||
<BreakerCTA
|
||||
teaser="No sign up required"
|
||||
headline="Experience what you're missing"
|
||||
subheadline="Play around with out Demo - no sign up needed."
|
||||
cta="Try Demo"
|
||||
href="https://app.formbricks.com/demo"
|
||||
inverted
|
||||
/>
|
||||
|
||||
{/* Steps */}
|
||||
<div id="howitworks" className="mx-auto mt-8 mb-12 max-w-lg md:mt-32 md:mb-0 md:max-w-none">
|
||||
<div className="px-4 sm:max-w-4xl sm:px-6 lg:max-w-7xl lg:px-8">
|
||||
<div className="grid md:grid-cols-2 md:items-center md:gap-16">
|
||||
<div className="pb-8 sm:pl-10 md:pb-0">
|
||||
<h4 className="text-brand-dark font-bold">Step 1</h4>
|
||||
<h2 className="xs:text-3xl text-2xl font-bold tracking-tight text-slate-800 dark:text-slate-200">
|
||||
1. Pre-Segmentation
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-lg leading-7 text-slate-500 dark:text-slate-400">
|
||||
Signed up for more than 4 weeks? Used a specific feature? Set up a custom condition to{" "}
|
||||
<strong>only survey the right subset</strong> of your user base.
|
||||
</p>
|
||||
</div>
|
||||
<div className="rounded-lg bg-slate-100 p-4 dark:bg-slate-800 sm:p-8">
|
||||
<Image
|
||||
src={PreSegmentation}
|
||||
quality="100"
|
||||
alt="Pre Segmentation"
|
||||
className="block dark:hidden"
|
||||
/>
|
||||
|
||||
<Image
|
||||
src={PreSegmentationDark}
|
||||
quality="100"
|
||||
alt="Pre Segmentation"
|
||||
className="hidden dark:block"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx-auto mt-8 mb-12 max-w-lg md:mt-32 md:mb-0 md:max-w-none">
|
||||
<div className="px-4 sm:max-w-4xl sm:px-6 lg:max-w-7xl lg:px-8">
|
||||
<div className="grid md:grid-cols-2 md:items-center md:gap-16">
|
||||
<div className="order-last w-full rounded-lg bg-slate-100 p-4 dark:bg-slate-800 sm:py-8 md:order-first">
|
||||
<div className="mx-auto md:w-3/4">
|
||||
<PmfDummy />
|
||||
</div>
|
||||
</div>
|
||||
<div className="pb-8 md:pb-0">
|
||||
<h4 className="text-brand-dark font-bold">Step 2</h4>
|
||||
<h2 className="xs:text-3xl text-2xl font-bold tracking-tight text-slate-800 dark:text-slate-100 sm:text-3xl">
|
||||
Survey users in-app
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-lg leading-7 text-slate-500 dark:text-slate-400">
|
||||
On average, in-app surveys convert 6x better than email surveys. Get significant results even
|
||||
from smaller user bases.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx-auto mt-8 mb-12 max-w-lg md:mt-32 md:mb-0 md:max-w-none">
|
||||
<div className="px-4 sm:max-w-4xl sm:px-6 lg:max-w-7xl lg:px-8">
|
||||
<div className="grid md:grid-cols-2 md:items-center md:gap-16">
|
||||
<div className="pb-8 sm:pl-10 md:pb-0">
|
||||
<h4 className="text-brand-dark font-bold">Step 3</h4>
|
||||
<h2 className="xs:text-3xl text-2xl font-bold tracking-tight text-slate-800 dark:text-slate-200 sm:text-3xl">
|
||||
Loop in your team
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-lg leading-7 text-slate-500 dark:text-slate-400">
|
||||
Pipe insights to where your team works: Slack, Discord, Email. Use the webhook and Zapier to
|
||||
pipe survey data where you want it.
|
||||
</p>
|
||||
</div>
|
||||
<div className="w-full rounded-lg bg-slate-100 p-8 dark:bg-slate-800">
|
||||
<Image
|
||||
src={Pipelines}
|
||||
quality="100"
|
||||
alt="Data Pipelines"
|
||||
className="block rounded-lg dark:hidden"
|
||||
/>
|
||||
<Image src={PipelinesDark} quality="100" alt="Data Pipelines" className="hidden dark:block" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx-auto mt-8 mb-12 max-w-lg md:mt-32 md:mb-32 md:max-w-none">
|
||||
<div className="px-4 sm:max-w-4xl sm:px-6 lg:max-w-7xl lg:px-8">
|
||||
<div className="grid md:grid-cols-2 md:items-center md:gap-16">
|
||||
<div className="order-last sm:scale-125 sm:p-8 md:order-first">
|
||||
<Image
|
||||
src={DashboardMockup}
|
||||
quality="100"
|
||||
alt="PMF Dashboard Mockup"
|
||||
className="block dark:hidden"
|
||||
/>
|
||||
<Image
|
||||
src={DashboardMockupDark}
|
||||
quality="100"
|
||||
alt="PMF Dashboard Mockup"
|
||||
className="hidden dark:block"
|
||||
/>
|
||||
</div>
|
||||
<div className="pb-8 pl-4 md:pb-0">
|
||||
<h4 className="text-brand-dark font-bold">Step 4</h4>
|
||||
<h2 className="xs:text-3xl text-2xl font-bold tracking-tight text-slate-800 dark:text-slate-100 sm:text-3xl">
|
||||
Make better decisions
|
||||
</h2>
|
||||
<p className="text-md mt-6 max-w-lg leading-7 text-slate-500 dark:text-slate-400">
|
||||
A dashboard specifically built to gauge Product-Market Fit. Beat confirmation bias and
|
||||
<strong> build conviction for the next product decision.</strong>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<EarlyBirdDeal />
|
||||
|
||||
<Features />
|
||||
{/* <BreakerCTA
|
||||
teaser="Get started"
|
||||
headline="Measure your Product-Market Fit."
|
||||
subheadline="Feel the pulse of your user base. Get actionable insights."
|
||||
cta="Sign up"
|
||||
href="https://app.formbricks.com/auth/signup"
|
||||
/> */}
|
||||
<div id="pricing">
|
||||
{" "}
|
||||
<PricingPmf />
|
||||
</div>
|
||||
</LayoutPMF>
|
||||
);
|
||||
}
|
||||
@@ -1,159 +0,0 @@
|
||||
import FeatureSelection from "@/components/engine/FeatureSelection";
|
||||
import IconRadio from "@/components/engine/IconRadio";
|
||||
import Input from "@/components/engine/Input";
|
||||
import Scale from "@/components/engine/Scale";
|
||||
import { Survey } from "@/components/engine/Survey";
|
||||
import Textarea from "@/components/engine/Textarea";
|
||||
import ThankYouHeading from "@/components/engine/ThankYouHeading";
|
||||
import ThankYouPlans from "@/components/engine/ThankYouPlans";
|
||||
import LayoutWaitlist from "@/components/shared/LayoutWaitlist";
|
||||
import {
|
||||
OnboardingIcon,
|
||||
PMFIcon,
|
||||
DogChaserIcon,
|
||||
CancelSubscriptionIcon,
|
||||
InterviewPromptIcon,
|
||||
DoorIcon,
|
||||
FeedbackIcon,
|
||||
BugBlueIcon,
|
||||
AngryBirdRageIcon,
|
||||
FeatureRequestIcon,
|
||||
FounderIcon,
|
||||
EngineerIcon,
|
||||
LaptopWorkerIcon,
|
||||
UserCommentIcon,
|
||||
UserGroupIcon,
|
||||
BellIcon,
|
||||
SkyscraperIcon,
|
||||
CheckMarkIcon,
|
||||
CrossMarkIcon,
|
||||
UserCoupleIcon,
|
||||
} from "@formbricks/ui";
|
||||
|
||||
const WaitlistPage = () => (
|
||||
<LayoutWaitlist title="Waitlist" description="Join our Waitlist today">
|
||||
<div className="mx-auto w-full max-w-5xl px-6 md:w-3/4">
|
||||
<div className="px-4 pt-20 pb-4">
|
||||
<h1 className="text-3xl font-bold tracking-tight text-slate-800 dark:text-slate-200 sm:text-4xl md:text-5xl">
|
||||
<span className="xl:inline">Get</span>{" "}
|
||||
<span className="from-brand-light to-brand-dark bg-gradient-to-b bg-clip-text text-transparent xl:inline">
|
||||
early
|
||||
</span>{" "}
|
||||
<span className="inline ">access</span>
|
||||
</h1>
|
||||
<p className="mt-3 text-sm text-slate-400 dark:text-slate-300 md:text-base">
|
||||
We are onboarding users continuously. Tell us more about you!
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mx-auto my-6 w-full max-w-5xl rounded-xl bg-slate-100 px-8 py-10 dark:bg-slate-800 md:my-12 md:px-16 md:py-20">
|
||||
<Survey
|
||||
formbricksUrl={
|
||||
process.env.NODE_ENV === "production" ? "https://app.formbricks.com" : "http://localhost:3000"
|
||||
}
|
||||
formId={
|
||||
process.env.NODE_ENV === "production" ? "cld37mt2i0000ld08p9q572bc" : "clda41dvz0004u08k3gbawcky"
|
||||
}
|
||||
survey={{
|
||||
config: {
|
||||
progressBar: false,
|
||||
},
|
||||
pages: [
|
||||
{
|
||||
id: "pmfTypePage",
|
||||
config: {
|
||||
autoSubmit: true,
|
||||
},
|
||||
elements: [
|
||||
{
|
||||
id: "pmfType",
|
||||
component: IconRadio,
|
||||
type: "radio",
|
||||
name: "pmfType",
|
||||
label: "How disappointed would you be if you could no longer use our service?",
|
||||
options: [
|
||||
{ label: "Very disappointed", value: "veryDisappointed" },
|
||||
{ label: "Somewhat disappointed", value: "somewhatDisappointed" },
|
||||
{ label: "Not disappointed", value: "notDisappointed" },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "mainBenefitPage",
|
||||
elements: [
|
||||
{
|
||||
id: "mainBenefit",
|
||||
component: Textarea,
|
||||
type: "text",
|
||||
name: "mainBenefit",
|
||||
label: "What is the main benefit you receive from our service?",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "userSegmentPage",
|
||||
config: {
|
||||
autoSubmit: true,
|
||||
},
|
||||
elements: [
|
||||
{
|
||||
id: "userSegment",
|
||||
component: IconRadio,
|
||||
type: "radio",
|
||||
name: "userSegment",
|
||||
label: "What is your job title?",
|
||||
options: [
|
||||
{ label: "Founder", value: "founder" },
|
||||
{ label: "Executive", value: "executive" },
|
||||
{ label: "Product Manager", value: "product manager" },
|
||||
{ label: "Software Engineer", value: "engineer" },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "improvementPage",
|
||||
elements: [
|
||||
{
|
||||
id: "improvement",
|
||||
component: Textarea,
|
||||
type: "text",
|
||||
name: "improvement",
|
||||
label: "How can we improve our service for you?",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "selfSegmentationPage",
|
||||
elements: [
|
||||
{
|
||||
id: "selfSegmentation",
|
||||
component: Textarea,
|
||||
type: "text",
|
||||
name: "selfSegmentation",
|
||||
label: "What type of people would benefit most from using our service?",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "thankYouPage",
|
||||
endScreen: true,
|
||||
elements: [
|
||||
{
|
||||
id: "thankYou",
|
||||
component: ThankYouHeading,
|
||||
type: "html",
|
||||
name: "thankYou",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</LayoutWaitlist>
|
||||
);
|
||||
|
||||
export default WaitlistPage;
|
||||
@@ -1,7 +1,9 @@
|
||||
# *
|
||||
User-agent: *
|
||||
Disallow: /pmf
|
||||
Allow: /
|
||||
|
||||
|
||||
# Host
|
||||
Host: https://formbricks.com
|
||||
|
||||
|
||||