|
|
|
|
@ -1,62 +1,31 @@ |
|
|
|
|
{% if banner %} |
|
|
|
|
<div class="banner {% if banner.color %}banner_colored{% endif %} {% if banner.future_date %}banner_countdown{% endif %}" |
|
|
|
|
data-banner="{{banner.id}}" style="display: none; background-color: {{ banner.color|default:'white' }};"> |
|
|
|
|
<div class="banner__bg" style=" |
|
|
|
|
{% if not request.user_agent.is_mobile or banner.future_date %} |
|
|
|
|
background-image: url({{ banner.image.url }}); |
|
|
|
|
{% endif %} |
|
|
|
|
{% if request.user_agent.is_mobile and banner.future_date %} |
|
|
|
|
opacity: 0.7; |
|
|
|
|
{% endif %} |
|
|
|
|
{% if banner.stretch_image %} |
|
|
|
|
background-position: center; |
|
|
|
|
background-size: cover; |
|
|
|
|
{% else %} |
|
|
|
|
background-position: center bottom; |
|
|
|
|
{% endif %}"></div> |
|
|
|
|
{% if request.user_agent.is_mobile %} |
|
|
|
|
{% if not banner.future_date %} |
|
|
|
|
<a href="{{ banner.url }}" class="banner__image-wrap"> |
|
|
|
|
<img class="banner__image" src="{{ banner.image.url }}" /> |
|
|
|
|
</a> |
|
|
|
|
{% endif %} |
|
|
|
|
<div class="banner" |
|
|
|
|
data-banner="{{banner.id}}" style="display: none; |
|
|
|
|
background: {{ banner.color|default:'white' }}; |
|
|
|
|
{% if banner.color2 %} |
|
|
|
|
background: -moz-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%); |
|
|
|
|
background: -webkit-gradient(left top, right bottom, color-stop(0%, {{ banner.color }}), color-stop(100%, {{ banner.color2 }})); |
|
|
|
|
background: -webkit-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%); |
|
|
|
|
background: -o-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%); |
|
|
|
|
background: -ms-linear-gradient(-45deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%); |
|
|
|
|
background: linear-gradient(135deg, {{ banner.color }} 0%, {{ banner.color2 }} 100%); |
|
|
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{{ banner.color }}', endColorstr='{{ banner.color2 }}', GradientType=1 ); |
|
|
|
|
{% endif %}"> |
|
|
|
|
<div class="banner__content"> |
|
|
|
|
<div class="banner__content-center"> |
|
|
|
|
<div class="banner__text-column"> |
|
|
|
|
<div class="banner__text">{{ banner.text }}</div> |
|
|
|
|
{% if not banner.future_date %} |
|
|
|
|
<div class="banner__text">{{ banner.text|safe }}</div> |
|
|
|
|
{% if banner.url %} |
|
|
|
|
<a href="{{ banner.url }}" class="banner__link">{{ banner.button_text }}</a> |
|
|
|
|
{% endif %} |
|
|
|
|
</div> |
|
|
|
|
<div class="banner__image-column"> |
|
|
|
|
<img src="{{ banner.image.url }}"/> |
|
|
|
|
|
|
|
|
|
{% if banner.future_date %} |
|
|
|
|
<div class="banner__countdown-column"> |
|
|
|
|
<div> |
|
|
|
|
<div class="banner__countdown-wrap"> |
|
|
|
|
<div class="banner__countdown-title">До конца акции осталось</div> |
|
|
|
|
<countdown date="{{ banner.future_date|date:'Y-m-d H:i:s' }}"></countdown> |
|
|
|
|
</div> |
|
|
|
|
<div> |
|
|
|
|
<a href="{{ banner.url }}" class="banner__link">{{ banner.button_text }}</a> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
{% else %} |
|
|
|
|
<div class="banner__content"> |
|
|
|
|
<div class="banner__content-center"> |
|
|
|
|
<div class="banner__text-column"> |
|
|
|
|
<div class="banner__text">{{ banner.text }}</div> |
|
|
|
|
<a href="{{ banner.url }}" class="banner__link">{{ banner.button_text }}</a> |
|
|
|
|
</div> |
|
|
|
|
{% if banner.future_date %} |
|
|
|
|
<div class="banner__countdown-column"> |
|
|
|
|
<div class="banner__countdown-title">До конца акции осталось</div> |
|
|
|
|
<countdown date="{{ banner.future_date|date:'Y-m-d H:i:s' }}"></countdown> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
<a href="#" class="banner__hide">Скрыть{% if not request.user_agent.is_mobile %} баннер{% endif %}</a> |
|
|
|
|
</div> |
|
|
|
|
{% endif %} |
|
|
|
|
|