first commit

src/widgets/wallet-header/index.ts

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

src/widgets/wallet-header/ui/WalletHeader.module.css

@@ -0,0 +1,76 @@
+.nav {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 32px;
+  height: 60px;
+  border-bottom: 1px solid var(--glass-border);
+  flex-shrink: 0;
+}
+
+.logo img {
+  height: 32px;
+  display: block;
+}
+
+.ticker {
+  display: flex;
+  gap: 24px;
+  font-size: 13px;
+  font-family: var(--font-mono);
+}
+
+.tick {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: var(--text-secondary);
+}
+
+.tick b {
+  color: var(--text-primary);
+}
+
+.up {
+  color: var(--success);
+}
+
+.dn {
+  color: #ff4d4d;
+}
+
+.account {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+.avatar {
+  width: 34px;
+  height: 34px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #3d2a8e, #5b3db8);
+  flex-shrink: 0;
+}
+
+.account span {
+  color: var(--text-secondary);
+  font-size: 14px;
+  font-weight: 500;
+}
+
+@media (max-width: 900px) {
+  .nav {
+    padding: 0 16px;
+  }
+
+  .ticker {
+    gap: 16px;
+  }
+}
+
+@media (max-width: 768px) {
+  .ticker {
+    display: none;
+  }
+}

src/widgets/wallet-header/ui/WalletHeader.tsx

@@ -0,0 +1,35 @@
+import logo from '@shared/assets/logo-full-white.png'
+import styles from './WalletHeader.module.css'
+import { Link } from 'react-router-dom'
+import { ROUTES } from '@shared/config/routes'
+
+const TICKERS = [
+  { symbol: 'BTC', price: '$66,916.00', change: 0.12, },
+  { symbol: 'ETH', price: '$2,053.97', change: -0.12 },
+  { symbol: 'SOL', price: '$163.84', change: -1.57 },
+]
+
+export function WalletHeader() {
+  return (
+    <nav className={styles.nav}>
+      <a href="/" className={styles.logo}>
+        <img src={logo} alt="ЭКСА" />
+      </a>
+      <div className={styles.ticker}>
+        {TICKERS.map(({ symbol, price, change }) => (
+          <div key={symbol} className={styles.tick}>
+            <b>{symbol}</b>
+            <span>{price}</span>
+            <span className={change >= 0 ? styles.up : styles.dn}>
+              {change >= 0 ? '+' : ''}{change}%
+            </span>
+          </div>
+        ))}
+      </div>
+      <Link to={ROUTES.PROFILE} className={styles.account}>
+        <div className={styles.avatar} />
+        <span>Test account</span>
+      </Link>
+    </nav>
+  )
+}