{% extends is_mobile.check ? '@templates/Mobile/Shop/layout.html.twig' : '@templates/Front/Shop/layout.html.twig' %}
{% block content %}
{% block breadcrumb %}
{% endblock %}
<button id="toggleButton" class="d-lg-none d-md-block">
<i class="fa fa-bars menu-icon"></i>
<i class="fa fa-times close-icon d-none"></i>
</button>
<div class="row">
<div class="col-12 col-md-4 col-lg-3 mb-4 menu d-none d-md-block">
{{ sonata_block_render_event('sylius.shop.account.layout.before_menu') }}
{{ knp_menu_render('sylius.shop.account', {'template': '@SyliusShop/Menu/simple.html.twig'}) }}
{{ sonata_block_render_event('sylius.shop.account.layout.after_menu') }}
</div>
<div class="col-12 col-md-8 col-lg-9">
{{ sonata_block_render_event('sylius.shop.account.layout.before_subcontent') }}
{% block subcontent %}
{% endblock %}
{{ sonata_block_render_event('sylius.shop.account.layout.after_subcontent') }}
</div>
</div>
<style>
#toggleButton {
float: right;
display: block;
margin-top: -20px;
border: 1px solid;
margin-right: 10px;
}
</style>
<script>
$('#toggleButton').on('click', function() {
$('.menu').toggleClass('d-none');
$('.menu-icon').toggleClass('d-none');
$('.close-icon').toggleClass('d-none');
})
</script>
{% endblock %}