86 lines
3.4 KiB
Text
86 lines
3.4 KiB
Text
---js
|
|
{
|
|
pagination: {
|
|
data: "collections.all",
|
|
size: 5,
|
|
alias: "posts",
|
|
before: function(posts) {
|
|
return posts.sort((postA, postB) => new Date(postB.date) - new Date(postA.date));
|
|
},
|
|
},
|
|
}
|
|
---
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{{ title }}</title>
|
|
<link rel="stylesheet" href="/main.css" />
|
|
</head>
|
|
<body>
|
|
|
|
<div class="relative bg-slate-700 pt-16 pb-20 px-4 sm:px-6 lg:pt-24 lg:pb-28 lg:px-8">
|
|
<div class="absolute inset-0">
|
|
<div class="bg-slate-900 h-1/5 sm:h-2/5"></div>
|
|
</div>
|
|
<div class="relative max-w-7xl mx-auto">
|
|
<div class="prose lg:prose-xl prose-invert m-auto text-center">
|
|
{{ content | safe }}
|
|
</div>
|
|
<div class="mt-12 max-w-lg mx-auto grid gap-5 lg:grid-cols-3 lg:max-w-none">
|
|
{%- for post in posts -%}
|
|
<div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
|
|
<div class="flex-shrink-0">
|
|
<img class="h-48 w-full object-cover" src="https://images.unsplash.com/photo-1492724441997-5dc865305da7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1679&q=80" alt="">
|
|
</div>
|
|
<div class="flex-1 bg-white p-6 flex flex-col justify-between">
|
|
<div class="flex-1">
|
|
<p class="text-sm font-medium text-indigo-600">
|
|
<a href="#" class="hover:underline">
|
|
Case Study
|
|
</a>
|
|
</p>
|
|
<a href="#" class="block mt-2">
|
|
<h3 class="text-xl font-semibold text-gray-900">
|
|
{{ post.data.title }}
|
|
</h3>
|
|
<p class="mt-3 text-base text-gray-500">
|
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint harum rerum voluptatem quo recusandae magni placeat saepe molestiae, sed excepturi cumque corporis perferendis hic.
|
|
</p>
|
|
</a>
|
|
</div>
|
|
<div class="mt-6 flex items-center">
|
|
<div class="flex-shrink-0">
|
|
<a href="#">
|
|
<span class="sr-only">Daniela Metz</span>
|
|
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1487412720507-e7ab37603c6f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
|
</a>
|
|
</div>
|
|
<div class="ml-3">
|
|
<p class="text-sm font-medium text-gray-900">
|
|
<a href="#" class="hover:underline">
|
|
Daniela Metz
|
|
</a>
|
|
</p>
|
|
<div class="flex space-x-1 text-sm text-gray-500">
|
|
<time datetime="2020-02-12">
|
|
Feb 12, 2020
|
|
</time>
|
|
<span aria-hidden="true">
|
|
·
|
|
</span>
|
|
<span>
|
|
11 min read
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{%- endfor -%}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|