diff --git a/components/demo/Announcements.tsx b/components/demo/Announcements.tsx new file mode 100644 index 0000000..47e6cbb --- /dev/null +++ b/components/demo/Announcements.tsx @@ -0,0 +1,96 @@ +import { FaAngleDown, FaCheck, FaMicrophoneAlt, FaPlay } from "react-icons/fa"; +import { UserStatus } from "../../models/user"; + +import Image from "next/image"; + +export default function Announcements() { + return ( +
+ + + + ANNOUNCEMENTS + + + + + {/* tab pane */} + + + Active + + + + Resolved + + + + + TODAY + + + + + + +
+ {/* adriana's announcement */} + + + + + profile + + + + Adriana + 5 minutes ago + + blockers + + + + + {/* arjun's announcement */} + + + + + profile + + + + Arjun + 30 minutes ago + + engineering + + + + + +
+
+ ); +} diff --git a/components/demo/Rooms.tsx b/components/demo/Rooms.tsx new file mode 100644 index 0000000..57ab462 --- /dev/null +++ b/components/demo/Rooms.tsx @@ -0,0 +1,260 @@ +import { BsThreeDots } from "react-icons/bs"; +import { FaAngleDown, FaBell, FaClock, FaLink, FaPlus } from "react-icons/fa"; +import { IoTimer } from "react-icons/io5"; +import Image from "next/image"; + +export default function Rooms() { + return ( +
+ {/* spontaneous bugs room */} + + {/* header */} + + {/* meeting details */} + + + bug fixing + + + were just fixing that jsx bug thats a paiiinnnn + + + {/* badges and tags */} + + + blockers + + + + engineering + + + + + {/* room status */} + + + + live + + + {/* room attachments */} + + + + + + + + + {/* footer */} + + + + + profile + + + + profile + + + Arjun and Liam + + {" "} + + + + {/* live room - design meeting */} + + {/* header */} + + {/* meeting details */} + + + Shopping Cart Experience + + + lets finish the mockups @josh, @mark, and @arjun please step in + for feedback + + + {/* badges and tags */} + + + design + + + + + {/* room status */} + + + + scheduled + + + afternoon + + + {/* room attachments */} + + + + + + + + + {/* footer */} + + + + + profile + + + + Adriana + + + + + + + + {/* recurring room - demo */} + + {/* header */} + + {/* meeting details */} + + + Sprint Demo + + + All hands on deck...lets have fun :) + + + {/* badges and tags */} + + + scrum + + + + + {/* room status */} + + + + recurring + + + + biweekly fridays! + + + + + {/* footer */} + + + + {" "} + + + + {/* recurring room - wine wednesdays */} + + {/* header */} + + {/* meeting details */} + + + Wine Wednesdays + + + @JOSH YOU BETTER COME + + + {/* badges and tags */} + + + party 🎉 + + + + + {/* room status */} + + + + recurring + + + + Wedn. 7-9pm + + + + + {/* footer */} + + + + + + + + +
+ ); +} diff --git a/components/demo/TeamVoiceLine.tsx b/components/demo/TeamVoiceLine.tsx new file mode 100644 index 0000000..b335977 --- /dev/null +++ b/components/demo/TeamVoiceLine.tsx @@ -0,0 +1,143 @@ +import { FaPlus } from "react-icons/fa"; +import { UserStatus } from "../../models/user"; + +import Image from "next/image"; +import { IoPulseOutline, IoRemoveOutline } from "react-icons/io5"; + +let testFriends = [ + { + name: "Liam", + role: "engineer", + systemAvatar: "29", + status: UserStatus.online, + }, + { + name: "Emily", + role: "engineer", + systemAvatar: "02", + status: UserStatus.online, + }, + { + name: "Paul", + role: "architect", + systemAvatar: "43", + status: UserStatus.online, + }, + { + name: "Mark", + role: "engineer", + systemAvatar: "04", + status: UserStatus.busy, + }, +]; + +function statusBubble(status: UserStatus) { + console.log(status); + + switch (status) { + case UserStatus.online: + return ( + + ); + case UserStatus.busy: + return ( + + ); + case UserStatus.offline: + return ( + + ); + default: + return ( + + ); + } +} + +function renderPulse(status: UserStatus) { + switch (status) { + case UserStatus.online: + return ( + + ); + case UserStatus.busy: + return ( + + ); + case UserStatus.offline: + return ( + + ); + default: + return ( + + ); + } +} + +export default function TeamVoiceLine() { + return ( +
+ + + + TEAM + + + + + + + {/* list of team members */} + {testFriends.map((friend, i) => { + return ( + + + + + {statusBubble(friend.status)} + + profile + + + + + + {friend.name}{" "} + + + + + + {friend.role} + + + + {renderPulse(friend.status)} + + ); + })} +
+ ); +} diff --git a/pages/index.js b/pages/index.js index 7b63501..aa21ad9 100644 --- a/pages/index.js +++ b/pages/index.js @@ -7,17 +7,31 @@ import { FaRocketchat, FaAngleRight, } from "react-icons/fa"; +import TeamVoiceLine from "../components/demo/TeamVoiceLine"; +import Announcements from "../components/demo/Announcements"; +import Rooms from "../components/demo/Rooms"; import MainLogo from "../components/MainLogo"; +import { Divider } from "antd"; export default function Home() { const handleGetDemo = () => { window.open("https://calendly.com/usenirvana/30min", "_blank"); }; + const getStartedButton = ( + + ); + return (
-
+
{/* header */}
@@ -28,13 +42,7 @@ export default function Home() { Features Pricing Log In - + {getStartedButton}
@@ -75,40 +83,90 @@ export default function Home() { - + {getStartedButton}
{/* main mission */} -
+
Philosophy - In today's distracted world, we mistake software and tools for - productivity. + In today's distracted world, we mistake using 10 software and tools + for productivity. At Nirvana, are bringing remote work back to the basics. Voice first communication because voice makes us human and less is more. An - experience as if your team is right next to me. + experience as if your team was right next to you. <>
-
- - Philosophy + {/* voice line concept */} +
+ + + Voice Line + + + + More clear and efficient communication. + + + + + + No more notifications, clicking, scrolling. + + + + Listen to your engineer voice their problem realtime or have an + asynchronous conversation. + + + + + +
+ + {/* explaining rooms */} +
+ + + + + Rooms + + + + See what's going on across the hall at a glance. + + + + + + Why go back and forth through chat 100 times or schedule a meeting + tomorrow at 2pm? + + + + Jump into rooms and resolve issues quicker. + + +
+ + {/* action section */} +
+ + Ready to start working? + + {getStartedButton}