From 3263645c3bc29b518b5ebad6eee30e1348ad2a29 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=A5=D0=B0=D0=BB=D0=B8=D0=BC=D0=BE=D0=B2=20=D0=A0=D1=83?=
 =?UTF-8?q?=D1=81=D1=82=D0=B0=D0=BC?= <rhalimov@elveesneotek.com>
Date: Sat, 27 Dec 2025 20:02:20 +0300
Subject: [PATCH] Fix

---
 src/components/PreviewStep.tsx | 37 +++++++++++++++++++---------------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/src/components/PreviewStep.tsx b/src/components/PreviewStep.tsx
index 0193735..132e489 100644
--- a/src/components/PreviewStep.tsx
+++ b/src/components/PreviewStep.tsx
@@ -140,32 +140,37 @@ export const PreviewStep: React.FC<Props> = ({ parts, config, splits }) => {
 
   return (
     <div className="flex flex-col h-full">
-      {/* Верхняя панель */}
-      <div className="flex flex-col md:flex-row justify-between items-center bg-slate-800/80 p-4 rounded-xl border border-slate-700 mb-4 gap-4 backdrop-blur-sm shadow-lg">
+      {/* Верхняя панель: Размеры + Поделиться */}
+      <div className="flex flex-col xl:flex-row justify-between items-center bg-slate-800/80 p-4 rounded-xl border border-slate-700 mb-4 gap-4 backdrop-blur-sm shadow-lg">
           
-          <div className="flex items-center gap-6">
-              <div className="flex items-center gap-2 text-gray-300">
+          <div className="flex flex-wrap items-center gap-6 justify-center md:justify-start">
+              <div className="hidden md:flex items-center gap-2 text-gray-300 mr-2">
                   <Ruler className="text-primary" size={20} />
                   <span className="font-medium text-sm uppercase tracking-wide opacity-70">Размеры ящика:</span>
               </div>
-              <div className="flex gap-4 font-mono text-lg font-bold text-white">
-                  <div className="flex items-center gap-1">
-                      <span className="text-slate-500 text-xs">Ш:</span> {config.drawer.width}
+              
+              {/* --- ОБНОВЛЕННЫЙ БЛОК РАЗМЕРОВ --- */}
+              <div className="flex flex-wrap gap-6 font-mono text-white items-baseline">
+                  <div className="flex items-baseline gap-2">
+                      <span className="text-slate-500 text-sm font-bold uppercase tracking-wider">Ширина:</span>
+                      <span className="text-2xl font-bold text-white drop-shadow-sm">{config.drawer.width}</span>
                   </div>
-                  <div className="flex items-center gap-1">
-                      <span className="text-slate-500 text-xs">Г:</span> {config.drawer.depth}
+                  <div className="flex items-baseline gap-2">
+                      <span className="text-slate-500 text-sm font-bold uppercase tracking-wider">Глубина:</span>
+                      <span className="text-2xl font-bold text-white drop-shadow-sm">{config.drawer.depth}</span>
                   </div>
-                  <div className="flex items-center gap-1">
-                      <span className="text-slate-500 text-xs">В:</span> {config.drawer.height}
+                  <div className="flex items-baseline gap-2">
+                      <span className="text-slate-500 text-sm font-bold uppercase tracking-wider">Высота:</span>
+                      <span className="text-2xl font-bold text-white drop-shadow-sm">{config.drawer.height}</span>
                   </div>
-                  <span className="text-xs text-slate-500 self-end mb-1">мм</span>
+                  <span className="text-sm text-slate-500 font-bold self-baseline">мм</span>
               </div>
           </div>
 
           <button
               onClick={handleShare}
               className={`
-                  flex items-center gap-2 px-6 py-2 rounded-lg text-sm font-bold transition-all border shadow-md active:scale-95
+                  flex items-center gap-2 px-6 py-3 rounded-lg text-sm font-bold transition-all border shadow-md active:scale-95 shrink-0
                   ${shareUrlCopied 
                       ? 'bg-green-600 border-green-500 text-white shadow-green-900/20' 
                       : 'bg-blue-600 hover:bg-blue-500 border-blue-500 text-white shadow-blue-900/20'
@@ -173,7 +178,7 @@ export const PreviewStep: React.FC<Props> = ({ parts, config, splits }) => {
               `}
           >
               {shareUrlCopied ? <Check size={18} /> : <Share2 size={18} />}
-              {shareUrlCopied ? 'СКОПИРОВАНО!' : 'Поделиться проектом'}
+              {shareUrlCopied ? 'СКОПИРОВАНО!' : 'Поделиться'}
           </button>
       </div>
 
@@ -197,8 +202,8 @@ export const PreviewStep: React.FC<Props> = ({ parts, config, splits }) => {
             camera={{ 
                 position: [config.drawer.width * 1.5, config.drawer.height * 3, config.drawer.depth * 1.5], 
                 fov: 45,
-                near: 1,      // Исправлено: не режем вблизи
-                far: 20000    // Исправлено: видим очень далеко (для больших размеров в мм)
+                near: 1,      
+                far: 20000    
             }}
           >
             <Suspense fallback={null}>