list.html 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1">
  7. <meta http-equiv="Cache-Control" content="no-cache">
  8. <title>Choozmo Marketing Cloud</title>
  9. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
  10. integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
  11. <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.11.2/css/all.css">
  12. <link rel="stylesheet" href="/css/style.css">
  13. <link rel="stylesheet" href="/css/custom.css">
  14. </head>
  15. <body>
  16. {{ partial "navbar.html" . }}
  17. <main class="container news-content" style="overflow-x: hidden;">
  18. <ul id="categories">
  19. <li>
  20. <button id="all">
  21. <a href="/main-news/">所有訊息</a>
  22. </button>
  23. </li>
  24. <li>
  25. <button id="focus">
  26. <a href="/main-news/focus/">焦點訊息</a>
  27. </button>
  28. </li>
  29. <li>
  30. <button id="serve">
  31. <a href="/main-news/serve/">最新服務</a>
  32. </button>
  33. </li>
  34. <li>
  35. <button id="event">
  36. <a href="/main-news/event/">活動公告</a>
  37. </button>
  38. </li>
  39. </ul>
  40. {{ if eq (relURL .URL) ("/main-news/focus/") }}
  41. {{ $t := $.Site.GetPage "/main-news" }}
  42. <ul class="list">
  43. {{ range $index, $element := where $t.Pages "Params.categories" "焦點訊息" }}
  44. {{ $t := $.Site.GetPage "/main-news" }}
  45. <li>
  46. <a href="{{ .RelPermalink }}">
  47. <h2>{{ .Title }}</h2>
  48. </a>
  49. <hr>
  50. <section class="d-flex justify-content-between">
  51. <p class="news-category">{{ .Params.categories }}</p>
  52. <p>{{ .PublishDate.Format "2006-01-02" }}</p>
  53. </section>
  54. <a href="{{ .RelPermalink }}" class="content">
  55. <p>{{.Summary}}</p>
  56. </a>
  57. <div class="more-btn">
  58. <a href="{{ .RelPermalink }}">
  59. 閱讀文章
  60. </a>
  61. </div>
  62. </li>
  63. {{ end }}
  64. </ul>
  65. {{ end }}
  66. {{ if eq (relURL .URL) ("/main-news/serve/") }}
  67. {{ $t := $.Site.GetPage "/main-news" }}
  68. <ul class="list">
  69. {{ range $index, $element := where $t.Pages "Params.categories" "最新服務" }}
  70. {{ $t := $.Site.GetPage "/main-news" }}
  71. <li>
  72. <a href="{{ .RelPermalink }}">
  73. <h2>{{ .Title }}</h2>
  74. </a>
  75. <hr>
  76. <section class="d-flex justify-content-between">
  77. <p class="news-category">{{ .Params.categories }}</p>
  78. <p>{{ .PublishDate.Format "2006-01-02" }}</p>
  79. </section>
  80. <a href="{{ .RelPermalink }}" class="content">
  81. <p>{{.Summary}}</p>
  82. </a>
  83. <div class="more-btn">
  84. <a href="{{ .RelPermalink }}">
  85. 閱讀文章
  86. </a>
  87. </div>
  88. </li>
  89. {{ end }}
  90. </ul>
  91. {{ end }}
  92. {{ if eq (relURL .URL) ("/main-news/event/") }}
  93. {{ $t := $.Site.GetPage "/main-news" }}
  94. <ul class="list">
  95. {{ range $index, $element := where $t.Pages "Params.categories" "活動公告" }}
  96. {{ $t := $.Site.GetPage "/main-news" }}
  97. <li>
  98. <a href="{{ .RelPermalink }}">
  99. <h2>{{ .Title }}</h2>
  100. </a>
  101. <hr>
  102. <section class="d-flex justify-content-between">
  103. <p class="news-category">{{ .Params.categories }}</p>
  104. <p>{{ .PublishDate.Format "2006-01-02" }}</p>
  105. </section>
  106. <a href="{{ .RelPermalink }}" class="content">
  107. <p>{{.Summary}}</p>
  108. </a>
  109. <div class="more-btn">
  110. <a href="{{ .RelPermalink }}">
  111. 閱讀文章
  112. </a>
  113. </div>
  114. </li>
  115. {{ end }}
  116. </ul>
  117. {{ end }}
  118. {{ $paginator := .Paginate .Data.Pages }}
  119. <ul class="list">
  120. {{ range $paginator.Pages }}
  121. {{ $t := $.Site.GetPage "/main-news" }}
  122. {{ if ne .Params.categories "url" }} <!-- 排除分類用的 content -->
  123. <li>
  124. <a href="{{ .RelPermalink }}">
  125. <h2>{{ .Title }}</h2>
  126. </a>
  127. <hr>
  128. <section class="d-flex justify-content-between">
  129. <p class="news-category">{{ .Params.categories }}</p>
  130. <p>{{ .PublishDate.Format "2006-01-02" }}</p>
  131. </section>
  132. <a href="{{ .RelPermalink }}" class="content">
  133. <p>{{.Summary}}</p>
  134. </a>
  135. <div class="more-btn">
  136. <a href="{{ .RelPermalink }}">
  137. 閱讀文章
  138. </a>
  139. </div>
  140. </li>
  141. {{ end }}
  142. {{ end }}
  143. </ul>
  144. </main>
  145. {{ partial "footer.html" . }}
  146. <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"
  147. integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p"
  148. crossorigin="anonymous"></script>
  149. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"
  150. integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF"
  151. crossorigin="anonymous"></script>
  152. <script src="//code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
  153. crossorigin="anonymous"></script>
  154. <script>
  155. let pathname = window.location.pathname;
  156. $('.news-content button').removeClass('active');
  157. if (pathname.includes('focus')) {
  158. $('.news-content #focus').addClass('active');
  159. } else if (pathname.includes('serve')) {
  160. $('.news-content #serve').addClass('active');
  161. } else if (pathname.includes('event')) {
  162. $('.news-content #event').addClass('active');
  163. } else {
  164. $('.news-content #all').addClass('active');
  165. }
  166. </script>
  167. </body>
  168. </html>