Files
no-copy-frontend/src/app/ui/payment/payment-tab-tariffs.tsx
T
2025-12-01 17:36:20 +07:00

122 lines
4.0 KiB
TypeScript

export default function PaymentTabTariffs() {
return (
<div className="tab-content">
<div className="billing-toggle">
<div>
<button className="billing-btn active">💳 Помесячно</button>
<button className="billing-btn">
🔥 Годовая
<span>ВЫГОДНО</span>
</button>
</div>
</div>
<div className="subscription-grid">
<div className="plan-card animate-card">
<div className="plan-header">
<div className="plan-icon">🚀</div>
<h3 className="plan-name">СТАРТ</h3>
<div className="plan-price">900</div>
<div className="plan-period">в месяц</div>
<div className="plan-tokens">100 токенов включено</div>
</div>
<ul className="plan-features">
<li className="plan-feature">
<span className="feature-icon"></span>
100 файлов в месяц
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
1 ГБ хранилища
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
До 10 МБ на файл
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Базовые модули защиты
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Поддержка 24/7
</li>
<li className="plan-feature">
<span className="feature-icon not"></span>
API доступ
</li>
</ul>
</div>
<div className="plan-card animate-card">
<div className="plan-header">
<div className="plan-icon">🚀</div>
<h3 className="plan-name">ПРЕМИУМ</h3>
<div className="plan-price">3500</div>
<div className="plan-period">в месяц</div>
<div className="plan-tokens">100 токенов включено</div>
</div>
<ul className="plan-features">
<li className="plan-feature">
<span className="feature-icon"></span>
100 файлов в месяц
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
1 ГБ хранилища
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
До 10 МБ на файл
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Базовые модули защиты
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Поддержка 24/7
</li>
<li className="plan-feature">
<span className="feature-icon not"></span>
API доступ
</li>
</ul>
</div>
<div className="plan-card animate-card">
<div className="plan-header">
<div className="plan-icon">🚀</div>
<h3 className="plan-name">ПРОФИ</h3>
<div className="plan-price">9500</div>
<div className="plan-period">в месяц</div>
<div className="plan-tokens">100 токенов включено</div>
</div>
<ul className="plan-features">
<li className="plan-feature">
<span className="feature-icon"></span>
100 файлов в месяц
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
1 ГБ хранилища
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
До 10 МБ на файл
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Базовые модули защиты
</li>
<li className="plan-feature">
<span className="feature-icon"></span>
Поддержка 24/7
</li>
<li className="plan-feature">
<span className="feature-icon not"></span>
API доступ
</li>
</ul>
</div>
</div>
</div>
)
}