72 lines
3.1 KiB
Twig
72 lines
3.1 KiB
Twig
<section id="intro">
|
|
<div class="container intro-section">
|
|
<div class="section-title">
|
|
<h2 class="title-text">{{ getLocalizedStr('intro.title') }}</h2>
|
|
</div>
|
|
<div class="intro">
|
|
<div class="intro-text">
|
|
{{ getLocalizedStr('intro.description') | formatMd | raw }}
|
|
<div class="intro-interests chips">
|
|
<div class="intro-interests-header">
|
|
<p>
|
|
{{ getLocalizedStr('intro.interests') }}
|
|
</p>
|
|
</div>
|
|
{% for interest in interests %}
|
|
<div class="item chip chip-with-icon chip-outline">
|
|
<div class="chip-icon">
|
|
{{ source('@imgs/icons/'~interest.icon) }}
|
|
</div>
|
|
{{ getDynLocalizedStr(interest.name) }}
|
|
</div>
|
|
{% endfor %}
|
|
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<ul class="intro-items">
|
|
<li class="intro-item item-age">
|
|
<div class="item-icon">
|
|
{{ source('@imgs/icons/cake.svg') }}
|
|
</div>
|
|
<div class="item-content">
|
|
{{ getLocalizedStr('intro.age') | format(age) }}
|
|
</div>
|
|
</li>
|
|
<li class="intro-item item-location">
|
|
<div class="item-icon">
|
|
{{ source('@imgs/icons/map-pin.svg') }}
|
|
</div>
|
|
<div class="item-content">
|
|
{{ getLocalizedStr('intro.location') }}
|
|
{{ getDynLocalizedStr(location.region.name) }}
|
|
</div>
|
|
</li>
|
|
<li class="intro-item item-languages">
|
|
<div class="item-icon">
|
|
{{ source('@imgs/icons/flag.svg') }}
|
|
</div>
|
|
<div class="item-content">
|
|
{{ getLocalizedStr('intro.speak') }}
|
|
<ul>
|
|
{% for locale in languages %}
|
|
<li>{{ getLocalizedStr(locale.long) }}{% if not loop.last %},{% endif %}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
<li class="intro-item item-transport">
|
|
<div class="item-icon">
|
|
{{ source('@imgs/icons/bike.svg') }}
|
|
</div>
|
|
<div class="item-content">
|
|
{{ getLocalizedStr('intro.transport') | format(getDynLocalizedStr(transport.name)) }}
|
|
</div>
|
|
</li>
|
|
<!-- items: age, location, languages spoke, interests, transport method, -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|