tours: use form categories images as background (#30944)
This commit is contained in:
parent
11e2e2a1fb
commit
701e0c56e6
|
@ -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;
|
||||
|
|
|
@ -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 %}
|
Loading…
Reference in New Issue