pages

src/pages/editor/components/LayersPanel.tsx

@@ -135,7 +135,7 @@ const LayersPanel = ({ isOpen, setIsOpen }: LayersPanelProps) => {
           {activeTab === 'pages' ? (
             <>
               <div className="flex-1 overflow-y-auto p-4">
-                <div className="flex flex-col gap-3">
+                <div className="flex flex-col gap-3 items-center">
                   {pages.length === 0 ? (
                     <div className="text-sm text-gray-500 text-center py-8">
                       صفحه‌ای وجود ندارد
@@ -148,16 +148,17 @@ const LayersPanel = ({ isOpen, setIsOpen }: LayersPanelProps) => {
                           key={page.id}
                           onClick={() => setCurrentPage(page.id)}
                           className={clx(
-                            'flex flex-col gap-2 p-3 rounded-lg cursor-pointer transition-colors',
+                            'flex flex-col gap-2 cursor-pointer transition-colors',
-                            isSelected
+                            isSelected && ' rounded-lg p-0.5'
-                              ? 'bg-blue-50 border border-blue-200'
-                              : 'bg-gray-50 hover:bg-gray-100'
                           )}
                         >
-                          <div className="w-full aspect-4/3 bg-gray-100 rounded-lg flex items-center justify-center">
+                          <div className={clx(
-                            <DocumentText size={32} color="#666" />
+                            "w-[72px] h-[94px] bg-[#EEF0F7] rounded-lg flex items-center justify-center",
+                            isSelected && 'border border-black'
+                          )}>
+                            <DocumentText size={20} color="#000" variant="Outline" />
                           </div>
-                          <div className="text-sm font-medium text-center">
+                          <div className="text-xs font-medium text-center text-black">
                             {page.name}
                           </div>
                         </div>

src/pages/editor/components/ZoomControls.tsx

@@ -53,7 +53,7 @@ const ZoomControls = () => {
   }, [isDragging, handleMouseMove, handleMouseUp]);
 
   return (
-    <div className="fixed left-8 bottom-0 -translate-y-1/2 bg-white/30 rounded-full px-4 py-2.5 shadow-lg flex items-center gap-3 z-50">
+    <div className="fixed right-8 top-24 bg-white rounded-full px-4 py-2.5 shadow-lg flex items-center gap-3 z-50">
       <button
         className="w-8 h-8 flex items-center justify-center rounded-full hover:bg-gray-100 transition-colors"
         title="نمایش گرید"