APA Component Library

Image 

<div class="relative h-full w-full ">
    <img class="" src="/image/placeholder.jpg" alt="Alternativer Text" />

</div>
 
{% set src = src|default('/image/placeholder.jpg') %}
{% set alt = alt %}
{% set overlay = overlay %}
{% set classes = classes %}
{% set height = height|default('h-full') %}
{% set weight = weight|default('w-full') %}

{% set overlays = {
    'overlay-gradient': 'bg-gray-600 opacity-80 md:bg-gradient-to-b md:from-transparent md:to-gray-700 md:opacity-90 md:bg-transparent h-full',
    'overlay-default': 'bg-gray-600 opacity-80 h-full'
} %}

{% if src %}
    <div class="relative {{ height }} {{ weight }} ">
        <img class="{{ classes }}" src="{{ src }}" alt="{{ alt }}" />

        {% if overlay or overlays[overlay] %}
            <div class="absolute bottom-0 left-0 w-full pointer-events-none h-full {{ overlay ? overlays[overlay] : '' }}"></div>
        {% endif %} 
    </div>
{% endif %}
 
{
  "src": "/image/placeholder.jpg",
  "alt": "Alternativer Text",
  "heightMax": false
}

No notes defined.