grav-theme-libretic/templates/modular/portfolio.html.twig

55 lines
2.1 KiB
Twig
Raw Normal View History

2015-01-28 00:55:56 +01:00
<div class="modular-row portfolio">
2015-01-28 09:34:29 +01:00
{{ content }}
2015-01-28 00:55:56 +01:00
{% if page.header.portfolio %}
<div class="notebooks">
2015-01-28 09:34:29 +01:00
{% for row in page.header.portfolio|batch(4) %}
<div class="notebook-row">
{% for portfolio in row %}
<div class="notebook">
<div class="desc">
<h4>{{ portfolio.title }}</h4>
<p>{{ portfolio.desc }}</p>
</div>
<a href="#portfolioModal{{ portfolio.modalid }}" class="portfolio-link" data-toggle="modal">
<div class='screen'><div class="screen-content" style="background-image: url({{ page.media[portfolio.image].url }})" ></div><div class="screen-content-hover"><i class="fa fa-plus-square"></i></div></div>
</a>
2015-01-28 09:34:29 +01:00
<div class='keyboard'></div>
</div>
{% endfor %}
2015-01-28 00:55:56 +01:00
</div>
{% endfor %}
</div>
{% endif %}
</div>
2015-01-28 00:55:56 +01:00
{% for portfolio in page.header.portfolio %}
<div class="portfolio-modal modal" id="portfolioModal{{ portfolio.modalid }}" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-content">
<div class="close-modal" data-dismiss="modal"><i class="fa fa-times"></i></div>
<div class="modal-body">
<h1>{{ portfolio.title }}</h1>
<img src="{{ page.media[portfolio.image].url }}" class="img-responsive img-centered" alt="{{ portfolio.alt }}">
<p>{{ portfolio.desc }}</p>
<ul class="client-details">
<li>Client:
<strong>
{{ portfolio.client }}
</strong>
</li>
<li>Date:
<strong>
{{ portfolio.date }}
</strong>
</li>
<li>Service:
<strong>
{{ portfolio.category }}
</strong>
</li>
</ul>
<button type="button" class="button" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
</div>
</div>
2015-01-28 00:55:56 +01:00
</div>
{% endfor %}