modified blog

9 files changed, 96 insertions, 140 deletions

diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index a53291e..9cc0cc0 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -3,8 +3,8 @@ baseURL = "http://example.org/"
 languageCode = "en-us"
 title = "Restaurant Theme By Themefisher"
 theme = "restaurant-hugo"
-summaryLength = "7"
-paginate = 6
+summaryLength = "10"
+paginate = 4
 
 ############################# Plugins ##############################
 
@@ -84,7 +84,7 @@ copyright = "Copyright 2020 - All Rights Reserved. Design and Developed By Theme
 
 # Preloader
 [params.preloader]
-enable = true
+enable = false
 preloader = "" # use .png , .svg or .gif format
 
 ################################### Footer ############################
diff --git a/exampleSite/content/Homestyle-Chicken-Pot-Pie.md b/exampleSite/content/blog/Homestyle-Chicken-Pot-Pie.md
index a3a5bce..a3a5bce 100644
--- a/exampleSite/content/Homestyle-Chicken-Pot-Pie.md
+++ b/exampleSite/content/blog/Homestyle-Chicken-Pot-Pie.md
diff --git a/exampleSite/content/Red-Pepper-Miso-Wings-2.md b/exampleSite/content/blog/Red-Pepper-Miso-Wings-2.md
index cab400a..cab400a 100644
--- a/exampleSite/content/Red-Pepper-Miso-Wings-2.md
+++ b/exampleSite/content/blog/Red-Pepper-Miso-Wings-2.md
diff --git a/exampleSite/content/Red-Pepper-Miso-Wings.md b/exampleSite/content/blog/Red-Pepper-Miso-Wings.md
index a01a1d9..a01a1d9 100644
--- a/exampleSite/content/Red-Pepper-Miso-Wings.md
+++ b/exampleSite/content/blog/Red-Pepper-Miso-Wings.md
diff --git a/exampleSite/content/my-first-post.md b/exampleSite/content/blog/my-first-post.md
index fc90e6b..fc90e6b 100644
--- a/exampleSite/content/my-first-post.md
+++ b/exampleSite/content/blog/my-first-post.md
diff --git a/exampleSite/content/restaurant.md b/exampleSite/content/blog/restaurant.md
index 2827144..2827144 100644
--- a/exampleSite/content/restaurant.md
+++ b/exampleSite/content/blog/restaurant.md
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 834b29f..c90c908 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -2,30 +2,32 @@
 
 {{- partial "header.html" . -}}
 
-<section>
-  <div class="container">
-    <div class="row">
-      <div class="col-md-12">
-        <div class="block">
-          <ul>
-            {{ $paginator := .Paginate .Site.RegularPages }}
-            {{ range $paginator.Pages }}
-            <li class="wow fadeInLeft" data-wow-duration="300ms" data-wow-delay="300ms">
-              <div class="blog-img">
-                <img src="{{ .Params.Image | absURL }}" alt="post-image" class="img-responsive">
-              </div>
-              <div class="content-right">
-                <h3><a href="{{ .Permalink }}">{{ .Title }}</a></h3>
-                <p>{{ .Summary }}</p>
-              </div>
-            </li>
-            {{ end }}
-          </ul>
-        </div>
-      </div><!-- .col-md-12 close -->
-      {{ template "_internal/pagination.html" . }}
-    </div><!-- .row close -->
-  </div><!-- .containe close -->
+<section id="blog" {{ if .Site.Data.homepage.blog.overlay }} class="overlay" {{ end }}
+	style="background-image: url('{{ .Site.Data.homepage.blog.bg_image | absURL }}');">
+	<div class="container">
+		<div class="row">
+			<div class="col-md-12">
+				<div class="block">
+					<h1 class="heading">{{ .Site.Data.homepage.blog.title | markdownify }}</h1>
+					{{ $paginator := .Paginate .Site.RegularPages }}
+					{{ range $paginator.Pages }}
+					<div class="col-lg-6">
+						<article class="post wow fadeInLeft" data-wow-duration="300ms" data-wow-delay="300ms">
+							<div class="post-img">
+								<img src="{{ .Params.Image | absURL }}" alt="post-image" class="img-responsive">
+							</div>
+							<div class="post-content">
+								<h3><a href="{{ .Permalink }}">{{ .Title }}</a></h3>
+								<p>{{ .Summary }}</p>
+							</div>
+						</article>
+					</div>
+					{{ end }}
+				</div>
+			</div><!-- .col-md-12 close -->
+			{{ template "_internal/pagination.html" . }}
+		</div><!-- .row close -->
+	</div><!-- .containe close -->
 </section><!-- #blog close -->
 
 {{end}}
