Implemented pricing page
This commit is contained in:
@@ -35,16 +35,19 @@ const PricingCard: React.FC<PricingCardProps> = ({
|
||||
return (
|
||||
<div className={`flex flex-col ${cardBg} border ${cardBorder} rounded-xl ${cardShadow} overflow-hidden transition-all duration-300 transform hover:scale-105`}>
|
||||
{isPopular && (
|
||||
<div className={`${cardPopular} text-white text-xs font-semibold px-3 py-1.5 rounded-t-xl`}>
|
||||
<div className={`${cardPopular} px-3 py-1.5 text-center text-white text-xs font-semibold rounded-t-xl`}>
|
||||
Most Popular
|
||||
</div>
|
||||
)}
|
||||
{!isPopular && (
|
||||
<div className="py-3.5"></div>
|
||||
)}
|
||||
<div className="p-6">
|
||||
<h3 className={`text-2xl font-bold ${cardText}`}>{title}</h3>
|
||||
<p className="mt-4 text-sm text-gray-400">
|
||||
{title === 'Start' && 'The perfect starting place for your web app or personal project.'}
|
||||
{title === 'Pro' && 'Everything you need to build and scale your app.'}
|
||||
{title === 'Premium' && 'Critical security, performance, observability, platform SLAs, and support.'}
|
||||
{title === 'Basic' && 'Perfect for food bloggers and home cooks looking to enhance their culinary photography.'}
|
||||
{title === 'Pro' && 'Everything you need to showcase restaurant dishes professionally and attract more customers.'}
|
||||
{title === 'MasterChef' && 'Complete professional suite for food photographers and culinary brands demanding perfection.'}
|
||||
</p>
|
||||
<p className="mt-8">
|
||||
<span className="text-5xl font-extrabold">{price}</span>
|
||||
|
||||
Reference in New Issue
Block a user