gib/GibSend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add some marketing content

Browse Source
This commit is contained in:
KMKoushik
2024-04-21 20:50:24 +10:00
parent abd1f6bb5b
commit e7a0376519
6 changed files with 149 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
apps/marketing/.eslintrc.js → apps/marketing/.eslintrc.cjs
View File

1
apps/marketing/package.json
View File

@@ -9,6 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"@heroicons/react": "^2.1.3",
"framer-motion": "^11.0.24",
"lucide-react": "^0.359.0",
"next": "14.1.4",

160
apps/marketing/src/app/page.tsx
View File

@@ -1,45 +1,155 @@
import { ArrowRight, MoveRight, SendHorizonal } from "lucide-react";
import Image from "next/image";
import { BackgroundBeams } from "~/components/ui/background-beams";
import { StyledInput } from "~/components/ui/styled-input";
"use client";
import { motion } from "framer-motion";
import { Mail, Rocket } from "lucide-react";
import {
RocketLaunchIcon,
EnvelopeIcon,
MegaphoneIcon,
ChatBubbleOvalLeftEllipsisIcon,
BellAlertIcon,
} from "@heroicons/react/24/solid";
import { Code } from "@unsend/ui/src/code";
export default function Home() {
return (
<div className="bg-neutral-950">
<div className="h-[100vh] w-full rounded-md relative flex flex-col items-center justify-center antialiased">
<div className="bg-neutral-950 pb-20">
<div className="h-screen w-full relative flex flex-col items-center justify-center ">
<div className="max-w-4xl mx-auto p-4">
<h1 className="relative z-10 text-lg md:text-6xl md:leading-[4.5rem] text-center font-sans font-bold">
<h1 className="relative z-10 text-neutral-100 text-lg md:text-6xl md:leading-[4.5rem] text-center font-sans font-bold">
Open source sending infrastructure for{" "}
<span className="bg-clip-text text-transparent bg-gradient-to-r from-[#06b6d4] to-[#10b981]">
developers
</span>
</h1>
<p></p>
<p className="text-neutral-300 max-w-lg mx-auto my-4 text-center relative z-10">
<p className="text-neutral-100 text-lg max-w-lg mx-auto my-4 text-center relative z-10">
Send transactional, marketing emails, SMSes and push notifications
effortlessly.
</p>
<p className="text-neutral-300 max-w-lg mx-auto text-xl my-4 text-center relative z-10 mt-10">
Join the waitlist!
</p>
<div className="flex z-10 justify-center items-stretch bg-neutral-800 relative border border-gray-500 focus-within:border-[#06b6d45a] rounded-lg w-[400px] mx-auto mt-2">
<input
type="text"
className="flex-1 bg-transparent placeholder:text-neutral-600 outline-none relative z-10 px-4 p-2"
placeholder="ada@lovelace.com"
/>
<button className=" text-white rounded-lg w-10 bg-slate-100 flex items-center justify-center bg-gradient-to-r from-[#06b6d4ba] to-[#10b981ba]">
<ArrowRight className="text-neutral-700" />
</button>
<div className="flex justify-center mt-16">
<motion.a
className="bg-white text-black py-2 px-6 rounded-full cursor-pointer flex gap-2"
whileHover={{ scale: 1.2 }}
onHoverStart={(e) => {}}
onHoverEnd={(e) => {}}
transition={{ type: "spring", stiffness: 400, damping: 10 }}
href="https://app.youform.io/forms/caja89vr"
target="_blank"
>
<RocketLaunchIcon className="h-6 w-6" />
Join the waitlist
</motion.a>
</div>
</div>
<BackgroundBeams />
{/* <BackgroundBeams /> */}
</div>
<div className="h-[100vh] w-full rounded-md bg-neutral-950 relative flex flex-col items-center justify-center antialiased">
<div className="max-w-2xl mx-auto p-4">
<h1 className="relative z-10 text-lg md:text-7xl bg-clip-text text-transparent bg-gradient-to-b from-neutral-200 to-neutral-600 text-center font-sans font-bold">
<div className=" max-w-5xl mx-auto flex flex-col gap-40">
<div>
<p className="text-center text-6xl ">Reach your users</p>
</div>
<div className="flex">
<div className="w-1/2">
<div className="flex flex-col gap-2">
<EnvelopeIcon className="h-10 w-10 text-fuchsia-500" />
<p className="text-3xl font-semibold">Transactional Mail</p>
</div>
<ul className="flex flex-col gap-4 mt-8">
<li>Simple to use! No wasted time on configuration.</li>
<li>Send emails that reach the inbox, not spam.</li>
<li>Get notified of email bounces and complaints.</li>
</ul>
</div>
<div className="w-1/2">
{/* <Code
codeBlocks={[
{
language: "js",
code: `const unsend = require("unsend");
const email = unsend.email();
email.send({
to: "user@example.com",
subject: "Hello, World!",
text: "Hello, World!",
});`,
},
]}
/> */}
</div>
</div>
<div className="flex">
<div className="w-1/2">
<div className="flex flex-col gap-2">
<MegaphoneIcon className="h-10 w-10 text-indigo-500" />
<p className="text-3xl font-semibold">Marketing Mail</p>
</div>
<ul className="flex flex-col gap-4 mt-8">
<li>Manage newsletters, changelogs, and broadcasts easily.</li>
<li>Use our no-code email builder and templates.</li>
<li>Measure engagement using click and open tracking.</li>
<li>We will manage subscriptions for you.</li>
</ul>
</div>
<div className="w-1/2"></div>
</div>
<div className="flex">
<div className="w-1/2">
<div className="flex flex-col gap-2">
<ChatBubbleOvalLeftEllipsisIcon className="h-10 w-10 text-emerald-500" />
<div className="flex gap-4 items-center">
<p className="text-3xl font-semibold">SMS</p>
<div className="rounded-md border px-2 py-1 text-xs bg-neutral-900">
Coming soon
</div>
</div>
</div>
<ul className="flex flex-col gap-4 mt-8">
<li>Manage newsletters, changelogs, and broadcasts easily.</li>
<li>Use our no-code email builder and templates.</li>
<li>Measure engagement using click and open tracking.</li>
<li>We will manage subscriptions for you.</li>
</ul>
</div>
<div className="w-1/2"></div>
</div>
<div className="flex">
<div className="w-1/2">
<div className="flex flex-col gap-2">
<BellAlertIcon className="h-10 w-10 text-cyan-500" />
<div className="flex gap-4 items-center">
<p className="text-3xl font-semibold">Push notification</p>
<div className="rounded-md border px-2 py-1 text-xs bg-neutral-900">
Coming soon
</div>
</div>
</div>
<ul className="flex flex-col gap-4 mt-8">
<li>Manage newsletters, changelogs, and broadcasts easily.</li>
<li>Use our no-code email builder and templates.</li>
<li>Measure engagement using click and open tracking.</li>
<li>We will manage subscriptions for you.</li>
</ul>
</div>
<div className="w-1/2"></div>
</div>
</div>
<div className="">
<div className="flex justify-center mt-40">
<motion.a
className="bg-white text-black py-2 px-6 rounded-full cursor-pointer flex gap-2"
whileHover={{ scale: 1.2 }}
onHoverStart={(e) => {}}
onHoverEnd={(e) => {}}
transition={{ type: "spring", stiffness: 400, damping: 10 }}
href="https://app.youform.io/forms/caja89vr"
target="_blank"
>
<RocketLaunchIcon className="h-6 w-6" />
Join the waitlist
</h1>
</motion.a>
</div>
</div>
</div>

2
apps/web/src/app/(dashboard)/layout.tsx
View File

@@ -64,7 +64,7 @@ export default async function AuthenticatedDashboardLayout({
<div className="flex h-full max-h-screen flex-col gap-2">
<div className="flex h-14 items-center px-4 lg:h-[60px] lg:px-6">
<Link href="/" className="flex items-center gap-2 font-semibold">
<Image src="/Logo-1.png" alt="Unsend" width={40} height={40} />
<Image src="/Logo-2.png" alt="Unsend" width={20} height={20} />
<span className=" ">Unsend</span>
</Link>

1
packages/ui/src/code.tsx
View File

@@ -16,7 +16,6 @@ type CodeProps = {
codeBlocks: {
language: Language;
code: string;
display?: string;
}[];
};

13
pnpm-lock.yaml generated
View File

@@ -27,6 +27,9 @@ importers:
apps/marketing:
dependencies:
'@heroicons/react':
specifier: ^2.1.3
version: 2.1.3(react@18.2.0)
framer-motion:
specifier: ^11.0.24
version: 11.0.24(react-dom@18.2.0)(react@18.2.0)
@@ -1498,6 +1501,14 @@ packages:
resolution: {integrity: sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==}
dev: false
/@heroicons/react@2.1.3(react@18.2.0):
resolution: {integrity: sha512-fEcPfo4oN345SoqdlCDdSa4ivjaKbk0jTd+oubcgNxnNgAfzysfwWfQUr+51wigiWHQQRiZNd1Ao0M5Y3M2EGg==}
peerDependencies:
react: '>= 16'
dependencies:
react: 18.2.0
dev: false
/@hono/node-server@1.9.1:
resolution: {integrity: sha512-XBru0xbtRlTZJyAiFJLn7XDKbCVXBaRhVQAQhB9TwND2gwj8jf9SDWIj/7VxVtNAjURJf7Ofcz58DRA6DPYiWA==}
engines: {node: '>=18.14.1'}
@@ -4459,7 +4470,7 @@ packages:
enhanced-resolve: 5.16.0
eslint: 8.57.0
eslint-module-utils: 2.8.1(@typescript-eslint/parser@6.21.0)(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0)
eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.2.0)(eslint@8.57.0)
eslint-plugin-import: 2.29.1(eslint@8.57.0)
fast-glob: 3.3.2
get-tsconfig: 4.7.3
is-core-module: 2.13.1