f8b297eaad
* replace Bootstrap-based styling with Tailwind CSS * update theme compatibility for latest Hugo version * refactor templates and partials * fix outdated code and broken components * improve project structure and maintainability * optimize styling and frontend build setup
28 lines
855 B
HTML
28 lines
855 B
HTML
<article class="relative group transition duration-300 hover:shadow-xl">
|
|
<!-- Image -->
|
|
{{ $image:= .Params.image }}
|
|
{{ if $image }}
|
|
{{ partial "image" (dict "Src" $image "Context" .Page "Alt" .Title "Class" "w-full") }}
|
|
{{ end }}
|
|
|
|
|
|
<!-- Content -->
|
|
<div
|
|
class="absolute bottom-0 w-full bg-tertiary p-6 transition-all duration-300 group-hover:pb-20">
|
|
<ul class="block text-primary mb-2">
|
|
<li>{{ delimit .Params.category ", " }}</li>
|
|
</ul>
|
|
|
|
<h4 class="font-semibold">
|
|
{{ .Title | markdownify }}
|
|
</h4>
|
|
|
|
<!-- Read More -->
|
|
<a
|
|
href="{{ .Permalink }}"
|
|
class="absolute bottom-6 left-6 w-full opacity-0 translate-y-5 transition-all duration-300 group-hover:opacity-100 group-hover:translate-y-0 hover:text-primary hover:underline">
|
|
{{ .Params.button_label }}
|
|
</a>
|
|
</div>
|
|
</article>
|