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
30 lines
999 B
HTML
30 lines
999 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">
|
|
<time class="text-primary/80" datetime= "{{ time.Format ":date_long" .PublishDate }}"> {{ time.Format ":date_long" .PublishDate }}</time>
|
|
|
|
<h4 class="font-semibold mt-1 mb-3">
|
|
{{ .Title | markdownify }}
|
|
</h4>
|
|
|
|
<p class="line-clamp-2">
|
|
{{ .Description | markdownify}}
|
|
</p>
|
|
|
|
<!-- Read More -->
|
|
<a
|
|
href="{{ .RelPermalink }}"
|
|
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">
|
|
{{ T "read_more" | default "Read More" }}
|
|
</a>
|
|
</div>
|
|
</article>
|