111 lines
4.0 KiB
TypeScript
111 lines
4.0 KiB
TypeScript
import { BsApple, BsWindows } from "react-icons/bs";
|
||
import { FaPeopleCarry, FaRunning } from "react-icons/fa";
|
||
|
||
import Footer from "../components/footer";
|
||
import FullMottoLogo from "../../components/logo/fullMotto";
|
||
import Head from "next/head";
|
||
import Header from "../components/header";
|
||
import HorizontalLogo from "../../components/logo/horizontal";
|
||
import Image from "next/image";
|
||
import { LogoType } from "../../components/logo/full";
|
||
import { MdOutlineNaturePeople } from "react-icons/md";
|
||
import type { NextPage } from "next";
|
||
import styles from "../styles/Home.module.css";
|
||
|
||
const Home: NextPage = () => {
|
||
return (
|
||
<>
|
||
{/* header */}
|
||
<Header />
|
||
|
||
<div className="container mx-auto px-20">
|
||
{/* above fold experience */}
|
||
<div className="flex flex-row items-center space-x-10 mt-10">
|
||
<div className="flex flex-col items-start">
|
||
<span className="text-white text-6xl leading-[1.2] font-extrabold">
|
||
The <span className="text-nirvanaTeal">walkie-talkie</span> <br />{" "}
|
||
for remote teams.
|
||
</span>
|
||
|
||
<span className="text-zinc-400 text-xl mt-5">
|
||
The <span className="text-nirvanaTeal">{"'less is more'"}</span>{" "}
|
||
approach. Skip zoom scheduling, <br></br> slack notifications, and
|
||
email threads. <br /> Just talk to your team.
|
||
</span>
|
||
|
||
{/* download */}
|
||
<span className="flex flex-col justify-start mt-20">
|
||
<span className="text-white font-bold text-md mb-2">
|
||
Download the desktop app
|
||
</span>
|
||
|
||
<span className="flex flex-row space-x-2">
|
||
<span className="p-2 rounded bg-zinc-500 cursor-pointer">
|
||
<BsWindows className="text-white text-xl" />
|
||
</span>
|
||
|
||
<span className="p-2 rounded bg-zinc-500 cursor-pointer">
|
||
<BsApple className="text-white text-xl" />
|
||
</span>
|
||
</span>
|
||
</span>
|
||
</div>
|
||
|
||
<img
|
||
src="/illustrations/undraw_co-working_re_w93t.svg"
|
||
className="h-[30em]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
{/* value points */}
|
||
<div className="flex flex-row w-full mx-auto px-20 py-10 bg-zinc-500 my-10 space-x-5">
|
||
<span className="p-5 bg-zinc-600 flex flex-col items-start flex-1 shadow">
|
||
<span className="flex flex-row items-center space-x-2">
|
||
<FaRunning className="text-white text-xl" />
|
||
<span className="text-white font-semibold text-lg">
|
||
Move Faster
|
||
</span>
|
||
</span>
|
||
|
||
<span className="text-zinc-300 text-sm">
|
||
No more back and forth chatter. Resolve issues in seconds with
|
||
spontaneous conversations.
|
||
</span>
|
||
</span>
|
||
|
||
<span className="p-5 bg-zinc-600 flex flex-col items-start flex-1 shadow">
|
||
<span className="flex flex-row items-center space-x-2">
|
||
<MdOutlineNaturePeople className="text-white text-xl" />
|
||
<span className="text-white font-semibold text-lg">Minimal</span>
|
||
</span>
|
||
|
||
<span className="text-zinc-300 text-sm">
|
||
All of your team’s converstions in one place. Nirvana’s built for
|
||
flow state. Communication as simple and human as possible.
|
||
</span>
|
||
</span>
|
||
|
||
<span className="p-5 bg-zinc-600 flex flex-col items-start flex-1 shadow">
|
||
<span className="flex flex-row items-center space-x-2">
|
||
<FaPeopleCarry className="text-white text-lg" />
|
||
<span className="text-white font-semibold text-lg">
|
||
Build Culture
|
||
</span>
|
||
</span>
|
||
|
||
<span className="text-zinc-300 text-sm">
|
||
Close-knit culture and increased serendipity by knowing your team’s
|
||
right there with you.
|
||
</span>
|
||
</span>
|
||
</div>
|
||
|
||
{/* footer */}
|
||
<Footer />
|
||
</>
|
||
);
|
||
};
|
||
|
||
export default Home;
|