Skip to content

Commit

Permalink
Merge branch 'master' of https://github.com/JerryJeager/Will-Be-There
Browse files Browse the repository at this point in the history
…into feature/authentication-page
  • Loading branch information
i-joe committed Apr 25, 2024
2 parents 710cdef + 2630a9f commit 0a5d219
Show file tree
Hide file tree
Showing 15 changed files with 206 additions and 131 deletions.
1 change: 0 additions & 1 deletion app/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,3 @@
}
}


2 changes: 1 addition & 1 deletion app/layout.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ export default async function RootLayout({
<html lang="en" style={{scrollBehavior: "smooth"}}>
<body className={inter.className}>
<SessionProvider session={session}>
<div className="mx-auto text-xl gap-10 m-10">
<div className="mx-auto text-xl gap-10 ">
<Navbar />
{children}
</div>
Expand Down
Binary file added public/assets/footerLogo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified public/assets/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 16 additions & 7 deletions src/components/Footer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,25 @@ import Image from "next/image";
import linkedinIcon from "../../public/assets/linkedin.png";
import facebookIcon from "../../public/assets/facebook.png";
import twitterIcon from "../../public/assets/twitter.png";
import Link from "next/link";
import logo from "../../public/assets/footerLogo.png";


export const Footer = () => {
return (
<section className="flex flex-col items-start justify-center gap-7 h-auto bg-[#0B195B] text-white py-8 md:px-10 px-5 ">
<div className="flex flex-wrap items-center w-full h-full justify-between md:px-8 space-y-4 ">
<div className="flex flex-wrap items-center w-full h-full justify-between space-y-4 ">
<div className="gap-10">
<span className="mb-6 text-xl">LOGO</span>
<h3 className="leading-8 text-sm md:text-medium ">
Email:[email protected] <br />
+2348140732549
</h3>
<p className="mb-6 text-xl ">
<Link href="/" className="flex items-center">
<Image src={logo} alt="logo" />
<span className="text-3xl font-bold">WBT</span>
</Link>
</p>
<p className="leading-8 text-sm md:text-medium ">
Email: [email protected] <br />
Phone: +2348140732549
</p>
<div className="flex items-start gap-2 mt-2">
<Image
src={linkedinIcon}
Expand Down Expand Up @@ -77,7 +86,7 @@ export const Footer = () => {
</div>
<div className="h-[1px] bg-white w-full md:w-[90%]"></div>
<div className="text-sm flex flex-wrap gap-2 items-center ">
<p>&copy; 2023 positvus. All right reserved</p>
<p>&copy; 2024 will be there. All right reserved</p>
<p>Privacy Policy</p>
</div>
</section>
Expand Down
12 changes: 8 additions & 4 deletions src/components/Navbar.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const Navbar = () => {
<Image src={logo} alt="logo" />
</Link>
</li>
<li className="gap-10 hidden md:flex transition-all">
<li className="gap-10 hidden md:flex transition-all font-semibold">
<Link href="/dashboard" className="flex items-center space-x-1">
<span>Features</span>
<svg
Expand All @@ -55,9 +55,9 @@ const Navbar = () => {
<span>Pricing</span>
</Link>
</li>
<li className=" hidden md:flex transition-all">
<li className=" hidden md:flex transition-all ">
<Link href="/signup">
<Button text="signup" />
<Button text="Sign Up" />
</Link>
</li>
{/* hamburger-menu */}
Expand All @@ -72,7 +72,7 @@ const Navbar = () => {
} h-screen top-0 pt-4 rounded-l-lg shadow-2xl bg-white z-50 transition-all duration-700 ease-linear `}
>
<div className=" flex justify-end p-3" onClick={handleSideBar}>
<IoMdClose size={20} />
<IoMdClose size={30} />
</div>
<div className="ml-3 space-y-4">
<p>
Expand All @@ -84,6 +84,10 @@ const Navbar = () => {
<p>
<Link href="/">Pricing</Link>
</p>

<p className="text-[#0d35fb] font-semibold">
<Link href="/">Sign Up</Link>
</p>
</div>
</div>
)}
Expand Down
20 changes: 10 additions & 10 deletions src/components/sections/Faq.jsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,38 @@
"use client";
import React, { useState } from "react";
import { Wrapper } from "../../shared/Wrapper";
import { IoIosArrowDown } from "react-icons/io";
import { IoIosArrowDown, IoIosArrowUp } from "react-icons/io";

export const FaqData = [
{
id: 1,
title: "What Is Will Be There About",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
details: "Will Be There is standard online event planning, guest tracking and management platform making it easy for event organizers to manage their guest in real time.",
},
{
id: 2,
title: "Is it free to use?",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ",
details: "Will Be There has different pricing structure that fits individual peculiar needs beginning from the free plan to basic and premium.",
},
{
id: 3,
title: "Do I need to download any software to use Will Be There?",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ",
details: "Users do not necessarily need to download additional software as our website is web base and responsive on various devices",
},
{
id: 4,
title: "Can I manage my guest list?",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ",
details: "Yes, our RSVP app lets you easily handle your guest list. Add, update, and track RSVPs hassle-free, ensuring your event planning runs smoothly.",
},
{
id: 5,
title: "Can I send follow-up reminders?",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ",
details: "Yes, our RSVP platform allows you to schedule and send follow-up reminders with ease. Keep your guests informed and ensure maximum attendance with our convenient reminder feature.",
},
{
id: 6,
title: "Can guests update their RSVP after they respond?",
details: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ",
details: "Yes, guests can update their RSVP responses at any point, giving them the flexibility they need for your event.",
},
];

Expand Down Expand Up @@ -60,9 +60,9 @@ export const Faq = () => {
className="flex justify-between items-center cursor-pointer"
onClick={() => handleToggle(index)}
>
<p>{data.title}</p>
<span>
<IoIosArrowDown />
<p className="text-[1.1rem] pr-2">{data.title}</p>
<span className="transition-all duration-200">
{isOpen === index ? <IoIosArrowDown /> : <IoIosArrowUp />}
</span>
</div>
<div className="p-2 text-gray-500 ease-in-out transition-all duration-300">
Expand Down
150 changes: 82 additions & 68 deletions src/components/sections/Features.jsx
Original file line number Diff line number Diff line change
@@ -1,74 +1,88 @@
import React from 'react'
import icon1 from "../../../public/assets/icon1.png"
import icon2 from "../../../public/assets/icon2.png"
import icon3 from "../../../public/assets/icon3.png"
import icon4 from "../../../public/assets/icon4.png"
import icon5 from "../../../public/assets/icon5.png"
import icon6 from "../../../public/assets/icon6.png"
import Image from 'next/image'
import { Wrapper } from '../../shared/Wrapper'
import React from "react";
import icon1 from "../../../public/assets/icon1.png";
import icon2 from "../../../public/assets/icon2.png";
import icon3 from "../../../public/assets/icon3.png";
import icon4 from "../../../public/assets/icon4.png";
import icon5 from "../../../public/assets/icon5.png";
import icon6 from "../../../public/assets/icon6.png";
import Image from "next/image";
import { Wrapper } from "../../shared/Wrapper";

export const Featuredata = [
{
id: 1,
icon: icon1,
title: "Personalize Invite",
text: "Easily customize invitations effortlessly to reflect your unique style and event theme"
},
{
id: 2,
icon: icon2,
title: "Feedback Message",
text: "Stay informed about guest attendance with RSVP responses indicating their attendance status"
},
{
id: 3,
icon: icon3,
title: "Guest List Tracking",
text: "Manage your guest list and track delivery status to recipients' emails with precision"
},
{
id: 4,
icon: icon4,
title: "Event Reminder",
text: "Never miss a beat, Receive timely reminders for both hosts and RSVPs as the big day approaches"
},
{
id: 5,
icon: icon5,
title: "Invite Update",
text: "Receive instant notifications for any updates to RSVPs, including additional guests or gift items"
},
{
id: 6,
icon: icon6,
title: "Special Note",
text: "RSVPs can include special notes or congratulatory messages to enhance the event experience"
},
]
export const Featuredata = [
{
id: 1,
icon: icon1,
title: "Personalize Invite",
text: "Easily customize invitations effortlessly to reflect your unique style and event theme",
},
{
id: 2,
icon: icon2,
title: "Feedback Message",
text: "Stay informed about guest attendance with RSVP responses indicating their attendance status",
},
{
id: 3,
icon: icon3,
title: "Guest List Tracking",
text: "Manage your guest list and track delivery status to recipients' emails with precision",
},
{
id: 4,
icon: icon4,
title: "Event Reminder",
text: "Never miss a beat, Receive timely reminders for both hosts and RSVPs as the big day approaches",
},
{
id: 5,
icon: icon5,
title: "Invite Update",
text: "Receive instant notifications for any updates to RSVPs, including additional guests or gift items",
},
{
id: 6,
icon: icon6,
title: "Special Note",
text: "RSVPs can include special notes or congratulatory messages to enhance the event experience",
},
];

export const Features = () => {
return (
<section className=''>
<div className='bg-[#0D154B] flex flex-col justify-center items-center p-5'>
<div className='text-center space-y-5 p-5'>
<p className='text-[#BCC2FF] text-3xl'>Features</p>
<p className='text-white'>Essential Tools for Seamless Planning and Delighted Guests.</p>
</div>
<div className='grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 m-2'>
{
Featuredata.map( (data) => {
return (
<div key={data.id} className='hover:shadow-2xl shadow-indigo-500 hover:scale-105 cursor-pointer transition-all duration-200 text-white bg-[#BCC2FF]/20 w-60 h-48 rounded-lg flex flex-col items-center justify-center space-y-2'>
<p className='text-center h-10 w-10'><Image src={data.icon} alt='icon' width="300" height={'400'} quality={100} className='w-full h-full'/></p>
<p className='text-[#FFFFFF]'>{data.title}</p>
<p className='text-sm text-center font-normal p-2 text-[#F5F2FA]'>{data.text}</p>
</div>
)
})
}
</div>
<section className="">
<div className="bg-[#0D154B] flex flex-col justify-center items-center p-5 pb-12">
<div className="text-center space-y-5 p-5 pt-10 ">
<p className="text-[#BCC2FF] text-4xl font-bold">Features</p>
<p className="text-white text-lg md:text-xl">
Essential Tools for Seamless Planning and Delighted Guests.
</p>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6 md:m-6">
{Featuredata.map((data) => {
return (
<div
key={data.id}
className="hover:shadow-2xl shadow-indigo-500 hover:scale-105 cursor-pointer transition-all duration-200 text-white bg-[#BCC2FF]/20 min-w-full lg:w-[23rem] h-[16rem] md:h-[20rem] lg:h-[16rem] rounded-lg flex flex-col items-center justify-center space-y-2 p-4 lg:p-8"
>
<p className="text-center h-[4rem] w-[4rem]">
<Image
src={data.icon}
alt="icon"
width="400"
height={"500"}
quality={100}
className="w-full h-full"
/>
</p>
<p className="text-[#FFFFFF] font-bold">{data.title}</p>
<p className="text-[1rem] font-[500] text-center p-2 text-[#F5F2FA]">
{data.text}
</p>
</div>
);
})}
</div>
</div>
</section>
)
}
);
};
4 changes: 2 additions & 2 deletions src/components/sections/Hero.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@ export const Hero = () => {
return (
<section className="">
<Wrapper>
<div className="flex flex-col md:flex-row gap-2 p-2 sm:p-4 items-center justify-between py-10">
<div className="flex flex-col md:flex-row gap-2 p-2 sm:p-4 items-center justify-between pb-10">
{/* left side */}
<div className="space-y-5 py-5 md:w-[50%] flex flex-col items-center md:items-start">
<div className="space-y-5 py-5 md:w-[50%] flex flex-col items-center md:items-start text-center md:text-start">
<p className="text-4xl font-semibold">
Instantly Create{" "}
<strong className="text-[#0D35FB]">Custom</strong> Invite For Any
Expand Down
2 changes: 1 addition & 1 deletion src/components/sections/Overview1.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export const Overview1 = () => {
<Wrapper>
<div className='flex flex-col md:flex-row md:py-10 px-5 space-y-4 md:space-x-12'>
{/* left */}
<div className='space-y-4 md:w-[50%]'>
<div className='space-y-4 md:w-[50%] text-center md:text-start'>
<p className='font-bold sm:text-3xl text-xl'>Streamline your event journey from start to finish</p>
<p className='text-gray-500 text-lg'>
Begin with effortlessly compile a list of for guests and items to contribute to your event, ensuring every detail is accounted for.
Expand Down
6 changes: 3 additions & 3 deletions src/components/sections/Overview2.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@ export const Overview2 = () => {
<Image src={image} alt={'image'} className='w-full h-full object-contain'/>
</div>
{/* right */}
<div className='space-y-4 md:w-[50%] order-first md:order-last'>
<p className='font-bold sm:text-3xl text-xl'>Streamline your event journey from start to finish</p>
<div className='space-y-4 md:w-[50%] order-first md:order-last text-center md:text-start'>
<p className='font-bold sm:text-3xl text-xl'>Elevate your event planning journey!</p>
<p className='text-gray-500 text-lg'>
Begin with effortlessly compile a list of for guests and items to contribute to your event, ensuring every detail is accounted for.
Effortlessly organize guest lists and contributions, ensuring a seamless and stress-free experience every step of the way.
</p>
<div>
<Button text="Try Now For Free"/>
Expand Down
2 changes: 1 addition & 1 deletion src/components/sections/Planning.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const Planning = () => {
<div>
<Wrapper>
<div className="flex flex-col items-center p-5 text-sm md:p-11 sm:text-lg rounded-[2rem] bg-[#DFE0FF] mb-11">
<p className="text-center text-[#0B195B] font-bold text-[1.8rem] leading-7 p-5">
<p className="text-center text-[#0B195B] font-bold text-[1.1rem] leading-6 md:text-[2.1rem] md:leading-10 p-5">
Planning an event shouldn't be stressful, Let's help you create an
online invite today!
</p>
Expand Down
Loading

0 comments on commit 0a5d219

Please sign in to comment.