Merge branch 'main' of https://git.vnfco.ir/Brizco/web
commit
5febf40ef7
|
@ -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()}
|
||||
>
|
||||
|
|
|
@ -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]);
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -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
|
@ -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]" />
|
||||
|
|
|
@ -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,
|
||||
|
|
Loading…
Reference in New Issue