reza added two page

src/assets/images/test-result.svg

@@ -0,0 +1,129 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1375" height="915" viewBox="0 0 1375 915">
+  <defs>
+    <filter id="Rectangle_477" x="0" y="0" width="1375" height="915" filterUnits="userSpaceOnUse">
+      <feOffset input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="18.5" result="blur"/>
+      <feFlood flood-opacity="0.09"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+  </defs>
+  <g id="Group_1763" data-name="Group 1763" transform="translate(-292.5 -93.5)">
+    <g id="Group_1762" data-name="Group 1762" transform="translate(-22 16)">
+      <g id="Group_1761" data-name="Group 1761">
+        <g transform="matrix(1, 0, 0, 1, 314.5, 77.5)" filter="url(#Rectangle_477)">
+          <rect id="Rectangle_477-2" data-name="Rectangle 477" width="1264" height="804" rx="8" transform="translate(55.5 55.5)" fill="#fff"/>
+        </g>
+      </g>
+    </g>
+    <line id="Line_162" data-name="Line 162" y2="45" transform="translate(929 149)" fill="none" stroke="#e0e0e0" stroke-linecap="round" stroke-width="1"/>
+    <text id="دانوین_یادگیری_هوشمند_دروس" data-name="دانوین یادگیری هوشمند دروس" transform="translate(417 177)" fill="#707070" font-size="15" font-family="IRANSansX-Light, IRANSansX" font-weight="300"><tspan x="0" y="0">دانوین یادگیری هوشمند دروس</tspan></text>
+    <text id="فروشگاه_کتاب_های_فیزیکی_دانوین" data-name="فروشگاه کتاب‌های فیزیکی دانوین" transform="translate(675.886 176.5)" fill="#707070" font-size="15" font-family="IRANSansX-Light, IRANSansX" font-weight="300"><tspan x="0" y="0">فروشگاه کتاب‌های فیزیکی دانوین</tspan></text>
+    <g id="vuesax_linear_clipboard-close" data-name="vuesax/linear/clipboard-close" transform="translate(370 -96.896)">
+      <g id="clipboard-close" transform="translate(246 264.2)">
+        <path id="Vector" d="M10.29,10.29,0,0" transform="translate(0.104)" fill="none" stroke="#9b9494" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Vector-2" data-name="Vector" d="M10.29,0,0,10.29" transform="translate(0 0.104)" fill="none" stroke="#9b9494" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+      </g>
+    </g>
+    <g id="vuesax_linear_clipboard-close-2" data-name="vuesax/linear/clipboard-close" transform="translate(642.772 -95.12)">
+      <g id="clipboard-close-2" data-name="clipboard-close" transform="translate(246 264.2)">
+        <path id="Vector-3" data-name="Vector" d="M10.29,10.29,0,0" transform="translate(0.104)" fill="none" stroke="#9b9494" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Vector-4" data-name="Vector" d="M10.29,0,0,10.29" transform="translate(0 0.104)" fill="none" stroke="#9b9494" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+      </g>
+    </g>
+    <g id="Group_340" data-name="Group 340" transform="translate(1590.204 154.83)">
+      <rect id="Rectangle_478" data-name="Rectangle 478" width="27" height="27" rx="5" transform="translate(-0.204 0.17)" fill="#f7f7f7"/>
+      <g id="vuesax_linear_clipboard-close-3" data-name="vuesax/linear/clipboard-close" transform="translate(8.091 8.091)">
+        <g id="clipboard-close-3" data-name="clipboard-close">
+          <path id="Vector-5" data-name="Vector" d="M10.508,10.508,0,0" transform="translate(0.106)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+          <path id="Vector-6" data-name="Vector" d="M10.508,0,0,10.508" transform="translate(0 0.106)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+        </g>
+      </g>
+    </g>
+    <rect id="Rectangle_482" data-name="Rectangle 482" width="1264" height="64" transform="translate(370 199)" fill="#f7f7f7"/>
+    <g id="Group_337" data-name="Group 337" transform="translate(-129 -101)">
+      <rect id="Rectangle_479" data-name="Rectangle 479" width="985" height="40" rx="4" transform="translate(708 312)" fill="#e4e4e4"/>
+      <text id="Https:_Azmoon.danovin.ir" data-name="Https://Azmoon.danovin.ir" transform="translate(760 339)" fill="#707070" font-size="18" font-family="IRANSansX-Light, IRANSansX" font-weight="300"><tspan x="0" y="0">Https://Azmoon.danovin.ir</tspan></text>
+      <g id="vuesax_linear_lock" data-name="vuesax/linear/lock" transform="translate(726 320.827)">
+        <g id="lock" transform="translate(3)">
+          <path id="Vector-7" data-name="Vector" d="M0,7.449V5.587C0,2.5.931,0,5.587,0s5.587,2.5,5.587,5.587V7.449" transform="translate(3.712 1.862)" fill="none" stroke="#35c611" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+          <path id="Vector-8" data-name="Vector" d="M4.656,2.328A2.328,2.328,0,1,1,2.328,0,2.328,2.328,0,0,1,4.656,2.328Z" transform="translate(6.971 12.57)" fill="none" stroke="#35c611" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+          <path id="Vector-9" data-name="Vector" d="M11.154,11.173H3.718C.744,11.173,0,10.242,0,6.518V4.656C0,.931.744,0,3.718,0h7.436c2.975,0,3.718.931,3.718,4.656V6.518C14.873,10.242,14.129,11.173,11.154,11.173Z" transform="translate(1.862 9.311)" fill="none" stroke="#35c611" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+          <path id="Vector-10" data-name="Vector" d="M0,0H18.6V22.346H0Z" transform="translate(18.597 22.346) rotate(180)" fill="none" opacity="0"/>
+        </g>
+      </g>
+    </g>
+    <g id="vuesax_linear_arrow-left" data-name="vuesax/linear/arrow-left" transform="translate(402.7 217.511)">
+      <g id="arrow-left" transform="translate(0 0)">
+        <path id="Vector-11" data-name="Vector" d="M8.392,0,0,8.392l8.392,8.392" transform="translate(4.839 8.199)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-12" data-name="Vector" d="M23.269,0H0" transform="translate(5.074 16.591)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-13" data-name="Vector" d="M0,0H33.182V33.181H0Z" transform="translate(33.182 33.181) rotate(180)" fill="none" opacity="0"/>
+      </g>
+    </g>
+    <g id="vuesax_linear_arrow-right" data-name="vuesax/linear/arrow-right" transform="translate(455.116 217.818)">
+      <g id="arrow-right" transform="translate(0 0)">
+        <path id="Vector-14" data-name="Vector" d="M0,0,8.392,8.392,0,16.784" transform="translate(19.95 8.199)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-15" data-name="Vector" d="M0,0H23.269" transform="translate(4.839 16.591)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-16" data-name="Vector" d="M0,0H33.182V33.181H0Z" transform="translate(33.182 33.181) rotate(180)" fill="none" opacity="0"/>
+      </g>
+    </g>
+    <g id="vuesax_linear_rotate-right" data-name="vuesax/linear/rotate-right" transform="translate(519.684 219.355)">
+      <g id="rotate-right" transform="translate(-1.537 -1.537)">
+        <path id="Vector-17" data-name="Vector" d="M14.764.549A12.8,12.8,0,0,0,11.073,0a11.082,11.082,0,1,0,9.208,4.93" transform="translate(4.253 5.939)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-18" data-name="Vector" d="M3.691,4.24,0,0" transform="translate(16.909 2.554)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-19" data-name="Vector" d="M4.3,0,0,3.142" transform="translate(16.296 6.794)" fill="none" stroke="#707070" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-20" data-name="Vector" d="M0,0H30.651V30.651H0Z" transform="translate(30.651 30.651) rotate(180)" fill="none" opacity="0"/>
+      </g>
+    </g>
+    <text id="_" data-name="+" transform="translate(949 181)" fill="#707070" font-size="29" font-family="IRANSansX-UltraLight, IRANSansX" font-weight="100"><tspan x="0" y="0">+</tspan></text>
+    <g id="Group_338" data-name="Group 338" transform="translate(1516 147.272)">
+      <rect id="Rectangle_481" data-name="Rectangle 481" width="27" height="27" rx="5" transform="translate(0 8.728)" fill="#e8e8e8" opacity="0.37"/>
+      <text id="_2" data-name="_" transform="translate(9 21.728)" fill="#707070" font-size="22" font-family="IRANSansX-Thin, IRANSansX" font-weight="200"><tspan x="0" y="0">_</tspan></text>
+    </g>
+    <g id="Group_339" data-name="Group 339" transform="translate(1553.102 154.83)">
+      <rect id="Rectangle_480" data-name="Rectangle 480" width="27" height="27" rx="5" transform="translate(-0.102 0.17)" fill="#e8e8e8" opacity="0.37"/>
+      <g id="Rectangle_484" data-name="Rectangle 484" transform="translate(7.898 7.17)" fill="#f7f7f7" stroke="#707070" stroke-linecap="round" stroke-width="0.5">
+        <rect width="13" height="11" rx="1" stroke="none"/>
+        <rect x="0.25" y="0.25" width="12.5" height="10.5" rx="0.75" fill="none"/>
+      </g>
+      <g id="Rectangle_483" data-name="Rectangle 483" transform="translate(5.898 9.17)" fill="#f7f7f7" stroke="#707070" stroke-linecap="round" stroke-width="0.5">
+        <rect width="13" height="11" rx="1" stroke="none"/>
+        <rect x="0.25" y="0.25" width="12.5" height="10.5" rx="0.75" fill="none"/>
+      </g>
+    </g>
+    <rect id="Rectangle_704" data-name="Rectangle 704" width="1267" height="739" transform="translate(367 257)" fill="#fff"/>
+    <rect id="Rectangle_709" data-name="Rectangle 709" width="505.652" height="307.703" rx="5" transform="translate(755.886 542.115)" fill="#196ec0"/>
+    <text id="علیرضا_عزیز_متاسفانه_شما_نمره_قبولی_لازم_جهت_شرکت_در_قرعه_کشی_را_پیدا_نکردید_" data-name="علیرضا عزیز
+متاسفانه شما نمره قبولی لازم جهت شرکت در قرعه کشی را پیدا نکردید
+" transform="translate(1190.212 586.305)" fill="#fff" font-size="15" font-family="IRANSansX-Regular, IRANSansX"><tspan x="-69" y="0"></tspan><tspan y="0">علیرضا عزیز</tspan><tspan x="-420.21" y="23"></tspan><tspan y="23">متاسفانه شما نمره قبولی لازم جهت شرکت در قرعه کشی را پیدا نکردید</tspan><tspan x="0" y="46"></tspan></text>
+    <text id="حدنصاب_قبولی_در_آزمون_کسب_25_سوال_صحیح_می_باشد" data-name="حدنصاب قبولی در آزمون کسب 25 سوال صحیح می باشد" transform="translate(1180.212 782.305)" fill="#fff" font-size="15" font-family="IRANSansX-Light, IRANSansX" font-weight="300"><tspan x="-342.51" y="0" xml:space="preserve"> می باشد</tspan><tspan y="0" xml:space="preserve" font-family="IRANSansX-DemiBold, IRANSansX"> سوال صحیح</tspan><tspan y="0" font-family="IRANSansX-DemiBold, IRANSansX">25</tspan><tspan y="0">حدنصاب قبولی در آزمون کسب </tspan></text>
+    <rect id="Rectangle_708" data-name="Rectangle 708" width="275" height="66" rx="5" transform="translate(871.212 511.305)" fill="#05335f"/>
+    <text id="آزمون_ویژه_ابتدایی" data-name="آزمون ویژه ابتدایی" transform="translate(944.712 538.305)" fill="#fff" font-size="17" font-family="IRANSansX-Bold, IRANSansX" font-weight="700"><tspan x="0" y="0">آزمون ویژه ابتدایی</tspan></text>
+    <text id="ویژه_دانش_آموزان_پایه_ابتدایی" data-name="ویژه دانش آموزان پایه ابتدایی" transform="translate(946.212 558.305)" fill="#fff" font-size="11" font-family="IRANSansX-Light, IRANSansX" font-weight="300"><tspan x="0" y="0">ویژه دانش آموزان پایه ابتدایی</tspan></text>
+    <g id="Group_426" data-name="Group 426" transform="translate(786.913 284.305)">
+      <g id="Rectangle_461" data-name="Rectangle 461" transform="translate(37 381)" fill="#fff" stroke="#f1f1f1" stroke-width="1" opacity="0.23">
+        <rect width="369.6" height="65.296" rx="5" stroke="none"/>
+        <rect x="0.5" y="0.5" width="368.6" height="64.296" rx="4.5" fill="none"/>
+      </g>
+      <text id="تعداد_پاسخ_درست" data-name="تعداد پاسخ درست" transform="translate(376.099 408.467)" fill="#0ef" font-size="15" font-family="IRANSansX-Bold, IRANSansX" font-weight="700"><tspan x="-111.735" y="0">تعداد پاسخ درست</tspan></text>
+      <text id="تعداد_پاسخ_نادرست" data-name="تعداد پاسخ نادرست" transform="translate(183.701 408.467)" fill="#0ef" font-size="15" font-family="IRANSansX-Bold, IRANSansX" font-weight="700"><tspan x="-120.96" y="0">تعداد پاسخ نادرست</tspan></text>
+      <line id="Line_128" data-name="Line 128" y1="64.196" transform="translate(221.8 381)" fill="none" stroke="#f1f1f1" stroke-width="1"/>
+      <text id="سوال" transform="translate(332.6 434)" fill="#80eeff" font-size="15" font-family="IRANSansX-Medium, IRANSansX" font-weight="500"><tspan x="-31.65" y="0">سوال</tspan></text>
+      <text id="سوال-2" data-name="سوال" transform="translate(135.7 434)" fill="#80eeff" font-size="15" font-family="IRANSansX-Medium, IRANSansX" font-weight="500"><tspan x="-31.65" y="0">سوال</tspan></text>
+      <text id="_18" data-name="18" transform="translate(349.6 434)" fill="#80eeff" font-size="15" font-family="IRANSansX-Medium, IRANSansX" font-weight="500"><tspan x="-16.95" y="0">18</tspan></text>
+      <text id="_12" data-name="12" transform="translate(152.701 434)" fill="#80eeff" font-size="15" font-family="IRANSansX-Medium, IRANSansX" font-weight="500"><tspan x="-16.95" y="0">12</tspan></text>
+    </g>
+    <g id="vuesax_linear_cup" data-name="vuesax/linear/cup" transform="translate(580.712 -56.57)">
+      <g id="cup" transform="translate(364 380)">
+        <path id="Vector-21" data-name="Vector" d="M0,0V12.644" transform="translate(73.153 99.344)" fill="none" stroke="#f1e049" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"/>
+        <path id="Vector-22" data-name="Vector" d="M0,18.063H60.208V12.042A12.077,12.077,0,0,0,48.167,0H12.042A12.077,12.077,0,0,0,0,12.042v6.021Z" transform="translate(43.049 114.396)" fill="none" stroke="#f1e049" stroke-width="6"/>
+        <path id="Vector-23" data-name="Vector" d="M0,0H72.25" transform="translate(37.028 132.458)" fill="none" stroke="#f1e049" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"/>
+        <path id="Vector-24" data-name="Vector" d="M42.146,84.292A42.115,42.115,0,0,1,0,42.146V24.083A24.077,24.077,0,0,1,24.083,0H60.208A24.077,24.077,0,0,1,84.292,24.083V42.146A42.115,42.115,0,0,1,42.146,84.292Z" transform="translate(30.104 12.042)" fill="none" stroke="#f1e049" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"/>
+        <path id="Vector-25" data-name="Vector" d="M20.651,43.952a29.254,29.254,0,0,1-11.62-7.225C3.613,30.706,0,23.481,0,15.052A14.906,14.906,0,0,1,15.052,0h3.914a22.612,22.612,0,0,0-1.806,9.031V27.094A42.43,42.43,0,0,0,20.651,43.952Z" transform="translate(12.283 26.191)" fill="none" stroke="#f1e049" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"/>
+        <path id="Vector-26" data-name="Vector" d="M0,43.952a29.254,29.254,0,0,0,11.62-7.225c5.419-6.021,9.031-13.246,9.031-21.675A14.906,14.906,0,0,0,5.6,0H1.686A22.612,22.612,0,0,1,3.492,9.031V27.094A42.43,42.43,0,0,1,0,43.952Z" transform="translate(111.566 26.191)" fill="none" stroke="#f1e049" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"/>
+        <path id="Vector-27" data-name="Vector" d="M0,0H144.5V144.5H0Z" fill="none" opacity="0"/>
+      </g>
+    </g>
+    <line id="Line_232" data-name="Line 232" x2="438" y2="2" transform="translate(820.5 847.5)" fill="none" stroke="#fff" stroke-linecap="round" stroke-width="4"/>
+  </g>
+</svg>

