fix(frontend) make main page

frontend/src/pages/Main.jsx

@@ -1,48 +1,36 @@
-import { useEffect, useState } from "react";
-import * as api from "../api"; // Импортируем все функции из api/index.js
 import PageLayout from "../components/PageLayout";
+import bgLayout from "../assets/Исходники/background.png";
+import Arrow from "../components/Arrow";
+
+import { useEffect, useState } from "react";
 
 export default function Dashboard() {
-  const [items, setItems] = useState([]);
+  const [isLoaded, setIsLoaded] = useState(false);
 
   useEffect(() => {
-    api
-      .getAllItems()
-      .then((res) => {
-        setItems(res.data);
-      })
-      .catch((err) => {
-        console.error("Ошибка при получении товара с сервера", err);
-      });
+    setIsLoaded(true);
   }, []);
-
   return (
     <PageLayout>
-      <main className="p-16 grow w-full gap-4">
-        {Array.isArray(items) &&
-          items.map((item) => (
-            <div
-              key={item.id}
-              className="bg-white flex flex-col justify-center items-start p-4 border border-slate-500 rounded-lg shadow-sm"
-            >
-              <div className="text-gray-500 text-xs">ID: ${item.id}</div>
-              <div className="text-xl font-black text-slate-800">
-                {item.name}
-              </div>
-              <div className="text-xl font-black text-slate-800">
-                {item.price}
-              </div>
-              <div className="text-xl font-black text-slate-800">
-                {item.name}
-              </div>
-              <div className="text-xl font-black text-slate-800">
-                {item.category}
-              </div>
-              <div className="text-xl font-black text-slate-800">
-                {item.unit}
-              </div>
+      <main
+        className="px-16 grow w-full gap-4 bg-cover bg-center bg-no-repeat h-screen overflow-hidden"
+        style={{ backgroundImage: `url(${bgLayout})` }}
+      >
+        <div className="mt-37.5 leading-[1.3] text-6xl font-bold text-white flex flex-col">
+          <div
+            className={`transition-all duration-1000 ease-out ${isLoaded
+                ? "translate-x-0 opacity-100"
+                : "-transition-x-full opacity-0"
+              }`}
+          >
+            <div>Свежие морепродукты</div>
+            <div>На любой вкус</div>
+            <div className="pl-10 py-6.5 font-normal text-2xl flex flex-row">
+              <div className="mr-10">Смотреть товары</div>
+              <Arrow link="/shop" />
             </div>
-          ))}
+          </div>
+        </div>
       </main>
     </PageLayout>
   );