web2019/templates/shortcodes/layout_funding.html

{% if position == "left" %}

<div class="card mb-3 shadow" style="max-width: 80%;margin-right: 20%;" itemscope itemtype="https://schema.org/Grant">
    <div class="row g-0">
        <div class="col-md-4 funding-logo-start d-flex p-1 justify-content-center">
            {% if logo %}
                {% if logo_link %}<a href="{{ logo_link | safe }}" class="align-self-center" itemprop="url">{% endif %}
                    <img src="{{ logo | safe }}" class="img-fluid rounded" alt="{{ logo_alt }}" itemprop="image"/>
                {% if logo_link %}</a>{% endif %}
            {% endif %}
        </div>
        <div class="col-md-8">
            <div class="card-body">
                {% if title %}<h5 class="card-title" itemprop="sponsor">{{ title | markdown | safe }}</h5>{% endif %}
                {% if icon %}
                    <span class="badge bg-transparent position-absolute top-0 start-100 translate-middle-x">
                        <img src="{{ icon | safe }}" alt="{{ icon }}" class="rounded"
                             style="height: 2rem;"/>
                    </span>
                {% endif %}
                <div class="card-text" itemprop="description">{{ body | markdown | safe }}</div>
            </div>
        </div>
    </div>
</div>

{% elif position == "right" %}

<div class="card mb-3 shadow" style="max-width: 80%;margin-left: 20%;" itemscope itemtype="https://schema.org/Grant">
    <div class="row g-0">
        <div class="col-md-8">
            <div class="card-body">
                {% if title %}<h5 class="card-title text-end" itemprop="sponsor">{{ title | markdown | safe }}</h5>{% endif %}
                {% if icon %}
                    <span class="badge bg-transparent position-absolute top-0 start-0 translate-middle-x">
                        <img src="{{ icon | safe }}" alt="{{ icon }}" class="rounded"
                     style="height: 2rem;"/>
                    </span>
                {% endif %}
                <div class="card-text" itemprop="description">{{ body | markdown | safe }}</div>
            </div>
        </div>
        <div class="col-md-4 funding-logo-end d-flex p-1 justify-content-center">
            {% if logo %}
                {% if logo_link %}<a href="{{ logo_link | safe }}" class="align-self-center" itemprop="url">{% endif %}
                    <img src="{{ logo | safe }}" class="img-fluid rounded" alt="{{ logo_alt }}" itemprop="image" />
                {% if logo_link %}</a>{% endif %}
            {% endif %}
        </div>
    </div>
</div>

{% else %}

<div class="card mb-3 shadow-sm" style="max-width: 100%;" itemscope itemtype="https://schema.org/Poster">
    <div class="row g-0">
        <div class="col-md-12">
            <div class="card-body">
                {% if title %}<h4 class="card-title text-center" itemprop="headline">{{ title | markdown | safe }}</h4>{% endif %}
                <div class="card-text" itemprop="description">{{ body | markdown | safe }}</div>
            </div>
        </div>
    </div>
</div>

{% endif %}