diff --git a/src/app/[locale]/tariff-management/page.tsx b/src/app/[locale]/tariff-management/page.tsx new file mode 100644 index 0000000..c75c0f9 --- /dev/null +++ b/src/app/[locale]/tariff-management/page.tsx @@ -0,0 +1,78 @@ +export default function Page() { + return ( +
+
+

📋 Управление тарифными планами

+
+ +
+
+
+
+
+
+ FREE +
🆓
+
+
₽0
+
100 токенов
+
+ +
+
+ +
+
+ MINI (TELEGRAM) +
✈️
+
+
₽500
+
500 токенов
+
+ +
+
+ +
+
+ BASIC +
+
+
₽990
+
1,000 токенов
+
+ +
+
+ +
+
+ PRO +
💎
+
+
₽2,990
+
5,000 токенов
+
+ +
+
+ +
+
+ BUSINESS +
🏢
+
+
₽9,990
+
20,000 токенов
+
+ +
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/styles/global-styles.scss b/src/app/styles/global-styles.scss index ea7f918..8c738aa 100644 --- a/src/app/styles/global-styles.scss +++ b/src/app/styles/global-styles.scss @@ -87,7 +87,7 @@ .admin-panel { .admin-sidebar { - width: 280px; + width: var(--side-bar-width); background: var(--surface); border-right: 1px solid var(--border); position: fixed; @@ -321,6 +321,13 @@ overflow-x: auto; } + .stats-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); + gap: 20px; + margin-bottom: 24px; + } + .admin-table { width: 100%; border-collapse: collapse; @@ -732,4 +739,79 @@ } } } +} + +#plans-container { + .stats-grid { + .stat-card { + background: var(--surface); + padding: 20px; + border-radius: 12px; + box-shadow: var(--shadow); + transition: all 0.3s; + border: 1px solid var(--border); + + &:hover { + box-shadow: var(--shadow-lg); + transform: translateY(-2px); + } + + .stat-card-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 12px; + } + + .stat-card-title { + font-size: 13px; + color: var(--text-secondary); + font-weight: 500; + text-transform: uppercase; + letter-spacing: 0.5px; + } + + .stat-card-icon { + width: 40px; + height: 40px; + border-radius: 10px; + display: flex; + align-items: center; + justify-content: center; + font-size: 20px; + + background: #eff6ff; + } + + .stat-card-value { + font-size: 32px; + font-weight: 700; + color: var(--text-primary); + margin-bottom: 4px; + } + + .stat-card-label { + font-size: 12px; + color: var(--text-secondary); + } + + .stat-card-footer { + margin-top: 12px; + padding-top: 12px; + border-top: 1px solid var(--border); + font-size: 12px; + color: var(--text-secondary); + } + + .btn-outline { + background: transparent; + border: 1px solid var(--border); + color: var(--text-primary); + + &:hover { + background: var(--background); + } + } + } + } } \ No newline at end of file diff --git a/src/app/ui/admin-nav-links.tsx b/src/app/ui/admin-nav-links.tsx index a081a6b..9363917 100644 --- a/src/app/ui/admin-nav-links.tsx +++ b/src/app/ui/admin-nav-links.tsx @@ -24,6 +24,11 @@ export default function AdminNavLinks() { name: 'subscriptions', href: '/subscriptions', img: 'M22 6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2zm-2 2H4V6h16zM4 11h16v7H4z' + }, + { + name: 'tariff management', + href: '/tariff-management', + img: 'M4 14v-2h7v2zm0-4V8h11v2zm0-4V4h11v2zm9 14v-3.075l5.525-5.5q.225-.225.5-.325t.55-.1q.3 0 .575.113t.5.337l.925.925q.2.225.313.5t.112.55t-.1.563t-.325.512l-5.5 5.5zm6.575-5.6l.925-.975l-.925-.925l-.95.95z' } ]; diff --git a/tailwind.config.ts b/tailwind.config.ts new file mode 100644 index 0000000..17dde9e --- /dev/null +++ b/tailwind.config.ts @@ -0,0 +1,10 @@ +import type { Config } from 'tailwindcss'; + +const config: Config = { + content: [ + './pages/**/*.{js,ts,jsx,tsx,mdx}', + './components/**/*.{js,ts,jsx,tsx,mdx}', + './app/**/*.{js,ts,jsx,tsx,mdx}', + ], +}; +export default config;