tours: use form categories images as background (#30944)

This commit is contained in:
Serghei Mihai 2019-02-27 14:54:16 +01:00
parent 11e2e2a1fb
commit 701e0c56e6
2 changed files with 71 additions and 6 deletions

View File

@ -45,13 +45,39 @@ div#header {
}
}
#columns > div.wcsformsofcategorycell {
&.foldable {
h2 span {
box-sizing: border-box;
}
}
h2:first-child {
color: #000000;
font-size: 135%;
font-weight: bold;
border-bottom: 0;
text-align: center;
padding-bottom: 0;
position: relative;
height: 230px;
font-size: 1.25em;
font-weight: normal;
border: 0;
padding: 0.5rem 2rem 0.5rem 1rem;
line-height: 1;
color: #ffffff;
width: 100%;
margin: auto 1px;
background-repeat: no-repeat;
&::after {
bottom: 1ex;
}
span {
position: absolute;
background: rgba(0,0,0,0.75);
left: 0;
bottom: 0;
width: 100%;
padding: 0.5rem 2rem 0.5rem 1rem;
}
&:hover {
span {
background: rgba(0,0,0,0.85);
}
}
}
a {
color: #000000;

View File

@ -0,0 +1,39 @@
{% load assets i18n %}
{% block cell-content %}
{% block cell-header %}
{% get_asset "wcs:category:picture:"|add:cell.category_reference as asset %}
<h2{% if asset %} style="background-image: url('{% asset_url asset size="660x360" crop="center" %}')"{% endif %}><span>{{ title }}</span></h2>
{% if description %}
<div class="intro">
{{ description|safe }}
</div>
{% endif %}
{% endblock %}
<div class="wcs-forms-of-category-{{slug}}">
<ul>
{% for form in forms %}
<li class="{% if form.authentication_required %}required-authentication{% endif %}
{% for context in form.required_authentication_contexts %}required-{{context}}-authentication {% endfor %}
{% for keyword in form.keywords %}keyword-{{keyword|slugify}}{% endfor %}
{% if form.redirection %}is-redirection{% endif %}"
><a href="{{ form.url }}tryauth">{{ form.title }}</a>
{% if form.description %}<div class="description">{{ form.description|safe }}</div>{% endif %}
</li>
{% endfor %}
{% if more_forms %}
<li class="more-items"><a>+</a></li>
{% for form in more_forms %}
<li style="display: none" class="additional-form {% if form.authentication_required %}required-authentication{% endif %}
{% for context in form.required_authentication_contexts %}required-{{context}}-authentication {% endfor %}
{% for keyword in form.keywords %}keyword-{{keyword|slugify}}{% endfor %}
{% if form.redirection %}is-redirection{% endif %}"
><a href="{{ form.url }}tryauth">{{ form.title }}</a>
{% if form.description %}<div class="description">{{ form.description|safe }}</div>{% endif %}
</li>
{% endfor %}
{% endif %}
</ul>
</div>
{% endblock %}