www_mycelium/templates/shortcodes/feature_card.html
2025-05-24 21:04:08 +03:00

39 lines
1.1 KiB
HTML

{% set title = title | default(value="Feature") %}
{% set description = description | default(value="") %}
{% set link = link | default(value="") %}
{% set icon = icon | default(value="") %}
{% set bg_color = bg_color | default(value="bg-white") %}
{% set hover_color = hover_color | default(value="hover:bg-gray-50") %}
<div class="card relative shadow rounded-lg p-4 transition-all duration-300">
{% if icon %}
<div class="flex items-center justify-center h-12 w-12 rounded-md mb-4">
<img src="{{ icon | safe }}" class="">
</div>
{% endif %}
<h3 class="text-lg font-medium">{{ title }}</h3>
{% if description %}
<p class="my-2 text-base font-light">{{ description }}</p>
{% endif %}
{% if link %}
<a href="{{ link }}" class="text-sm font-semibold hover:text-gray-700">{{ link_name }} <span aria-hidden="true"></span></a>
{% endif %}
{% if caller %}
<div class="mt-4">
{{ caller() }}
</div>
{% endif %}
</div>
<style scop>
p{
font-weight: 200;
}
body.dark-mode .card {
background-color: rgba(82, 82, 82, 50%) !important;
}
</style>