first commit

This commit is contained in:
CHIEFSOFT\ameye
2025-02-12 23:25:43 -05:00
commit d8c7ec4866
1400 changed files with 90826 additions and 0 deletions
@@ -0,0 +1,32 @@
'use client'
import React from "react";
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
import PricingMonthly from "./PricingMonthly";
import PricingYearly from "./PricingYearly";
const Pricing = () => {
return (
<div>
<Tabs>
<TabList className="nav nav-tabs justify-content-center pricing-nav-three">
<Tab>Monthly</Tab>
<Tab>Yearly</Tab>
</TabList>
<div className="pricing-table-area-four">
<TabPanel>
<PricingMonthly />
</TabPanel>
{/* End Pricing Month */}
<TabPanel>
<PricingYearly />
</TabPanel>
{/* End Pricing Year */}
</div>
</Tabs>
</div>
);
};
export default Pricing;
@@ -0,0 +1,105 @@
import React from "react";
const PricingContent = [
{
packName: "Single",
packDetails: "For individuals and teams",
bgColor: "#FFF7EB",
price: "8",
durationNumber: "Per editor, monthly",
facility: "with unlimited email",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "",
activeClass: "",
},
{
packName: "Team",
packDetails: "For individuals and teams",
bgColor: "#E2F2FD",
price: "12",
durationNumber: "For team, monthly",
facility: "team with 8 users",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "100",
activeClass: "active most-popular",
},
{
packName: "Business",
packDetails: "For individuals and teams",
bgColor: "#FFEBEB",
price: "37",
durationNumber: "All users, monthly",
facility: "for unlimited users",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "200",
activeClass: "",
},
];
const PricingMonthly = () => {
return (
<div className="row justify-content-center">
{PricingContent.map((val, i) => (
<div
className="col-lg-4 col-sm-6"
data-aos="fade-up"
data-aos-duration="1200"
data-aos-delay={val.animationDelay}
key={i}
>
<div className={`pr-table-wrapper ${val.activeClass}`}>
<div className="pack-name">{val.packName}</div>
<div className="pack-details">{val.packDetails}</div>
<div
className="top-banner d-md-flex"
style={{ background: val.bgColor }}
>
<div className="price">
<sup>$</sup>
{val.price}
</div>
<div>
<span>{val.durationNumber}</span>
<em>{val.facility}</em>
</div>
</div>
{/* /.top-banner */}
<ul className="pr-feature">
{val.features.map((list, i) => (
<li key={i}>{list}</li>
))}
</ul>
<a href="#" className="trial-button">
Start 30 days free trial
</a>
<div className="trial-text">No card required, cancel any time</div>
</div>
{/* /.pr-table-wrapper */}
</div>
))}
</div>
);
};
export default PricingMonthly;
@@ -0,0 +1,105 @@
import React from "react";
const PricingContent = [
{
packName: "Single",
packDetails: "For individuals and teams",
bgColor: "#FFF7EB",
price: "90",
durationNumber: "Per editor, yearly",
facility: "with unlimited email",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "",
activeClass: "",
},
{
packName: "Team",
packDetails: "For individuals and teams",
bgColor: "#E2F2FD",
price: "125",
durationNumber: "For team, yearly",
facility: "team with 8 users",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "100",
activeClass: "active most-popular",
},
{
packName: "Business",
packDetails: "For individuals and teams",
bgColor: "#FFEBEB",
price: "370",
durationNumber: "All users, yearly",
facility: "for unlimited users",
features: [
"Unlimited Email",
"5gb Hosting",
"2 website 3 sub domain",
"Email & Live chat",
"Backling",
"Discount Programe",
],
animationDelay: "200",
activeClass: "",
},
];
const PricingYearly = () => {
return (
<div className="row justify-content-center">
{PricingContent.map((val, i) => (
<div
className="col-lg-4 col-sm-6"
data-aos="fade-up"
data-aos-duration="1200"
data-aos-delay={val.animationDelay}
key={i}
>
<div className={`pr-table-wrapper ${val.activeClass}`}>
<div className="pack-name">{val.packName}</div>
<div className="pack-details">{val.packDetails}</div>
<div
className="top-banner d-md-flex"
style={{ background: val.bgColor }}
>
<div className="price">
<sup>$</sup>
{val.price}
</div>
<div>
<span>{val.durationNumber}</span>
<em>{val.facility}</em>
</div>
</div>
{/* /.top-banner */}
<ul className="pr-feature">
{val.features.map((list, i) => (
<li key={i}>{list}</li>
))}
</ul>
<a href="#" className="trial-button">
Start 30 days free trial
</a>
<div className="trial-text">No card required, cancel any time</div>
</div>
{/* /.pr-table-wrapper */}
</div>
))}
</div>
);
};
export default PricingYearly;