{% extends 'base.html.twig' %}
{% block title %}Rutas{% endblock %}
{% block body %}
{{ include('components/home_navbar/header.html.twig') }}
<div class="row" style="margin-top: 60px;">
<div class="col-sm-12">
<div class="panel panel-primary">
<div class="panel-body" style="overflow-x: auto;">
<h1 style="text-align: center;">{{ ruta.getNombreRuta }}</h1>
<div class="col-md-12">
<iframe src="{{ ruta.getGoogleMaps }}" width="100%" height="530px" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
<div class="col-md-12">
<h2 class="osLight" style="font-weight: bold; text-align: center;">Restaurantes</h2>
<div class="row pb40">
{% if restaurantes %}
{% for sitio in restaurantes %}
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
<a href="{{ path('sitio_individual', {'id': sitio.getIdRestaurante.getId }) }}" class="propWidget-2">
<div class="fig">
<img src="{{ asset('uploads/imagen_principal/') }}{{ sitio.getIdRestaurante.getImagenPrincipal }}" alt="{{ sitio.getIdRestaurante.getNombre }}">
<img class="blur" src="{{ asset('uploads/imagen_principal/') }}{{ sitio.getIdRestaurante.getImagenPrincipal }}" alt="{{ sitio.getIdRestaurante.getNombre }}">
<div class="opac"></div>
</div>
</a>
</div>
{% endfor %}
{% else %}
<div class="col-xs-12 col-sm-6 col-md-12 col-lg-12">
<h2>Sin Resultados</h2>
</div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}