The project changed and add home page, mega menu

parsfront · Jul 6, 2022 · 56238d8 · 56238d8
1 parent 42da4ff
commit 56238d8
Show file tree

Hide file tree

Showing 14 changed files with 697 additions and 11,788 deletions.
diff --git a/images/2.ai b/images/2.ai
diff --git a/images/3.ai b/images/3.ai
diff --git a/images/4.ai b/images/4.ai
diff --git a/images/5.ai b/images/5.ai
diff --git a/images/6.ai b/images/6.ai
diff --git a/images/7.ai b/images/7.ai
diff --git a/images/8.ai b/images/8.ai
diff --git a/images/goldVip.png b/images/goldVip.png
diff --git a/images/landing.jpg b/images/landing.jpg
diff --git a/images/logo.svg b/images/logo.svg
diff --git a/images/rochet.ai b/images/rochet.ai
diff --git a/index.html b/index.html
@@ -11,6 +11,7 @@
 
 <body>
 
+  <!--Home-page-->
   <section class="home-page">
     <header>
       <div class="container">
@@ -41,6 +42,181 @@
         </nav>
       </div>
     </header>
+
+
+    <div class="home-page-content-parent">
+      <div class="container">
+        <div class="home-page-content">
+          <div class="row">
+            <div class="col-12">
+              <div class="home-page-title">
+                <p>خودآموزی ، کسب تجربه ، ورود به بازار کار با تاپ لرن
+                  با کمترینــــ هزینه خودت حرفه ایــــ یاد بگیـر</p>
+              </div>
+            </div>
+            <div class="col-12">
+              <div class="home-page-search">
+                <form>
+                  <input type="text" placeholder="چی میخوای یاد بگیری؟">
+                  <a href=""><i class="fas fa-search"></i></a>
+                </form>
+              </div>
+            </div>
+            <div class="col-12">
+              <div class="home-page-statistics">
+                <div class="row">
+                  <div class="col-4">
+                    <div class="statistics-item">
+                      <img src="./images/stat-time.svg" alt="">
+                      <span class="statistics-item-count">248,258</span>
+                      <h5>دقیقه آموزش</h5>
+                    </div>
+                  </div>
+                  <div class="col-4">
+                    <div class="statistics-item">
+                      <img src="./images/stat-teacher.svg" alt="">
+                      <span class="statistics-item-count">134</span>
+                      <h5>مدرس مجرب</h5>
+                    </div>
+                  </div>
+                  <div class="col-4">
+                    <div class="statistics-item">
+                      <img src="./images/stat-student.svg" alt="">
+                      <span class="statistics-item-count">225,179</span>
+                      <h5>نفر دانشجو</h5>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!--Mega-Menu-->
+  <section class="mega-menu">
+    <div class="container">
+      <nav class="navbar">
+        <ul class="navbar-nav">
+          <li class="nav-item">
+            <a href="" class="nav-link">طراحی وب <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+          <li class="nav-item">
+            <a href="" class="nav-link">برنامه نویسی <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+          <li class="nav-item">
+            <a href="" class="nav-link">برنامه نویسی موبایل <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+          <li class="nav-item">
+            <a href="" class="nav-link">بانک های اطلاعاتی <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+          <li class="nav-item">
+            <a href="" class="nav-link">گرافیک <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+          <li class="nav-item">
+            <a href="" class="nav-link">برنامه نویسی تحت ویندوز <i class="fas fa-chevron-down"></i></a>
+            <ul>
+              <li><a href="#">Vue js</a></li>
+              <li><a href="#">React js</a></li>
+              <li><a href="#">jquery</a></li>
+              <li><a href="#">angular</a></li>
+              <li><a href="#">bootstrap</a></li>
+              <li><a href="#">طراحی وب</a></li>
+            </ul>
+          </li>
+        </ul>
+        <div class="special-members">
+          <h3>مخصوص اعضای ویژه</h3>
+          <img src="./images/goldVip.png" alt="">
+        </div>
+      </nav>
+    </div>
+  </section>
+
+  <!--Service-->
+  <section class="service">
+    <div class="title">
+      <h2>با ما!</h2>
+    </div>
+    <div class="container">
+      <div class="row">
+        <div class="col-12 col-sm-6 col-md-3">
+          <div class="service-item">
+            <img src="./images/service/1.svg" alt="">
+            <h3>متخصص شو</h3>
+            <p>اگر شما یک طراح هستین و یا با طراحی های گرافیکی سروکار دارید به متن های برخورده اید که با نام لورم ایپسوم
+              شناخته می‌شوند.</p>
+          </div>
+        </div>
+
+        <div class="col-12 col-sm-6 col-md-3">
+          <div class="service-item">
+            <img src="./images/service/friendship.svg" alt="">
+            <h3>کار تیمی</h3>
+            <p>اگر شما یک طراح هستین و یا با طراحی های گرافیکی سروکار دارید به متن های برخورده اید که با نام لورم ایپسوم
+              شناخته می‌شوند.</p>
+          </div>
+        </div>
+
+        <div class="col-12 col-sm-6 col-md-3">
+          <div class="service-item">
+            <img src="./images/service/project.svg" alt="">
+            <h3>سریع و با کیفیت</h3>
+            <p>اگر شما یک طراح هستین و یا با طراحی های گرافیکی سروکار دارید به متن های برخورده اید که با نام لورم ایپسوم
+              شناخته می‌شوند.</p>
+          </div>
+        </div>
+        <div class="col-12 col-sm-6 col-md-3">
+          <div class="service-item">
+            <img src="./images/service/target.svg" alt="">
+            <h3>هدف گذاری مطمئن</h3>
+            <p>اگر شما یک طراح هستین و یا با طراحی های گرافیکی سروکار دارید به متن های برخورده اید که با نام لورم ایپسوم
+              شناخته می‌شوند.</p>
+          </div>
+        </div>
+      </div>
   </section>