blog.ejs 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <div class="container bottom-spacer">
  2. <div class="row up-spacer bottom-spacer">
  3. <div class="col-12 text-center">
  4. <h1 class="display-3" style="margin-bottom: 0px;">
  5. <b>J1X</b> <span class="font-weight-lighter">BLOG</span>
  6. </h1>
  7. <h4><small class="text-muted">Technical writings by James Peret</small></h4>
  8. </div>
  9. </div>
  10. <div class="row blog-posts">
  11. <% var i = 0 %>
  12. <% order_posts(site.posts).forEach(function(page) { %>
  13. <% i += 1 %>
  14. <% if(i == 1) { %>
  15. <div class="col-12">
  16. <a href="<%= url_for(page.path) %>" class="text-decoration-none">
  17. <div class="card">
  18. <img class="img-fluid" src="<%= `/images/hero/blog/${page.image.feature}` %>">
  19. <div class="card-body">
  20. <h5 class="card-title"><%= page.title %></h5>
  21. <p class="text-muted">
  22. <i><%= timeAgo(new Date(page.date)) %></i>
  23. </p>
  24. </div>
  25. </div>
  26. </a>
  27. </div>
  28. <% } else if (i == 2 || i == 3) { %>
  29. <div class="col-6">
  30. <div class="card">
  31. <a href="<%= url_for(page.path) %>" class="text-decoration-none">
  32. <img class="img-fluid" src="<%= `/images/thumbnails/blog/${page.image.feature}` %>">
  33. <div class="card-body">
  34. <h5 class="card-title"><%= page.title %></h5>
  35. <p class="text-muted">
  36. <i><%= timeAgo(new Date(page.date)) %></i>
  37. </p>
  38. </div>
  39. </a>
  40. </div>
  41. </div>
  42. <% } else { %>
  43. <div class="col-4">
  44. <div class="card">
  45. <a href="<%= url_for(page.path) %>" class="text-decoration-none">
  46. <img class="img-fluid" src="<%= `/images/thumbnails/blog/${page.image.feature}` %>">
  47. <div class="card-body">
  48. <h5 class="card-title"><%= page.title %></h5>
  49. <p class="text-muted">
  50. <i><%= timeAgo(new Date(page.date)) %></i>
  51. </p>
  52. </div>
  53. </a>
  54. </div>
  55. </div>
  56. <% } %>
  57. <% }) %>
  58. </div>
  59. </div>
  60. <%- partial('_partial/about-author') %>
  61. <%- partial('_partial/contact-form') %>