14.05.2026 rip

src/pages/bridge/index.ts

@@ -0,0 +1 @@
+export { BridgePage } from './ui/BridgePage'

src/pages/bridge/ui/BridgePage.module.css

@@ -0,0 +1,52 @@
+.page {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    background: var(--bg-deep);
+}
+
+.tabs {
+    display: flex;
+    gap: 8px;
+    padding: 24px 28px 0;
+}
+
+.tab {
+    padding: 10px 24px;
+    border-radius: 10px;
+    font-size: 14px;
+    font-weight: 700;
+    cursor: pointer;
+    border: none;
+    font-family: var(--font-sans);
+    letter-spacing: 0.5px;
+    transition: all 0.2s;
+}
+
+.active {
+    background: linear-gradient(135deg, var(--grad-edge), var(--grad-center));
+    color: var(--text-primary);
+}
+
+.inactive {
+    background: rgba(255, 255, 255, 0.06);
+    color: var(--text-secondary);
+}
+
+.inactive:hover {
+    color: var(--text-primary);
+}
+
+.main {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 32px 20px 48px;
+}
+
+@media (max-width: 650px) {
+    .main {
+        padding: 32px 20px;
+    }
+}

src/pages/bridge/ui/BridgePage.tsx

@@ -0,0 +1,37 @@
+import { useNavigate } from 'react-router-dom'
+import { Footer } from '@widgets/footer'
+import { BridgeForm } from '@widgets/bridge-form'
+import { WalletHeader } from '@widgets/wallet-header'
+import { ROUTES } from '@shared/config/routes'
+import styles from './BridgePage.module.css'
+
+export function BridgePage() {
+  const navigate = useNavigate()
+
+  return (
+    <div className={styles.page}>
+      <WalletHeader />
+
+      <div className={styles.tabs}>
+        <button
+          className={`${styles.tab} ${styles.inactive}`}
+          onClick={() => navigate(ROUTES.SWAP)}
+        >
+          СВОП
+        </button>
+        <button
+          className={`${styles.tab} ${styles.active}`}
+          onClick={() => navigate(ROUTES.BRIDGE)}
+        >
+          БРИДЖ
+        </button>
+      </div>
+
+      <main className={styles.main}>
+        <BridgeForm />
+      </main>
+
+      <Footer />
+    </div>
+  )
+}

src/pages/swap/ui/SwapPage.tsx

@@ -1,13 +1,12 @@
-import { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
 import { Footer } from '@widgets/footer'
 import { SwapForm } from '@widgets/swap-form'
 import { WalletHeader } from '@widgets/wallet-header'
+import { ROUTES } from '@shared/config/routes'
 import styles from './SwapPage.module.css'
 
-type Tab = 'swap' | 'bridge'
-
 export function SwapPage() {
-  const [tab, setTab] = useState<Tab>('swap')
+  const navigate = useNavigate()
 
   return (
     <div className={styles.page}>
@@ -15,14 +14,14 @@ export function SwapPage() {
 
       <div className={styles.tabs}>
         <button
-          className={`${styles.tab} ${tab === 'swap' ? styles.active : styles.inactive}`}
-          onClick={() => setTab('swap')}
+          className={`${styles.tab} ${styles.active}`}
+          onClick={() => navigate(ROUTES.SWAP)}
         >
           СВОП
         </button>
         <button
-          className={`${styles.tab} ${tab === 'bridge' ? styles.active : styles.inactive}`}
-          onClick={() => setTab('bridge')}
+          className={`${styles.tab} ${styles.inactive}`}
+          onClick={() => navigate(ROUTES.BRIDGE)}
         >
           БРИДЖ
         </button>