hugoWebsite/layouts/_default/about.html

31 lines
1.8 KiB
HTML

{{define "main"}}
<main>
<header class="mb-4 bg-primary-600">
<span class="py-96">
<h1 class="py-16 text-5xl font-black text-center text-white">
{{ .Title }}
</h1>
</span>
</header>
<div class="max-w-4xl px-6 pt-6 pb-16 mx-auto prose dark:prose-invert dark:text-white">
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
<h2>{{ .Params.people_heading }}</h2>
<p>{{ .Params.people_text }}</p>
<div class="container flex flex-wrap justify-center">
{{range .Site.Data.people }}
<div class="max-w-sm w-1/2 md:w-1/3 px-2">
<div class="bg-white relative shadow-lg hover:shadow-xl transition duration-500 rounded-lg">
<img class="rounded-t-lg" src="https://images.unsplash.com/photo-1583511655857-d19b40a7a54e?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1049&q=80" alt="" />
<div class="py-6 px-8 rounded-lg bg-white">
<h1 class="text-gray-700 font-bold text-2xl mb-3 hover:text-gray-900 hover:cursor-pointer">{{ .name }}</h1>
<p class="text-gray-700 tracking-wide">{{ T .role }}</p>
<p class="text-gray-700 tracking-wide">Lorem ipsum dolor sit amet consectetur, adipisicing elit.</p>
</div>
</div>
</div>
{{end}}
</div>
</div>
</main>
{{end}}