Amir Hossein Khademi 2024-09-16 03:06:24 +03:30
commit 5febf40ef7
11 changed files with 261 additions and 65 deletions

View File

@ -42,12 +42,12 @@ const ActivityCardFake = ({ data }) => {
const handleUndoneResone = () => {
setConditionTask(4);
CTX.UnDoneActivity(data.id, undoneResone);
// CTX.UnDoneActivity(data.id, undoneResone);
};
const handleDone = () => {
setConditionTask(3);
CTX.DoneActivity(data.id);
// CTX.DoneActivity(data.id);
};
return (
@ -102,12 +102,12 @@ const ActivityCardFake = ({ data }) => {
<div
className={`w-[40px] h-[35px] border-[2px] rounded-full ml-3 tr03 ${
conditionTask == 1
? "animate-spin-slow duration-700 border-gray-400 border-dashed"
? " border-gray-400 border-dashed animate-spin-slow duration-700"
: conditionTask == 2 || conditionTask == 4 || data?.status == 4
? "border-red-600"
: conditionTask == 3 || data?.status == 2 || data?.status == 3
? "border-primary-200"
: "border-gray-500 border-dashed"
: "border-gray-500 border-dashed animate-spin-slow duration-700"
}`}
onClick={() => handleConditionTaskCircle()}
>

View File

@ -81,14 +81,14 @@ const ExperienceCard = ({ experience }) => {
};
const Experience = () => {
const [number, setNumber] = useState(2001);
const [prevNumber, setPrevNumber] = useState(2001);
const [number, setNumber] = useState(4521);
const [prevNumber, setPrevNumber] = useState(4521);
useEffect(() => {
const interval = setInterval(() => {
setPrevNumber(number);
setNumber((prev) => prev + 1);
}, 3000);
}, 15000);
return () => clearInterval(interval);
}, [number]);

View File

@ -5,10 +5,26 @@ import Link from "next/link";
const Footer = () => {
return (
<div className="bg-[#060c0a] p-10">
<div className="bg-hero-pattern-footer ">
<div className="w-7/12 mx-auto py-20">
<div className="flex justify-center">
<div className="flex"></div>
<div className="text-center w-full">
<p className="mb-0 text-white text-center mt-10 font-bold lg:text-[70px] xs:text-[30px] lg:leading-[60px] w-fit">
<small className="text-primary-300">"</small>
Briz, Harmonious routine
</p>
<p className=" text-white text-center mb-10 font-bold lg:text-[70px] xs:text-[30px] lg:leading-[60px] w-fit">
management
<small className=" text-primary-300">"</small>
</p>
</div>
</div>
</div>
<div className="flex justify-center">
<div>
<div className="w-full">
<div className="w-full mb-5">
<Image src={logo2} className="w-[90px] mx-auto" />
</div>
<p className="mb-0 text-sm text-gray-400 w-full text-center opacity-30 ">
@ -17,7 +33,7 @@ const Footer = () => {
{process.env.NEXT_PUBLIC_VERSION}
</p>
<div className="flex justify-center w-full mt-4 ">
<div className="flex justify-center w-full my-5 ">
<Link href={`/pricing`}>
<p className="mb-0 text-gray-400 mx-4">pricing</p>
</Link>

View File

@ -72,7 +72,7 @@ const Navbar = () => {
</div>
<div className="flex">
<Link href="/login">
<Link href="/app/login">
<button className=" btn btn-primary px-10 rounded-full py-2 xs:hidden lg:block">
Get started
</button>

View File

@ -1,6 +1,10 @@
import React from "react";
import Link from "next/link";
import React, { useState } from "react";
const PricingHero = () => {
const [oneMonth, setOneMonth] = useState(0);
const [threeMonth, setThreeMonth] = useState(0);
const [oneYear, setOneYear] = useState(0);
return (
<div className="min-h-[100vh]">
<div className="flex justify-center lg:pt-[150px] xs:pt-[100px] lg:ml-0">
@ -16,37 +20,177 @@ const PricingHero = () => {
</p>
</div>
</div>
<div className="grid lg:flex lg:justify-center xs:px-10 lg:px-[120px] mt-20">
<div className="p-5 text-center lg:mx-10">
<p className="mb-0 text-white text-[30px] font-thin bg-primary-300 w-fit mx-auto px-4 rounded-full">
per Month
</p>
<div className="grid xs:grid-cols-1 lg:grid-cols-3 gap-10 xs:px-[20px] lg:px-[100px] mt-10">
<div className=" p-3 flex">
<div className="w-4/12 ">
<div
className={`bg-[#132420] p-4 rounded-l-3xl cursor-pointer tr03 ${
oneMonth == 0 ? " " : "opacity-50"
} `}
onClick={() => setOneMonth(0)}
>
<p className="mb-0 text-center text-white text-xl">up 10 user</p>
</div>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
oneMonth == 1 ? " " : "opacity-50"
} `}
onClick={() => setOneMonth(1)}
>
<p className="mb-0 text-center text-white text-xl">up 25 user</p>
</div>
<p className="mb-0 text-[100px] font-bold text-white mt-10">46 </p>
</div>
<div className="p-5 text-center lg:mx-10">
<p className="mb-0 text-white text-[30px] font-thin bg-primary-300 w-fit mx-auto px-4 rounded-full">
3 Months
</p>
<div className="flex justify-center">
<del className="mb-0 text-[30px] text-white absolute mt-[15px]">
138
</del>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
oneMonth == 2 ? " " : "opacity-50"
} `}
onClick={() => setOneMonth(2)}
>
<p className="mb-0 text-center text-white text-xl">up 50 user</p>
</div>
</div>
<p className="mb-0 text-[100px] font-bold text-white mt-10">110 </p>
</div>
<div className="p-5 text-center lg:mx-10">
<p className="mb-0 text-white text-[30px] font-thin bg-primary-300 w-fit mx-auto px-4 rounded-full">
12 Months
</p>
<div className="flex justify-center">
<del className="mb-0 text-[30px] text-white absolute mt-[15px]">
552
</del>
<div className="w-8/12 bg-[#132420] p-10 rounded-r-3xl rounded-bl-3xl">
<h2 className="mb-0 text-center font-bold text-[25px] text-gray-400">
1 Mounth
</h2>
<p className="mb-0 text-center text-white text-[33px] font-bold">
{oneMonth == 0
? " 15,000,000 R"
: oneMonth == 1
? " 24,000,000 R"
: oneMonth == 2
? " 29,500,000 R"
: " 15,000,000 R"}
</p>
<p className="mb-0 text-center text-gray-400 text-sm">
It could be the best package for you, so feel free to use the
14-day free trial
</p>
<div className="flex justify-center mt-10">
<Link href="/app/login">
<button className=" btn btn-primary px-10 rounded-full py-2 xs:hidden lg:block">
Get started
</button>
</Link>
</div>
</div>
</div>
<div className=" p-3 flex">
<div className="w-4/12 ">
<div
className={`bg-[#132420] p-4 rounded-l-3xl cursor-pointer tr03 ${
threeMonth == 0 ? " " : "opacity-50"
} `}
onClick={() => setThreeMonth(0)}
>
<p className="mb-0 text-center text-white text-xl">up 10 user</p>
</div>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
threeMonth == 1 ? " " : "opacity-50"
} `}
onClick={() => setThreeMonth(1)}
>
<p className="mb-0 text-center text-white text-xl">up 25 user</p>
</div>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
threeMonth == 2 ? " " : "opacity-50"
} `}
onClick={() => setThreeMonth(2)}
>
<p className="mb-0 text-center text-white text-xl">up 50 user</p>
</div>
</div>
<div className="w-8/12 bg-[#132420] p-10 rounded-r-3xl rounded-bl-3xl">
<h2 className="mb-0 text-center font-bold text-[25px] text-gray-400">
3 Mounth
</h2>
<p className="mb-0 text-center text-white text-[33px] font-bold">
{threeMonth == 0
? " 36,000,000 R"
: threeMonth == 1
? " 57,600,000 R"
: threeMonth == 2
? " 70,800,000 R"
: " 36,000,000 R"}{" "}
</p>
<p className="mb-0 text-center text-gray-400 text-sm">
It could be the best package for you, so feel free to use the
14-day free trial
</p>
<div className="flex justify-center mt-10">
<Link href="/app/login">
<button className=" btn btn-primary px-10 rounded-full py-2 xs:hidden lg:block">
Get started
</button>
</Link>
</div>
</div>
</div>
<div className=" p-3 flex">
<div className="w-4/12 ">
<div
className={`bg-[#132420] p-4 rounded-l-3xl cursor-pointer tr03 ${
oneYear == 0 ? " " : "opacity-50"
} `}
onClick={() => setOneYear(0)}
>
<p className="mb-0 text-center text-white text-xl">up 10 user</p>
</div>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
oneYear == 1 ? " " : "opacity-50"
} `}
onClick={() => setOneYear(1)}
>
<p className="mb-0 text-center text-white text-xl">up 25 user</p>
</div>
<div
className={`bg-[#132420] p-4 rounded-l-3xl mt-3 cursor-pointer tr03 ${
oneYear == 2 ? " " : "opacity-50"
} `}
onClick={() => setOneYear(2)}
>
<p className="mb-0 text-center text-white text-xl">up 50 user</p>
</div>
</div>
<div className="w-8/12 bg-[#132420] p-10 rounded-r-3xl rounded-bl-3xl">
<h2 className="mb-0 text-center font-bold text-[25px] text-gray-400">
12 Mounth
</h2>
<p className="mb-0 text-center text-white text-[33px] font-bold">
{oneYear == 0
? " 108,000,000 R"
: oneYear == 1
? " 172,800,000 R"
: oneYear == 2
? " 212,400,000 R"
: " 108,000,000 R"}{" "}
</p>
<p className="mb-0 text-center text-gray-400 text-sm">
It could be the best package for you, so feel free to use the
14-day free trial
</p>
<div className="flex justify-center mt-10">
<Link href="/app/login">
<button className=" btn btn-primary px-10 rounded-full py-2 xs:hidden lg:block">
Get started
</button>
</Link>
</div>
</div>
<p className="mb-0 text-[100px] font-bold text-white mt-10">390 </p>
</div>
</div>
</div>

View File

@ -861,10 +861,6 @@ const StepProduct = ({}) => {
</div>
</div>
</div>
<p className="mb-0 text-white text-center my-10 pb-8 font-bold lg:text-[100px] xs:text-[30px] lg:leading-[60px]">
Briz, Harmonious routine management
</p>
</div>
);
};

View File

@ -1,4 +1,4 @@
import React from "react";
import React, { useState } from "react";
import { Tilt } from "react-tilt";
import { motion } from "framer-motion";
@ -8,6 +8,8 @@ import { styles } from "src/style";
import { SectionWrapper } from "src/hoc";
import Image from "next/image";
import vector1 from "@img/Vector1.png";
import validateIranPhone from "plugins/IranPhoneRegex";
import { toast } from "react-toastify";
const ServiceCard = ({ index, title, icon }) => (
<Tilt className=" w-full mt-5">
@ -48,6 +50,24 @@ const ServiceCard = ({ index, title, icon }) => (
);
const StressTest = () => {
const [subscribe, setSubscribe] = useState(false);
const [subscribeNumber, setSubscribeNumber] = useState("");
const handleSubscribeNumber = () => {
if (
subscribeNumber &&
subscribeNumber.trim() !== "" &&
validateIranPhone(subscribeNumber.trim())
) {
setSubscribe(true);
} else {
toast.error(`contact number is not acceptable`, {
position: "bottom-right",
closeOnClick: true,
});
}
};
return (
<div className="xs:mt-20 ">
<motion.div variants={textVariant()}>
@ -67,16 +87,31 @@ const StressTest = () => {
</motion.p>
<motion.div variants={fadeIn("", "", 0.1, 1)}>
<div className="flex flex-col sm:flex-row mt-5 items-center sm:items-start">
<input
type="text"
className="form-control !w-full sm:!w-6/12 mb-4 sm:mb-0"
placeholder="Enter your email"
/>
<button className="btn btn-primary rounded-2xl sm:ml-3 w-full p-4 sm:w-auto">
Subscribe
</button>
</div>
{subscribe ? (
<div>
<h2
className={`text-white md:text-[20px] sm:text-[20px] xs:text-[18px] text-[30px] text-left mt-10`}
>
Thank you for your trust, we will contact you
</h2>
</div>
) : (
<div className="flex flex-col sm:flex-row mt-5 items-center sm:items-start">
<input
type="number"
className="form-control !w-full sm:!w-6/12 mb-4 sm:mb-0"
placeholder="Enter your number"
onChange={(e) => setSubscribeNumber(e.target.value)}
value={subscribeNumber}
/>
<button
className="btn btn-primary rounded-2xl sm:ml-3 w-full p-4 sm:w-auto"
onClick={() => handleSubscribeNumber(true)}
>
Subscribe
</button>
</div>
)}
</motion.div>
<div className="mt-10 xs:block lg:flex xs:justify-center lg:justify-start gap-5 sm:gap-10">

Binary file not shown.

Before

Width:  |  Height:  |  Size: 93 KiB

After

Width:  |  Height:  |  Size: 20 KiB

File diff suppressed because one or more lines are too long

View File

@ -16,7 +16,7 @@ const AboutUs = () => {
<AboutUsHero />
</div>
<div className="xs:px-[20px] lg:px-[120px] my-20">
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 font-thin">
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 ">
At Briz, we envision each coffee shop as a symphony, with every
element from the espresso shot to the customer service playing in
perfect harmony. Our journey began with the coming together of two
@ -26,10 +26,10 @@ const AboutUs = () => {
experience and passion for coffee shop excellence are the foundation
of Briz.
</p>
<h2 className="text-white font-semibold md:text-[20px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
<h2 className="text-white font-bold md:text-[30px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
Our Team's Heritage
</h2>
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 font-thin">
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 ">
Our team consists of six dedicated members, each bringing a unique
blend of expertise and innovation from our roots in 'Tuk Coffee' and
'Igarson.' We are baristas, managers, tech enthusiasts, and, above
@ -38,11 +38,11 @@ const AboutUs = () => {
commitment to making Briz the ace of your coffee shop orchestr
</p>
<h2 className="text-white font-semibold md:text-[20px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
<h2 className="text-white font-bold md:text-[30px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
Our Team's Heritage
</h2>
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 font-thin">
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 ">
We believe in the power of an efficiently managed coffee shop - where
every task, every role, and every shift contributes to the delightful
crescendo of customer satisfaction. Briz is not just an app; it's your
@ -52,11 +52,11 @@ const AboutUs = () => {
performing.
</p>
<h2 className="text-white font-semibold md:text-[20px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
<h2 className="text-white font-bold md:text-[30px] sm:text-[20px] xs:text-[20px] text-[18px] mt-4">
Our Commitment to Your Coffee Shop{" "}
</h2>
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 font-thin">
<p className="mb-0 sm:text-[20px] xs:text-[20px] lg:text-justify xs:text-left text-secondary tracking-wider text-gray-300 ">
Our mission is simple yet ambitious: to empower coffee shops to manage
their spaces with unprecedented efficiency and insight. Whether it's
the bustling rush of the morning crowd or the relaxed ambiance of late
@ -65,9 +65,9 @@ const AboutUs = () => {
run a coffee shop, and let's make every cup of coffee an experience to
remember.
</p>
<div className="flex justify-end my-10 ">
<div className="mt-3">
<Image src={tuk} className="w-[100px]" />
<div className="flex justify-center my-10 ">
<div className="">
<Image src={tuk} className="w-[50px]" />
</div>
<div>
<Image src={ig} className="w-[120px]" />

View File

@ -461,6 +461,11 @@ body {
background-image: url(../public/images/bg.png);
}
.bg-hero-pattern-footer {
background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
url(../public/images/bg.png);
}
.bg-dahs-chart {
background-image: radial-gradient(
circle,