hmc_site_source/layouts/partials/components/card_grid.html

26 lines
1.0 KiB
HTML

{{ with .card_grid }}
<div class="container mx-auto px-4">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
{{ $card_class := .card_class }}
{{ $card_title_class := .card_title_class }}
{{ $card_subtitle_class := .card_subtitle_class }}
{{ $card_bottom_text_class := .card_bottom_text_class }}
{{ range $i, $option := .cards }}
<div class="{{ $card_class }}"
{{ if $option.modal_target }}
data-modal-show="{{ $option.modal_target }}"
{{ end }}>
<img src="{{ $option.img }}" alt="$option.alt" class="w-full h-48 object-cover">
<div class="p-6">
<h3 class="{{ $card_title_class }} {{ $option.title_class }}">{{ $option.title }}</h3>
<p class="{{ $card_subtitle_class }} {{ $option.subtitle_class }}">{{ $option.subtitle | markdownify }}</p>
{{ if $option.bottom_text }}
<p class="{{ $card_bottom_text_class}} {{ $option.bottom_text_class }}">{{ $option.bottom_text }}</p>
{{ end }}
</div>
</div>
{{ end }}
</div>
</div>
{{ end }}