mirror of
https://github.com/documenso/documenso.git
synced 2025-11-10 04:22:32 +10:00
feat: update marketing site
Signed-off-by: Adithya Krishna <adithya@documenso.com>
This commit is contained in:
@ -5,6 +5,7 @@ import React, { useEffect, useState } from 'react';
|
||||
import { usePathname } from 'next/navigation';
|
||||
|
||||
import { cn } from '@documenso/ui/lib/utils';
|
||||
import { AnnouncementBar } from '@documenso/ui/primitives/announcement-bar';
|
||||
|
||||
import { Footer } from '~/components/(marketing)/footer';
|
||||
import { Header } from '~/components/(marketing)/header';
|
||||
@ -38,6 +39,7 @@ export default function MarketingLayout({ children }: MarketingLayoutProps) {
|
||||
'bg-background/50 backdrop-blur-md': scrollY > 5,
|
||||
})}
|
||||
>
|
||||
<AnnouncementBar isShown={true} />
|
||||
<Header className="mx-auto h-16 max-w-screen-xl px-4 md:h-20 lg:px-8" />
|
||||
</div>
|
||||
|
||||
|
||||
@ -40,9 +40,9 @@ export const Callout = ({ starCount }: CalloutProps) => {
|
||||
className="rounded-full bg-transparent backdrop-blur-sm"
|
||||
onClick={onSignUpClick}
|
||||
>
|
||||
Get the Early Adopters Plan
|
||||
<span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs">
|
||||
$30/mo. forever!
|
||||
Claim Community Plan
|
||||
<span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs font-medium">
|
||||
-80%
|
||||
</span>
|
||||
</Button>
|
||||
|
||||
|
||||
@ -74,6 +74,15 @@ export const Header = ({ className, ...props }: HeaderProps) => {
|
||||
>
|
||||
Sign in
|
||||
</Link>
|
||||
<Link
|
||||
href="https://app.documenso.com/signin"
|
||||
target="_blank"
|
||||
className="text-muted-foreground hover:text-muted-foreground/80 text-sm font-semibold"
|
||||
>
|
||||
<span className="bg-primary dark:text-background rounded-full px-3 py-2 text-xs">
|
||||
Sign up
|
||||
</span>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<HamburgerMenu
|
||||
|
||||
@ -3,7 +3,8 @@
|
||||
import Image from 'next/image';
|
||||
import Link from 'next/link';
|
||||
|
||||
import { Variants, motion } from 'framer-motion';
|
||||
import type { Variants } from 'framer-motion';
|
||||
import { motion } from 'framer-motion';
|
||||
import { usePlausible } from 'next-plausible';
|
||||
import { LuGithub } from 'react-icons/lu';
|
||||
import { match } from 'ts-pattern';
|
||||
@ -113,9 +114,9 @@ export const Hero = ({ className, ...props }: HeroProps) => {
|
||||
className="rounded-full bg-transparent backdrop-blur-sm"
|
||||
onClick={onSignUpClick}
|
||||
>
|
||||
Get the Early Adopters Plan
|
||||
<span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs">
|
||||
$30/mo. forever!
|
||||
Claim Community Plan
|
||||
<span className="bg-primary dark:text-background -mr-2.5 ml-2.5 rounded-full px-2 py-1.5 text-xs font-medium">
|
||||
-80%
|
||||
</span>
|
||||
</Button>
|
||||
|
||||
|
||||
@ -50,6 +50,10 @@ export const MENU_NAVIGATION_LINKS = [
|
||||
href: 'https://app.documenso.com/signin',
|
||||
text: 'Sign in',
|
||||
},
|
||||
{
|
||||
href: 'https://app.documenso.com/signup',
|
||||
text: 'Sign up',
|
||||
},
|
||||
];
|
||||
|
||||
export const MobileNavigation = ({ isMenuOpen, onMenuOpenChange }: MobileNavigationProps) => {
|
||||
@ -104,7 +108,13 @@ export const MobileNavigation = ({ isMenuOpen, onMenuOpenChange }: MobileNavigat
|
||||
onClick={() => handleMenuItemClick()}
|
||||
target={target}
|
||||
>
|
||||
{href === 'https://app.documenso.com/signup' ? (
|
||||
<span className="bg-primary dark:text-background rounded-full px-3 py-2 text-xl">
|
||||
{text}
|
||||
</span>
|
||||
) : (
|
||||
text
|
||||
)}
|
||||
</Link>
|
||||
</motion.div>
|
||||
))}
|
||||
|
||||
@ -199,7 +199,7 @@ export const Widget = ({ className, children, ...props }: WidgetProps) => {
|
||||
className="bg-foreground/5 col-span-12 flex flex-col rounded-2xl p-6 lg:col-span-5"
|
||||
onSubmit={handleSubmit(onFormSubmit)}
|
||||
>
|
||||
<h3 className="text-2xl font-semibold">Sign up for the early adopters plan</h3>
|
||||
<h3 className="text-2xl font-semibold">Sign up to Community Plan</h3>
|
||||
<p className="text-muted-foreground mt-2 text-xs">
|
||||
with Timur Ercan & Lucas Smith from Documenso
|
||||
</p>
|
||||
@ -220,7 +220,7 @@ export const Widget = ({ className, children, ...props }: WidgetProps) => {
|
||||
<Input
|
||||
id="email"
|
||||
type="email"
|
||||
placeholder=""
|
||||
placeholder="your@example.com"
|
||||
className="bg-background w-full pr-16"
|
||||
disabled={isSubmitting}
|
||||
onKeyDown={(e) =>
|
||||
|
||||
30
packages/ui/primitives/announcement-bar.tsx
Normal file
30
packages/ui/primitives/announcement-bar.tsx
Normal file
@ -0,0 +1,30 @@
|
||||
import Link from 'next/link';
|
||||
|
||||
interface AnnouncementBarProps {
|
||||
isShown: boolean;
|
||||
}
|
||||
|
||||
export const AnnouncementBar: React.FC<AnnouncementBarProps> = ({ isShown }) => {
|
||||
return (
|
||||
isShown && (
|
||||
<div className="flex h-full w-full items-center justify-center gap-4 border-b-2 bg-green-400 p-1">
|
||||
<div className="text-center">
|
||||
<span className="text-sm text-gray-800">
|
||||
Claim your documenso public profile URL now!
|
||||
</span>{' '}
|
||||
<span className="text-sm font-medium text-gray-800">documenso.com/u/yourname</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center gap-4 rounded-lg bg-white px-3 py-1">
|
||||
<div className="text-xs text-gray-900">
|
||||
<Link
|
||||
href="https://app.documenso.com"
|
||||
>
|
||||
Claim now
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
};
|
||||
@ -3,7 +3,8 @@
|
||||
import * as React from 'react';
|
||||
|
||||
import * as TogglePrimitive from '@radix-ui/react-toggle';
|
||||
import { VariantProps, cva } from 'class-variance-authority';
|
||||
import type { VariantProps } from 'class-variance-authority';
|
||||
import { cva } from 'class-variance-authority';
|
||||
|
||||
import { cn } from '../lib/utils';
|
||||
|
||||
|
||||
Reference in New Issue
Block a user