src/components/Navbar/index.js

@@ -5,7 +5,7 @@ import graySearchIcon from "../../assets/icons/gray-search.svg";
 
 export default function Navbar({ pages }) {
   return (
-    <div className="z-20 flex flex-1 flex-row fixed left-0 top-0 justify-between w-full bg-opacity-20 shadow-sm bg-white backdrop-filter backdrop-blur-md lg:px-5 xl:px-10">
+    <div className="z-50 flex flex-1 flex-row fixed left-0 top-0 justify-between w-full bg-opacity-20 shadow-sm bg-white backdrop-filter backdrop-blur-md lg:px-5 xl:px-10">
       <div className="flex flex-row items-center">
         <Link to="/">
           <strong className="ml-3 text-primary lg:text-md xl:text-xl">

src/utils/scroll.js

@@ -24,7 +24,7 @@ class scroll {
       if (scrollY > 0 && scrollY < height) {
         return height - scrollY;
       }
-      if (scrollY === 7 * height) {
+      if (scrollY >= 10 * height) {
         return -1 * height;
       }
     } else if (index === 3) {
@@ -34,25 +34,25 @@ class scroll {
       if (scrollY > 3 * height && scrollY < 4 * height) {
         return 4 * height - scrollY;
       }
-      if (scrollY === 7 * height) {
+      if (scrollY === 10 * height) {
         return -height;
       }
     } else if (index === 4) {
-      if (scrollY <= 2 * height) {
+      if (scrollY <= 5 * height) {
         return height;
-      } else if (scrollY > 2 * height && scrollY < 3 * height) {
+      } else if (scrollY > 5 * height && scrollY < 5.5 * height) {
-        return 3 * height - scrollY;
+        return 6 * height - scrollY;
       }
-      if (scrollY === 4 * height) {
+      if (scrollY === 10 * height) {
         return -height;
       }
     } else if (index === 5) {
-      if (scrollY <= 3 * height) {
+      if (scrollY <= 6 * height) {
         return height;
-      } else if (scrollY > 3 * height && scrollY < 4 * height) {
+      } else if (scrollY > 6 * height && scrollY < 7 * height) {
-        return 4 * height - scrollY;
+        return 7 * height - scrollY;
       }
-      if (scrollY === 5 * height) {
+      if (scrollY === 10 * height) {
         return -height;
       }
     } else if (index === 6) {

src/views/Home/Page3/index.js

@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from "react";
 import _ from "lodash";
 import scroll from "../../../utils/scroll";
+import testResultImage from "../../../assets/images/test-result.svg";
 
 
 export default function Page3({ list, page }) {
@@ -15,13 +16,14 @@ export default function Page3({ list, page }) {
     <div
       className={_.join(
         [
-          "fixed left-0 h-screen w-full pt-20 bg-gray-300",
+          "fixed left-0 h-screen w-full pt-20 bg-white transition-opacity duration-500 flex flex-row justify-center items-end",
+          top > 0 ? "opacity-0 z-0" : "opacity-100 z-30",
         ],
         " "
       )}
       style={{ top: top }}
     >
-      
+      <img src={testResultImage} alt="" className="w-3/4" />
     </div>
   );
 }

src/views/Home/Page4/index.js

@@ -1,7 +1,9 @@
 import React, { useState, useEffect } from "react";
 import _ from "lodash";
 import scroll from "../../../utils/scroll";
-
+import bgImage from "../../../assets/images/page5-bg.svg";
+import bazarImage from "../../../assets/images/bazar.svg";
+import appStoreImage from "../../../assets/images/app-store.svg";
 
 export default function Page4({ list, page }) {
   const [top, setTop] = useState(window.innerHeight);
@@ -15,15 +17,44 @@ export default function Page4({ list, page }) {
     <div
       className={_.join(
         [
-          "fixed left-0 h-screen w-full pt-20 bg-gray-400",
+          "z-30 fixed left-0 h-screen w-full pt-20 bg-white",
+          top === window.innerHeight ? "opacity-0" : "opacity-100",
         ],
         " "
       )}
       style={{ top: top }}
-
     >
-      
+      <div className="relative w-full h-full">
+        <img src={bgImage} alt="" className="absolute left-0 -top-1/4 w-full" />
+        <div className="absolute top-1/4" style={{ right: "15%" }}>
+          <h1 className="text-blueC0 text-5xl font-bold leading-normal">
+            یادگیری بدون وقفه
+            <br /> لذت یادگیری هوشمند
+          </h1>
+          <p
+            className="text-blueC0 text-md font-light leading-normal"
+            style={{ width: "30%" }}
+          >
+            {" "}
+            مداد رنگی ها مشغول بودند به جز مداد سفید، هیچکس به او کار نمیداد،
+            همه میگفتند : تو به هیچ دردی نمیخوری، یک شب که مداد رنگی ها تو سیاهی
+            شب گم شده بودند، مداد سفید تا صبح ماه کشید مهتاب کشید و انقدر ستاره
+            کشید که کوچک و کوچکتر شد صبح توی جعبه مداد رنگی جای خالی او با هیچ
+            رنگی پر نشد، به یاد هم باشیم شاید فردا ما هم در کنار هم نباشیم
+          </p>
+          <div
+            className="flex flex-row justify-center w-full mt-5"
+            style={{ width: "30%" }}
+          >
+            <img src={bazarImage} alt="" className="w-36 mx-5 cursor-pointer" />
+            <img
+              src={appStoreImage}
+              alt=""
+              className="w-32 mx-5 cursor-pointer"
+            />
+          </div>
+        </div>
+      </div>
     </div>
   );
 }
-

src/views/Home/index.js

@@ -3,6 +3,8 @@ import Navbar from "../../components/Navbar";
 
 import Page1 from "./Page1";
 import Page2 from "./Page2";
+import Page3 from "./Page3";
+import Page4 from "./Page4";
 import VideoTube from "./VideoTube";
 
 export default function Home() {
@@ -25,6 +27,8 @@ export default function Home() {
       <Page1 page={1} />
       <Page2 page={2} autoPlay={autoPlay} />
       <VideoTube page={3} autoPlay={autoPlay} />
+      <Page3 page={4} />
+      <Page4 page={5} />
     </div>
   );
 }