\ No newline at end of file
diff --git a/layouts/partials/blog.html b/layouts/partials/blog.html
index 01ba974..d74e0ef 100644
--- a/layouts/partials/blog.html
+++ b/layouts/partials/blog.html
@@ -6,24 +6,26 @@
 			<div class="col-md-12">
 				<div class="block">
 					<h1 class="heading">{{ .Site.Data.homepage.blog.title | markdownify }}</h1>
-					<ul>
-						{{ $paginator := .Paginate .Site.RegularPages }}
-						{{ range $paginator.Pages }}
-						<li class="wow fadeInLeft" data-wow-duration="300ms" data-wow-delay="300ms">
-							<div class="blog-img">
+					{{ $paginator := .Paginate .Site.RegularPages }}
+					{{ range first 4 (where .Site.RegularPages "Section" "blog") }}
+					<div class="col-lg-6">
+						<article class="post wow fadeInLeft" data-wow-duration="300ms" data-wow-delay="300ms">
+							<div class="post-img">
 								<img src="{{ .Params.Image | absURL }}" alt="post-image" class="img-responsive">
 							</div>
-							<div class="content-right">
+							<div class="post-content">
 								<h3><a href="{{ .Permalink }}">{{ .Title }}</a></h3>
 								<p>{{ .Summary }}</p>
 							</div>
-						</li>
-						{{ end }}
-					</ul>
+						</article>
+					</div>
+					{{ end }}
+					<div class="text-center">
+						<a href="/blog" class="btn btn-default">All Post</a>
+					</div>
 				</div>
-			</div><!-- .col-md-12 close -->
-			{{ template "_internal/pagination.html" . }}
-		</div><!-- .row close -->
-	</div><!-- .containe close -->
+			</div>
+		</div>
+	</div>
 </section><!-- #blog close -->
 {{end}}
\ No newline at end of file
diff --git a/static/css/main.css b/static/css/main.css
index 2fa854d..4096a2d 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -26,7 +26,7 @@ body {
   font-weight: 400;
 }
 
-a:focus{
+a:focus {
   outline: 0;
 }
 
@@ -317,106 +317,39 @@ nav .block .navbar-default .navbar-nav>.active>a:hover:before {
 
 #blog .block .heading {
   color: #fff;
+  margin-bottom: 40px;
 }
 
-#blog .block ul {
-  padding-top: 40px;
-}
-
-#blog .block ul li {
-  overflow: hidden;
-  width: 49.5%;
-  max-height: 210px;
-  float: left;
-  background: #fff;
-  text-align: center;
-  color: #959595;
-  transform: 1s;
-  margin-bottom: 10px;
-}
-
-#blog .block ul li:nth-child(1n) {
-  margin-right: 1%;
-}
-
-#blog .block ul li:nth-child(2n) {
-  margin-right: 0;
+.post {
+  display: flex;
+  margin-bottom: 20px;
 }
 
-#blog .block ul li:hover img {
+.post:hover img {
   transform: scale(1.2) rotate(10deg);
 }
 
