{% set thumbSize = 100 %} {% set thumbSize2X = 200 %}
{% set thumbCss = '' %} {% set hiResThumbCss = '' %} {% for file in files %} {% if file.kind == 'image' %} {% if file.width > file.height %} {% set thumbWidth = thumbSize %} {% set thumbHeight = (thumbSize / file.width) * file.height %} {% else %} {% set thumbHeight = thumbSize %} {% set thumbWidth = (thumbSize / file.height) * file.width %} {% endif %} {% set topMargin = (thumbSize - thumbHeight) // 2 %} {% set bottomMargin = thumbSize - thumbHeight - topMargin %} {% set leftMargin = (thumbSize - thumbWidth) // 2 %} {% set rightMargin = thumbSize - thumbWidth - leftMargin %} {% set thumbCss = thumbCss ~'.thumb-wrapper.wrapper-'~file.id~' { margin: '~topMargin~'px '~rightMargin~'px '~bottomMargin~'px '~leftMargin~"px; }\n" %} {% set thumbCss = thumbCss ~ '.thumb-'~file.id~' { background-image: url('~file.getThumbUrl(thumbSize)~'); height: '~thumbHeight~'px; width: '~thumbWidth~"px;}\n" %} {% set hiResThumbCss = hiResThumbCss ~ '.thumb-'~file.id~' { background-image: url('~file.getThumbUrl(thumbSize2X)~'); background-size: '~thumbWidth~'px '~thumbHeight~"px; }\n" %} {% endif %} {% endfor %} {% includeCss thumbCss %} {% includeHiResCss hiResThumbCss %} {{ getHeadHtml() }}