frontdev/no-copy-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add payments page layouts

Browse Source
This commit is contained in:
smanylov
2025-12-01 17:36:20 +07:00
parent 2ef5e171b1
commit d89cc35fca
16 changed files with 693 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/ui/payment/payment-tab-tariffs.tsx
+122
View File
@@ -0,0 +1,122 @@
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>
)
}