-#blog .block ul li h3 {
-  padding: 0px 40px 20px;
-  line-height: 26px;
-  position: relative;
-}
-
-#blog .block ul li h3 a {
-  color: #323232;
-  font-size: 20px;
-  display: block;
-}
-
-#blog .block ul li h3 a:hover {
-  color: #FF5333;
-}
-
-
-#blog .block ul li h3:before {
-  content: "";
-  position: absolute;
-  left: 50%;
-  bottom: 0;
-  width: 90px;
-  height: 1px;
-  background: #CBC4B5;
-  margin-left: -45px;
-}
-
-#blog .block ul li p {
-  padding-top: 25px;
-}
-
-#blog .block ul li .blog-img {
-  float: left;
-  width: 50%;
-  height: 100%;
-  background: red;
+.post-img {
+  flex-basis: 50%;
   overflow: hidden;
 }
 
-#blog .block ul li .blog-img img {
-  -webkit-transition: all 0.8s ease-out;
-  -o-transition: all 0.8s ease-out;
-  transition: all 0.8s ease-out;
-}
-
-#blog .block ul li .blog-img-2 {
-  width: 50%;
-  float: right;
-  overflow: hidden;
-}
-
-#blog .block ul li .blog-img-2 img {
-  -webkit-transition: all 0.8s ease-out;
-  -o-transition: all 0.8s ease-out;
+.post-img img {
   transition: all 0.8s ease-out;
   width: 100%;
+  height: auto;
+  object-fit: cover;
 }
 
-#blog .block ul li .content-right {
-  padding: 40px 35px 23px;
-  font-size: 16px;
-  line-height: 26px;
-  float: right;
-  width: 50%;
-  height: 100%;
+.post-content {
+  background-color: #fff;
   position: relative;
+  flex-basis: 50%;
+  text-align: center;
+  padding: 20px;
 }
 
-#blog .block ul li .content-right:after {
+.post-content::before {
   content: "";
   position: absolute;
   left: 0;
@@ -431,27 +364,36 @@ nav .block .navbar-default .navbar-nav>.active>a:hover:before {
   margin-left: -15px;
 }
 
-#blog .block ul li .content-left {
-  padding: 40px 35px 23px;
-  width: 50%;
-  height: 100%;
-  float: left;
+.post-content h3 {
+  padding: 0px 10px 20px;
+  margin-bottom: 20px;
+  line-height: 26px;
   position: relative;
-  z-index: 999;
 }
 
-#blog .block ul li .content-left:after {
+.post-content h3:before {
   content: "";
   position: absolute;
-  right: -15px;
-  top: 50%;
-  width: 30px;
-  height: 30px;
-  margin-top: 0px;
-  background: #fff;
-  transform: rotate(45deg);
+  left: 50%;
+  bottom: 0;
+  width: 90px;
+  height: 1px;
+  background: #CBC4B5;
+  margin-left: -45px;
+}
+
+.post-content h3 a {
+  color: #323232;
+  font-size: 20px;
+  display: block;
+}
+
+.post-content h3 a:hover {
+  color: #FF5333;
 }
 
+
+
 #blog .block .btn-more-info {
   float: right;
   padding: 28px 102.5px;
@@ -486,7 +428,7 @@ nav .block .navbar-default .navbar-nav>.active>a:hover:before {
 }
 
 
-.mx-auto{
+.mx-auto {
   margin-left: auto;
   margin-right: auto;
 }
@@ -929,7 +871,7 @@ nav .block .navbar-default .navbar-nav>.active>a:hover:before {
   margin-top: 20px;
 }
 
-.pagination>li{
+.pagination>li {
   display: inline-block;
 }
 
@@ -959,4 +901,14 @@ nav .block .navbar-default .navbar-nav>.active>a:hover:before {
   background: #FF4F02;
   color: #fff;
   border-color: #FF4F02
+}
+
+.btn-default {
+  background: #FF4F02;
+  color: #fff;
+  font-weight: 600;
+  text-transform: uppercase;
+  border-radius: 0px;
+  border: 0px;
+  padding: 10px 25px;
 }
\ No newline at end of file