change home page

src/components/Layuot.js

@@ -5,7 +5,7 @@ import { Suspense } from 'react';
 
 export const Layout = () => {
   return (
-    <div style={{ maxWidth: 960, margin: '0 auto', padding: '0 16px' }}>
+    <div style={{ margin: '0 auto', padding: '0 16px' }}>
       <AppBar />
       <Suspense fallback={null}>
         <Outlet />

src/pages/Home.js

@@ -1,14 +1,38 @@
-import { Circle } from "components/Circle/Circle";
 import css from './Home.module.css'
 
 
-export default function Home() {
+/*export default function Home() {
   return (
     <div className={css.container}>
       <h1 className={css.title}>
-        Welcome phonebook  
+        Welcome to phonebook  
+      </h1>
+      <p className={css.homeText}>
+        In this app, you can store your phone contacts in a format that suits you best. You also have the option to edit, delete, and filter. Enjoy using it.
+      </p>
+    </div>
+  );
+}*/
+
+
+export default function Home() {
+  return (<>
+
+  <div>
+     <div className={css.wave}></div>
+     <div className={css.wave}></div>
+     <div className={css.wave}></div>
+  </div>
+    <div className={css.container}>
+      <h1 className={css.title}>
+        Welcome to phonebook  
       </h1>
-      <Circle/>
+      <p className={css.homeText}>
+        In this app, you can store your phone contacts in a format that suits you best. You also have the option to edit, delete, and filter. Enjoy using it.
+      </p>
     </div>
+
+  </>
+
   );
 }