Новый стиль

client-web/src/modules/chats/presentation/ChatPage.tsx

@@ -9,6 +9,7 @@ import { useLang } from '../../../core/infrastructure/i18n';
 import type { Message, UserBasic, CallInfo, ChatMember } from '../../../core/domain/types';
 import { Send, Check, Phone, PhoneOff } from 'lucide-react';
 import Sidebar from '../../../core/presentation/layouts/Sidebar';
+import GlobalNavBar from '../../../core/presentation/layouts/GlobalNavBar';
 import ChatView from './components/ChatView';
 import CallModal from '../../calls/presentation/components/CallModal';
 import GroupCallModal from '../../calls/presentation/components/GroupCallModal';
@@ -362,14 +363,25 @@ export default function ChatPage() {
       initial={{ opacity: 0 }}
       animate={{ opacity: 1 }}
       exit={{ opacity: 0 }}
-      className="h-full flex bg-surface sm:p-3 sm:gap-3 overflow-hidden"
+      className="h-screen w-screen flex bg-surface-dim overflow-hidden antialiased font-body selection:bg-primary/30"
     >
-      <div className={`${activeChat ? 'hidden sm:block' : 'block'} w-full sm:w-[340px] flex-shrink-0`}>
-        <Sidebar />
-      </div>
-      <div className={`${activeChat ? 'block' : 'hidden sm:block'} flex-1 h-full min-w-0`}>
-        <ChatView onStartCall={handleStartCall} onStartGroupCall={handleStartGroupCall} />
-      </div>
+      <GlobalNavBar activeTab="chats" onTabChange={() => {}} />
+
+      <main className="ml-20 flex-1 flex flex-row relative h-full">
+        {/* Chat List (Sidebar) */}
+        <div 
+          className={`${activeChat ? 'hidden lg:block' : 'block'} w-full lg:w-[360px] flex-shrink-0 bg-surface-container-low tonal-transition-no-border h-full`}
+        >
+          <Sidebar />
+        </div>
+
+        {/* Selected Chat View (Main Area) */}
+        <div 
+          className={`${activeChat ? 'block' : 'hidden lg:block'} flex-1 h-full min-w-0 bg-surface-container-lowest m-4 rounded-3xl overflow-hidden relative group slide-on-ice`}
+        >
+          <ChatView onStartCall={handleStartCall} onStartGroupCall={handleStartGroupCall} />
+        </div>
+      </main>
       <CallModal
         key={callSessionId}
         isOpen={callOpen}