Parcourir la source

Added footer for pages

golestan il y a 3 ans
Parent
commit
c68fbb5b6d

+ 36 - 0
resources/sass/home/home.scss

@@ -135,6 +135,42 @@ a {
     color: $secondary;
 }
 
+// footer
+footer {
+    line-height: 2;
+    text-align: justify;
+    background-color: #212529;
+    color: $white;
+    padding: 2rem 0;
+    .about {
+        text-align: justify;
+        line-height: 2;
+    }
+    hr {
+        background-color: $white;
+        opacity: 1;
+    }
+    .menu-footer_menu {
+        list-style: none;
+        line-height: 2;
+        padding-right: 0;
+        .menu-item {
+            a {
+                color: $white;
+            }
+        }
+    }
+    .social {
+        a {
+            color: $white;
+        }
+    }
+    .newsletter-subscription {
+        .input-subscription {
+            text-align: right;
+        }
+    }
+}
 // style for content single article page
 .container-article-width {
     @media screen and (min-width: 1400px){

+ 1 - 1
resources/views/home/home.blade.php

@@ -7,7 +7,7 @@
     @endslot
 
     @slot('content')
-      <h1>
+      <h1 style="height: 600px">
           home pageeeeeee
       </h1>
     @endslot

+ 111 - 5
resources/views/home/layouts/footer.blade.php

@@ -1,5 +1,111 @@
-{{--<footer>
-    <h2>
-        footer
-    </h2>
-</footer>--}}
+<footer>
+    <div class="container">
+        <div class="row">
+            <div class="col-12 mb-4">
+                <h4>دیزاتک</h4>
+            </div>
+            <div class="col-lg-3 col-12 mb-4">
+                <h5 class="mb-2">درباره</h5>
+                <hr>
+                <div class="about">
+                    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد.
+                </div>
+            </div>
+            <div class="col-lg-3 col-12 mb-4">
+                <h5 class="mb-3">لینک های مفید</h5>
+                <hr>
+                <nav class="menu-footer_menu-container">
+                    <ul class="menu-footer_menu">
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                خدمات
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                محصولات
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                آکادمی
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                فرصت‌های شغلی
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                همکاران
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                بلاگ
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                درباره ما
+                            </a>
+                        </li>
+                        <li id="" class="menu-item">
+                            <a href="">
+                                <span class="fa fa-angle-left"></span>
+                                تماس با ما
+                            </a>
+                        </li>
+                    </ul>
+                </nav>
+            </div>
+            <div class="col-lg-3 col-12 mb-4">
+                <h5 class="mb-3">اطلاعات تماس</h5>
+                <hr>
+                <div>
+                    <span class="fa fa-map-marker"></span>
+                    <span>تهران، میدان توحید، خیابان ستارخان، نرسیده به خیابان باقرخان، خیابان آفرند، پلاک ۱۱، طبقه همکف </span>
+                </div>
+                <div>
+                    <span>
+                        کدپستی: ۱۴۴۱۶۴۳۹۴۱
+                    </span>
+                </div>
+                <div>
+                    <span class="fa fa-envelope"></span>
+                    <span>info@dizatech.com</span>
+                </div>
+                <div>
+                    <a>
+                        <span class="fa fa-phone"></span>
+                        <span>۰۲۱-۶۲۹۹۹۰۴۷</span>
+                    </a>
+                </div>
+                <div class="social">
+                    <a href="">
+                        <span class="fa fa-instagram"></span>
+                    </a>
+                    <a href="#">
+                        <span class="fa fa-linkedin"></span>
+                    </a>
+                </div>
+            </div>
+            <div class="col-lg-3 col-12">
+                <div class="newsletter-subscription">
+                    <div class="input-group" style="direction: initial">
+                        <button class="btn btn-primary" type="button" id="button-addon1">عضویت</button>
+                        <input type="text" class="form-control input-subscription" placeholder="عضویت در خبرنامه" aria-label="Example text with button addon" aria-describedby="button-addon1">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</footer>