From a31a322a9ef38f37e453f59107cbde31f78dbb5b Mon Sep 17 00:00:00 2001
From: Peterjah <ps@massa.net>
Date: Fri, 20 Dec 2024 11:53:53 +0100
Subject: [PATCH] add baseline

---
 front/src/components/ArrowButton.tsx  |  2 +-
 front/src/components/ScheduleForm.tsx |  2 +-
 front/src/pages/HomePage.tsx          | 18 +++++++++++++++---
 front/src/store/store.ts              |  5 ++++-
 front/vite.config.ts                  | 18 ++++++++++++------
 5 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/front/src/components/ArrowButton.tsx b/front/src/components/ArrowButton.tsx
index 423e27e..9de1e88 100644
--- a/front/src/components/ArrowButton.tsx
+++ b/front/src/components/ArrowButton.tsx
@@ -3,7 +3,7 @@ export function ArrowButton({ onClick }: { onClick: () => void }) {
     <button
       className="p-2 rounded-full bg-white hover:bg-gray-200 
                  text-primary hover:ring-1 ring-primary transition-all 
-                 duration-100 ease-in-out active:translate-y-1"
+                 duration-100 ease-in-out active:translate-y-1 my-2"
       onClick={onClick}
     >
       ↓
diff --git a/front/src/components/ScheduleForm.tsx b/front/src/components/ScheduleForm.tsx
index 9a821c1..d65e4ee 100644
--- a/front/src/components/ScheduleForm.tsx
+++ b/front/src/components/ScheduleForm.tsx
@@ -86,7 +86,7 @@ export function ScheduleForm() {
     }
   }
   return (
-    <section className="max-w-2xl w-full mx-auto rounded-2xl shadow-lg p-7 bg-white -mt-40">
+    <section className="max-w-2xl w-full mx-auto rounded-2xl shadow-lg p-7 bg-white">
       {renderError()}
       <Card customClass="bg-transparent grid grid-flow-row gap-4">
         <SelectMode
diff --git a/front/src/pages/HomePage.tsx b/front/src/pages/HomePage.tsx
index f3db7e2..20a92a2 100644
--- a/front/src/pages/HomePage.tsx
+++ b/front/src/pages/HomePage.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable max-len */
 import { useRef } from 'react';
 import { useSearchParams } from 'react-router-dom';
 import { ArrowButton } from '@/components/ArrowButton';
@@ -23,15 +24,26 @@ export default function HomePage() {
   };
 
   return (
-    <div className="">
-      <div className="main h-screen">
+    <div className="flex flex-col items-center">
+      <div className="main flex flex-col w-full">
         <NavBar />
+        <div className="p-6 bg-white text-center text-gray-800 bg-opacity-65 rounded-lg shadow-lg my-6 max-w-2xl mx-auto">
+          <p className="text-lg font-semibold">
+            Syntra is a cutting-edge dApp powered by Massa's autonomous smart
+            contracts, designed to simplify token scheduling like never before.
+          </p>
+          <p className="text-lg mt-2">
+            Whether you're tipping content creators or managing token vesting,
+            Syntra ensures seamless, automated transactions.
+          </p>
+        </div>
         <div className="flex flex-col justify-center items-center gap-10 h-full">
           <ScheduleForm />
           <ArrowButton onClick={scrollToList} />
         </div>
       </div>
-      <div ref={scheduleTableRef} className="h-screen  bg-white">
+
+      <div ref={scheduleTableRef} className="h-screen bg-white w-full my-6 ">
         <ScheduleTablesSection />
       </div>
     </div>
diff --git a/front/src/store/store.ts b/front/src/store/store.ts
index 43d3fdb..137404e 100644
--- a/front/src/store/store.ts
+++ b/front/src/store/store.ts
@@ -73,7 +73,10 @@ async function initPollEvent(connectedAccount: Provider) {
   setEventPollerStop(stopPolling);
 }
 
-function handleTransferEvents(data: rpcTypes.OutputEvents, schedules: Schedule[]) {
+function handleTransferEvents(
+  data: rpcTypes.OutputEvents,
+  schedules: Schedule[],
+) {
   const { refreshBalances } = useTokenStore.getState();
   const { tokens } = useTokenStore.getState();
 
diff --git a/front/vite.config.ts b/front/vite.config.ts
index 4676c6f..df46869 100644
--- a/front/vite.config.ts
+++ b/front/vite.config.ts
@@ -11,19 +11,25 @@ export default ({ mode }) => {
   process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };
 
   // see https://github.com/davidmyersdev/vite-plugin-node-polyfills/issues/81#issuecomment-2325104572
-  const nodePolyfillsFix = (options?: PolyfillOptions | undefined): PluginOption => {
+  const nodePolyfillsFix = (
+    options?: PolyfillOptions | undefined,
+  ): PluginOption => {
     return {
       ...nodePolyfills(options),
       resolveId(source: string) {
-        const m = /^vite-plugin-node-polyfills\/shims\/(buffer|global|process)$/.exec(source)
+        const m =
+          /^vite-plugin-node-polyfills\/shims\/(buffer|global|process)$/.exec(
+            source,
+          );
         if (m) {
-          return `node_modules/vite-plugin-node-polyfills/shims/${m[1]}/dist/index.cjs`
+          return `node_modules/vite-plugin-node-polyfills/shims/${m[1]}/dist/index.cjs`;
         }
-      }
-    }
-  }
+      },
+    };
+  };
 
   return defineConfig({
+    // eslint-disable-next-line new-cap
     plugins: [nodePolyfillsFix(), react(), ViteImageOptimizer(), visualizer()],
     server: {
       fs: {