113 lines
3.7 KiB
Twig
113 lines
3.7 KiB
Twig
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}{{ 'home.title'|trans }}{% endblock %}
|
|
|
|
{% block head_extra %}
|
|
{% include '_leaflet_head.html.twig' %}
|
|
{% include '_datepicker_head.html.twig' %}
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
|
|
<!-- MAP HERO — light: nearest ~20 events, refines once you share your location -->
|
|
<section class="section" style="padding:0;">
|
|
<div class="wrap">
|
|
<p class="eyebrow" style="margin-bottom:8px;"></p>
|
|
<div class="section-head">
|
|
<h1 style="font-size:clamp(28px,4vw,40px);">{{ 'home.hero.title'|trans }}</h1>
|
|
<a href="{{ path('map') }}" class="btn btn-primary btn-sm">{{ 'home.hero.map_link'|trans }}</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="section" style="padding:0;">
|
|
{% include '_map_stage.html.twig' with { compact: true } %}
|
|
</section>
|
|
|
|
<!-- BROWSE EVENTS -->
|
|
<section class="section">
|
|
<div class="wrap">
|
|
<div class="section-head">
|
|
<div>
|
|
<p class="eyebrow" style="margin-bottom:8px;">{{ 'home.browse.eyebrow'|trans }}</p>
|
|
<h2>{{ 'home.browse.title'|trans }}</h2>
|
|
</div>
|
|
<a href="{{ path('event_list') }}" class="section-link">{{ 'home.browse.all'|trans }}</a>
|
|
</div>
|
|
<div class="chip-row">
|
|
{% for category in popularCategories %}
|
|
<a href="{{ path('event_list', {category: category}) }}" class="chip">{{ category }}</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- THIS WEEK -->
|
|
<section class="section" style="background:var(--paper-dim);">
|
|
<div class="wrap">
|
|
<div class="section-head">
|
|
<div>
|
|
<p class="eyebrow" style="margin-bottom:8px;">{{ 'home.recent.eyebrow'|trans }}</p>
|
|
<h2>{{ 'home.recent.title'|trans }}</h2>
|
|
</div>
|
|
<a href="{{ path('event_list') }}" class="section-link">{{ 'home.browse.all'|trans }}</a>
|
|
</div>
|
|
<div class="card-grid">
|
|
{% for event in upcomingEvents %}
|
|
{% include 'events/_card.html.twig' with { event: event } %}
|
|
{% else %}
|
|
<p style="color:var(--muted);">{{ 'home.recent.empty'|trans }}</p>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{% endblock %}
|
|
|
|
{% block footer %}
|
|
<div class="footer-grid">
|
|
<div>
|
|
<img src="{{ asset('images/vindn_logo_adobe.svg') }}" alt="VINDN" style="height:24px; margin-bottom:14px;">
|
|
<p style="max-width:260px; font-size:14px; color:var(--muted);">{{ 'home.footer.tagline'|trans }}</p>
|
|
</div>
|
|
<div>
|
|
<h4>{{ 'home.footer.explore'|trans }}</h4>
|
|
<ul>
|
|
<li><a href="{{ path('event_list') }}">{{ 'nav.browse'|trans }}</a></li>
|
|
<li><a href="{{ path('map') }}">{{ 'nav.map'|trans }}</a></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h4>{{ 'home.footer.organizers'|trans }}</h4>
|
|
<ul>
|
|
<li><a href="#">{{ 'home.footer.list_event'|trans }}</a></li>
|
|
<li><a href="#">{{ 'home.footer.pricing'|trans }}</a></li>
|
|
<li><a href="#">{{ 'home.footer.guidelines'|trans }}</a></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h4>{{ 'home.footer.company'|trans }}</h4>
|
|
<ul>
|
|
<li><a href="#">{{ 'home.footer.about'|trans }}</a></li>
|
|
<li><a href="#">{{ 'home.footer.contact'|trans }}</a></li>
|
|
<li><a href="#">{{ 'home.footer.privacy'|trans }}</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<span>© 2026 VINDN</span>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
{% include '_leaflet_scripts.html.twig' %}
|
|
{% include '_datepicker_scripts.html.twig' %}
|
|
<script type="application/json" id="map-data">{{ mapEventsJson|raw }}</script>
|
|
<script>
|
|
Vindn.initMapStage({
|
|
events: Vindn.readEmbeddedJson('map-data'),
|
|
limit: 20,
|
|
defaultCenter: [{{ centerLat }}, {{ centerLon }}]
|
|
});
|
|
</script>
|
|
{% endblock %}
|