{% sw_extends '@NdsRecipeManager/rcpmanager/page/detail.html.twig' %}
{% import "@NdsRecipeManager/rcpmanager/macro/elements.html.twig" as element %}
{% block recipe_detail_content %}
<div class="breadcrumb cms-breadcrumb container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb" itemscope="">
<li class="breadcrumb-item">
<a href="/Ratgeber/" class="breadcrumb-link " title="Ratgeber">
<link href="/Ratgeber/">
<span class="breadcrumb-title">Ratgeber</span>
</a>
<meta content="c0c12d827e83419290c94dcea4e770c8">
</li>
<div class="breadcrumb-placeholder">
{% sw_icon 'arrow-medium-right' style { 'size': 'fluid', 'pack': 'solid'} %}
</div>
<li class="breadcrumb-item">
<a href="/rezepte" class="breadcrumb-link" title="Rezepte">
<link href="/rezepte">
<span class="breadcrumb-title">Rezepte</span>
</a>
<meta content="0fe843ef52434f4491ce6678ff405042">
</li>
<div class="breadcrumb-placeholder">
{% sw_icon 'arrow-medium-right' style { 'size': 'fluid', 'pack': 'solid'} %}
</div>
<li class="breadcrumb-item" aria-current="page">
<div itemprop="item">
<div itemprop="name">{{ recipe.translated.name }}</div>
</div>
</li>
</ol>
</nav>
</div>
{% block recipe_detail_inner %}
<div class="recipe">
{% block recipe_detail_info %}
<div class="product-detail-content">
<div class="recipe-detail-main">
<div class="row">
<div class="col-12">
<h1 class="recipe-title">{{ recipe.translated.name }}</h1>
</div>
</div>
{% block recipe_detail_image %}
<div class="row">
<div class="col-12 col-lg-8">
<div class="recipe-detail-media">
{% if recipe.cover %}
{% set attributes = {
'class': 'img-fluid',
'alt': (recipe.media.translated.alt ?: recipe.media.fileName),
'title': (recipe.media.translated.title ?: recipe.media.fileName)
} %}
{% sw_thumbnails 'recipe-image-thumbnail' with {
media: recipe.cover,
sizes: {
"xs" : "500px",
"sm" : "315px",
"md" : "390px",
"lg" : "350px",
"xl" : "520px",
}
} %}
{% else %}
<div class="recipe-image-placeholder">
{% sw_icon 'placeholder' style {
'size': 'fluid'
} %}
</div>
{% endif %}
</div>
<div class="row">
<div class="col-6">
{% if recipe.preparationTime is not empty %}
<div class="prepare-duration">
<span class="circle">{{ recipe.preparationTime }}
{{ "minutes"|trans|sw_sanitize }}</span>
<span>Zubereitungszeit</span>
</div>
{% endif %}
</div>
<div class="col-6">
{% if recipe.difficulty is not empty %}
<div class="prepare-difficulty">
<span class="circle"><img src="{{ asset('bundles/ldscustom/spoon.png', 'asset') }}"></span>
<span>{{ recipe.difficulty.translated.name }}</span>
</div>
{% endif %}
</div>
</div>
{% block recipe_source%}
<div class="recipe-source">
{{ "source"|trans|sw_sanitize }}:
{{ app.request.uri }}
</div>
{% endblock %}
{% if recipe.description %}
{% block recipe_description %}
<p>{{ recipe.translated.description|sw_sanitize }}</p>
{% endblock %}
{% endif %}
{% if recipe.translated.preparation %}
{% block recipe_preperation %}
<div class="recipe-preparation">
<h2 class="mb-4 preparationTitle">{{ "preparation"|trans }}</h2>
<div class="preparation">
{{ recipe.translated.preparation|sw_sanitize }}
</div>
</div>
{% endblock %}
{% endif %}
{% if recipe.translated.subhead is defined %}
<div class="recipe-tipp">
{{"lds.recipe.tipp"|trans}}<br>
{{ recipe.translated.subhead }}
</div>
{% endif %}
{% if recipe.hasTags() %}
<div class="recipe-tags">
{% block recipe_assignment_tags %}
{% if recipe.hasTags() %}
<div class="col-auto">
<div class="product-detail-configurator-group">
<div class="product-detail-configurator-group-title">
{{ "tags"|trans }}
</div>
<div class="product-detail-configurator-options">
{% for tag in recipe.tags.elements|sort((a, b) => a.slug|lower > b.slug|lower) %}
<div class="product-detail-configurator-option">
<span class="product-detail-configurator-option-input is-combinable"></span>
<a href="{{ seoUrl('rcp.frontend.tag', { slug: tag.translated.slug }) }}" class="product-detail-configurator-option-label is-display-text">
{{ tag.translated.name }}
</a>
</div>
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% endblock %}
</div>
{% endif %}
<div class="recipe-category">
{% block recipe_assignment_category %}
{{parent()}}
{% endblock %}
</div>
</div>
<div class="col-12 col-lg-4">
<div class="recipe-sidebar">
{% if recipe.ingredients.elements %}
{% block recipe_ingredients %}
<div class="recipe-ingredients">
<h2 class="mb-4">{{ "ingredients"|trans|sw_sanitize }}</h2>
{% block recipe_ingredients_portion_calculator %}
{% if recipe.portionCalculatorActive %}
<template data-portion-calculator></template>
<div id="portionCalculator">
<p>
<label for="portionQuantity">
{{ 'portions'|trans|sw_sanitize }}
</label>
<input type="number" value="{{ recipe.portionQuantity }}" min="1" max="20" id="portionQuantity">
</p>
</div>
{% endif %}
{% endblock %}
{% block recipe_ingredients_table %}
<table class="table ingredients">
{% for ingredient in recipe.ingredients %}
{% if not ingredient.product %}
{{ element.ingredientTableRow(ingredient, recipe.portionQuantity) }}
{% endif %}
{% endfor %}
</table>
{% set availableProducts = 0 %}
{% for ingredient in recipe.ingredients %}
{% if ingredient.product.active %}
{% set availableProducts = availableProducts + 1 %}
{% endif %}
{% endfor %}
{% if config('NdsRecipeManager.config.addAllProductsToCart') && (availableProducts > 0) %}
<form action="{{ path('frontend.checkout.line-item.add') }}" method="post" data-add-to-cart="true">
{{ sw_csrf('frontend.checkout.line-item.add') }}
{% for ingredient in recipe.ingredients %}
{% if ingredient.product.active %}
<input type="hidden" name="redirectTo" value="frontend.cart.offcanvas">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][id]" value="{{ ingredient.product.id }}">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][type]" value="product">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][referencedId]" value="{{ ingredient.product.id }}">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][stackable]" value="1">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][removable]" value="1">
<input type="hidden" name="lineItems[{{ ingredient.product.id }}][quantity]" value="1">
<input type="hidden" name="product-name" value="{{ ingredient.product.name }}">
{% endif %}
{% endfor %}
<button class="btn btn-primary btn-sm addAllToCart">
{% sw_icon 'cart' style {
'color': 'light',
'size' : 'xs'
} %}
{{ 'addAllProductsToCart'|trans|sw_sanitize }}
</button>
</form>
{% endif %}
{% endblock %}
</div>
{% endblock %}
{% endif %}
{% block recipe_detail_print%}
<a onclick="window.print()" class="recipe-print">
<div class="mr-0">{% sw_icon('printer') %}</div>
{{ "print"|trans|sw_sanitize }}
</a>
{% endblock %}
</div>
</div>
</div>
{% endblock %}
<div class="row">
<div class="col-12 mt-5">
{% set prods = page.extensions.lds_recipe_data.data %}
{% set config = {
'title': {
'value': "lds.recipe.sliderTitle"|trans
},
'border': {
'value': false
},
'rotate': {
'value': false
},
'products': {
'value': prods
},
'boxLayout': {
'value': 'standard'
},
'elMinWidth': {
'value': '300px'
},
'navigation': {
'value': true
},
'displayMode': {
'value': 'minimal'
},
'verticalAlign': {
'value': 'top'
},
} %}
{% sw_include "@Storefront/storefront/element/cms-element-recipe-product-slider.html.twig" with {
sliderConfig: config,
element: {
'data': {
'products': {
elements: prods
}
},
type: 'product-slider'
}
} %}
</div>
</div>
</div>
</div>
{% endblock %}
</div>
{% if recipe.hasRelatedRecipes %}
{% block recipe_related_recipes %}
{{parent()}}
{% endblock %}
{% endif %}
{% endblock %}
{% endblock %}