index.html 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. {{ define "main" }}
  2. {{ if eq site.Params.layout "1" }}
  3. <!-- featured post -->
  4. <section class="overflow-hidden">
  5. <div class="container-fluid p-sm-0">
  6. <div class="row featured-post-slider">
  7. {{ range (where site.RegularPages "Type" "featured")}}
  8. <div class="col-lg-3 col-sm-6 mb-2 mb-lg-0 px-1">
  9. <article class="card bg-dark text-center text-white border-0 rounded-0">
  10. <img class="card-img rounded-0 img-fluid w-100" src="{{.Params.Image | absURL}}" alt="post-thumb">
  11. <div class="card-img-overlay">
  12. <div class="card-content">
  13. <p class="text-uppercase">{{range .Params.Categories}}{{. | humanize}}{{end}}</p>
  14. <h4 class="card-title mb-4"><a class="text-white" href="{{.Permalink}}">{{.Title}}</a></h4>
  15. <a class="btn btn-outline-light" href="{{.Permalink}}">了解更多</a>
  16. </div>
  17. </div>
  18. </article>
  19. </div>
  20. {{ end }}
  21. </div>
  22. </div>
  23. </section>
  24. <!-- /featured post -->
  25. {{ else if (eq site.Params.layout "2")}}
  26. <!-- hero area -->
  27. <section class="hero-section">
  28. <div class="container">
  29. <div class="row">
  30. <div class="col-lg-6 align-self-end">
  31. <h1 class="mb-0">Welcome</h1>
  32. <h2 class="mb-100 title-border-lg">to <i>{{site.Params.author}} Blog</i></h2>
  33. <p class="mb-80 mr-5">{{site.Params.bio | markdownify }}</p>
  34. <span class="font-secondary text-dark mr-3 mr-sm-5">Follow me :</span>
  35. <ul class="list-inline d-inline-block mb-5">
  36. {{ range site.Params.social }}
  37. <li class="list-inline-item mx-3"><a href="{{.URL}}" class="text-dark"><i class="{{.icon}}"></i></a></li>
  38. {{ end }}
  39. </ul>
  40. </div>
  41. <div class="col-lg-6 text-right">
  42. <img class="img-fluid" src="{{site.Params.author_image | absURL}}" alt="banner-image">
  43. </div>
  44. </div>
  45. </div>
  46. </section>
  47. <!-- /hero area -->
  48. {{ else }}
  49. <section class="section">
  50. <div class="container text-center">
  51. <h1>Please Enter A Valid Homepage Layout Number <br> (1 or 2)</h1>
  52. </div>
  53. </section>
  54. {{ end }}
  55. <!-- blog post -->
  56. <section class="section">
  57. <div class="container">
  58. {{ $paginator := .Paginate (where site.RegularPages "Type" "post") }}
  59. {{ if eq site.Params.layout "1" }}
  60. <div class="row masonry-container">
  61. {{ range $paginator.Pages }}
  62. <div class="col-lg-4 col-sm-6 mb-5">
  63. <article class="text-center">
  64. {{ if eq .Params.image "cover.jpg" }}
  65. {{ else }}
  66. <img class="img-fluid mb-4" src="{{.Params.Image | absURL }}" alt="post-thumb">
  67. {{ end }}
  68. <p class="text-uppercase mb-2">{{range .Params.Categories}}{{. | humanize}}{{end}}</p>
  69. <h4 class="title-border"><a class="text-dark" href="{{.Permalink}}">{{.Title}}</a></h4>
  70. <p>{{.Summary}}</p>
  71. <a href="{{.Permalink}}" class="btn btn-transparent">了解更多</a>
  72. </article>
  73. </div>
  74. {{ end }}
  75. </div>
  76. {{ else if (eq site.Params.layout "2")}}
  77. <div class="row">
  78. {{ range $i,$p := (where $paginator.Pages "Type" "post") }}
  79. <div class="col-12 mb-100">
  80. <article data-file="{{.Permalink}}" data-target="article"
  81. class="article-full-width {{if not (modBool $i 2)}} article-right {{ end }}">
  82. <div class="post-image">
  83. <img class="img-fluid" src="{{ .Params.Image | absURL }}" alt="post-thumb">
  84. </div>
  85. <div class="post-content">
  86. <ul class="list-inline d-flex justify-content-between border-bottom post-meta pb-2 mb-4">
  87. <li class="list-inline-item"><i class="ti-calendar mr-2"></i>{{ .PublishDate.Format "Jan 02, 2006" }}</li>
  88. <li class="list-inline-item"><i class="ti-alarm-clock mr-2"></i><span class="eta"></span> read</li>
  89. </ul>
  90. <h4 class="mb-4"><a href="{{.Permalink}}" class="text-dark">{{ .Title }}</a></h4>
  91. <p class="mb-0 post-summary">{{.Summary }}</p>
  92. <a class="btn btn-transparent mb-4" href="{{.Permalink}}">Continue...</a>
  93. </div>
  94. </article>
  95. </div>
  96. {{ end }}
  97. </div>
  98. {{ end }}
  99. <!-- pagination -->
  100. <div class="row">
  101. <div class="col-12">
  102. {{ $paginator := .Paginator }}
  103. <!-- Number of links either side of the current page. -->
  104. {{ $adjacent_links := 2 }}
  105. <!-- $max_links = ($adjacent_links * 2) + 1 -->
  106. {{ $max_links := (add (mul $adjacent_links 2) 1) }}
  107. <!-- $lower_limit = $adjacent_links + 1 -->
  108. {{ $lower_limit := (add $adjacent_links 1) }}
  109. <!-- $upper_limit = $paginator.TotalPages - $adjacent_links -->
  110. {{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }}
  111. <!-- If there's more than one page. -->
  112. {{ if gt $paginator.TotalPages 1 }}
  113. <nav aria-label="Page navigation">
  114. <ul class="pagination justify-content-center align-items-center">
  115. <!-- Previous page. -->
  116. {{ if $paginator.HasPrev }}
  117. <li class="page-item">
  118. <a href="{{ $paginator.Prev.URL }}" class="page-link">
  119. &laquo; 上一頁
  120. </a>
  121. </li>
  122. {{ end }}
  123. <!-- Page numbers. -->
  124. {{ range $paginator.Pagers }}
  125. {{ $.Scratch.Set "page_number_flag" false }}
  126. <!-- Advanced page numbers. -->
  127. {{ if gt $paginator.TotalPages $max_links }}
  128. <!-- Lower limit pages. -->
  129. <!-- If the user is on a page which is in the lower limit. -->
  130. {{ if le $paginator.PageNumber $lower_limit }}
  131. <!-- If the current loop page is less than max_links. -->
  132. {{ if le .PageNumber $max_links }}
  133. {{ $.Scratch.Set "page_number_flag" true }}
  134. {{ end }}
  135. <!-- Upper limit pages. -->
  136. <!-- If the user is on a page which is in the upper limit. -->
  137. {{ else if ge $paginator.PageNumber $upper_limit }}
  138. <!-- If the current loop page is greater than total pages minus $max_links -->
  139. {{ if gt .PageNumber (sub $paginator.TotalPages $max_links) }}
  140. {{ $.Scratch.Set "page_number_flag" true }}
  141. {{ end }}
  142. <!-- Middle pages. -->
  143. {{ else }}
  144. {{ if and ( ge .PageNumber (sub $paginator.PageNumber $adjacent_links) ) ( le .PageNumber (add $paginator.PageNumber $adjacent_links) ) }}
  145. {{ $.Scratch.Set "page_number_flag" true }}
  146. {{ end }}
  147. {{ end }}
  148. <!-- Simple page numbers. -->
  149. {{ else }}
  150. {{ $.Scratch.Set "page_number_flag" true }}
  151. {{ end }}
  152. <!-- Output page numbers. -->
  153. {{ if eq ($.Scratch.Get "page_number_flag") true }}
  154. <li class="page-item{{ if eq . $paginator }} page-item active {{ end }}">
  155. <a href="{{ .URL }}" class="page-link">
  156. {{ .PageNumber }}
  157. </a>
  158. </li>
  159. {{ end }}
  160. {{ end }}
  161. <!-- Next page. -->
  162. {{ if $paginator.HasNext }}
  163. <li class="page-item">
  164. <a href="{{ $paginator.Next.URL }}" class="page-link">
  165. 下一頁 &raquo;
  166. </a>
  167. </li>
  168. {{ end }}
  169. </ul>
  170. </nav>
  171. {{ end }}
  172. </div>
  173. </div>
  174. <!-- pagination -->
  175. </div>
  176. </section>
  177. <!-- /blog post -->
  178. {{partial "instafeed.html" . }}
  179. {{ end }}