DIA Frontend

Text and Icon 

<!-- ### Begin: Element texticon ### -->
<div id="c387" class="frame frame-default frame-type-texticon frame-layout-0 frame-background-none frame-no-backgroundimage frame-space-before-none frame-space-after-none facebook-special">
    <div class="frame-container">
        <div class="frame-inner">
            <div class="texticon texticon-right">
                <div class="texticon-icon texticon-size-awesome texticon-type-circle">
                    <span class="texticon-inner-icon" style="fill:#fff; background-color:#00ffff;">

                        <svg class="1" height="32px" width="32px">
                            <use href="../../common/img/svg/symbolSprite.svg#social-facebook-26x26"></use>
                        </svg>
                    </span>
                </div>
                <div class="texticon-content">

                    <header class="frame-header">
                        <h2 class="element-header">
                            Text and Icon
                        </h2>
                    </header>

                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nisi odio, lacinia ac rutrum vitae, consequat eget
                        quam. Curabitur ornare ipsum fringilla quam cursus, at condimentum sapien commodo. Mauris ac sagittis neque. Ut est
                        sem, venenatis eget velit vitae, pellentesque vehicula nunc. Aliquam risus magna, rutrum vel pharetra eget, luctus
                        id arcu. Cras vitae nunc pulvinar, tristique ipsum vitae, elementum magna. Praesent blandit ante ac placerat
                        tincidunt. Vestibulum et elit arcu. Mauris sit amet libero non risus feugiat mattis vitae ac metus.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- ### End: Element texticon ### -->
 
{% extends bodytext ? '@wrapper-frame' : '@wrapper-empty' %}

{% set CType = 'texticon' %}

{% block main %}
    <div class="texticon texticon-{{ icon_position }}">
        {% if icon or iconFile %}
            {% if header_link %}<a href="{{ header_link }}">{% endif %}
                <div class="texticon-icon texticon-size-{{ icon_size }} texticon-type-{{ icon_type }}">
                    {% if icon_type %}
                        {% set iconStyle = ' style="' %}
                        {% set iconColorAttr = iconFile ? 'color:' : 'fill:' %}
                        {% if icon_color %}
                            {% set iconStyle = iconStyle ~ iconColorAttr ~ icon_color ~ ';' %}
                        {% endif %}
                        {% if icon_background %}
                            {% set iconStyle = iconStyle ~ ' background-color:' ~ icon_background ~ ';' %}
                        {% endif %}
                        {% set iconStyle = iconStyle ~ '"' %}
                    {% endif %}
                    <span class="texticon-inner-icon"{{ iconStyle }}>
                        {% if iconFile %}
                            {{ iconFile }}
                        {% else %}
                            {% include '@atom-icon' %}
                        {% endif %}
                    </span>
                </div>
            {% if header_link %}</a>{% endif %}
        {% endif %}
        <div class="texticon-content">
            {% include '@atom-header' %}

            {% include template_from_string(bodytext) %}
        </div>
    </div>
{% endblock %}
 
{
  "bodytext": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nisi odio, lacinia ac rutrum vitae, consequat eget\nquam. Curabitur ornare ipsum fringilla quam cursus, at condimentum sapien commodo. Mauris ac sagittis neque. Ut est\nsem, venenatis eget velit vitae, pellentesque vehicula nunc. Aliquam risus magna, rutrum vel pharetra eget, luctus\nid arcu. Cras vitae nunc pulvinar, tristique ipsum vitae, elementum magna. Praesent blandit ante ac placerat\ntincidunt. Vestibulum et elit arcu. Mauris sit amet libero non risus feugiat mattis vitae ac metus.</p>\n",
  "categories": null,
  "CType": null,
  "customId": null,
  "date": null,
  "frame_class": null,
  "header": "Text and Icon",
  "header_color": null,
  "header_layout": 2,
  "header_link": null,
  "header_position": null,
  "header_style": null,
  "layout": null,
  "space_after_class": null,
  "space_before_class": null,
  "space_inner_after_class": null,
  "space_inner_before_class": null,
  "subheader": null,
  "target": null,
  "class": "facebook-special",
  "icon": "social-facebook-26x26",
  "height": "32px",
  "width": "32px",
  "icon_background": "#00ffff",
  "icon_color": "#fff",
  "icon_position": "right",
  "icon_type": "circle",
  "icon_size": "awesome"
}

No notes defined.