<?php
use Twig\Environment;
use Twig\Error\LoaderError;
use Twig\Error\RuntimeError;
use Twig\Extension\SandboxExtension;
use Twig\Markup;
use Twig\Sandbox\SecurityError;
use Twig\Sandbox\SecurityNotAllowedTagError;
use Twig\Sandbox\SecurityNotAllowedFilterError;
use Twig\Sandbox\SecurityNotAllowedFunctionError;
use Twig\Source;
use Twig\Template;
/* includes/detailSnippet.html.twig */
class __TwigTemplate_13e69e189760bdc8b84dda5443470568 extends Template
{
private $source;
private $macros = [];
public function __construct(Environment $env)
{
parent::__construct($env);
$this->source = $this->getSourceContext();
$this->blocks = [
'content' => [$this, 'block_content'],
];
}
protected function doGetParent(array $context)
{
// line 1
return "layout/layout-snippet.html.twig";
}
protected function doDisplay(array $context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "includes/detailSnippet.html.twig"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "includes/detailSnippet.html.twig"));
$this->parent = $this->loadTemplate("layout/layout-snippet.html.twig", "includes/detailSnippet.html.twig", 1);
$this->parent->display($context, array_merge($this->blocks, $blocks));
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
}
// line 3
public function block_content($context, array $blocks = [])
{
$macros = $this->macros;
$__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
$__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "content"));
$__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "content"));
// line 4
echo " <section class=\"snippet-wrapper\">
<div class=\"snippet-container\">
";
// line 8
echo " <a class=\"x-btn\">
<form>
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
</form>
</a>
";
// line 27
echo " <div class=\"text\">
<div class=\"container\">
";
// line 30
if ((isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 30, $this->source); })())) {
// line 31
echo " <h1>";
echo $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "input", "headline", ["placeholder" => "Fachzeitschriften"]);
echo "</h1>
";
} elseif (( ! // line 32
(isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 32, $this->source); })()) && !twig_get_attribute($this->env, $this->source, $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "input", "headline"), "isEmpty", [], "method", false, false, false, 32))) {
// line 33
echo " <h1>";
echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "input", "headline"), "getData", [], "method", false, false, false, 33), "html", null, true);
echo "</h1>
";
}
// line 35
echo "
";
// line 36
if ((isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 36, $this->source); })())) {
// line 37
echo " ";
echo $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "wysiwyg", "snippetContent", ["height" => 200, "toolbarGroups" => [0 => ["name" => "basicstyles", "groups" => [0 => "basicstyles", 1 => "list", 2 => "links"]]]]);
// line 44
echo "
";
} elseif (( ! // line 45
(isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 45, $this->source); })()) && !twig_get_attribute($this->env, $this->source, $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "wysiwyg", "snippetContent"), "isEmpty", [], "method", false, false, false, 45))) {
// line 46
echo " ";
echo twig_get_attribute($this->env, $this->source, $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "wysiwyg", "snippetContent"), "getData", [], "method", false, false, false, 46);
echo "
";
}
// line 48
echo "
";
// line 50
echo " <form>
<a class=\"btn-snippet\">
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"215.129\" height=\"49.2\" viewBox=\"0 0 215.129 49.2\">
<g id=\"Gruppe_138\" transform=\"translate(312 -4274)\" style=\"isolation: isolate\">
<g id=\"Gruppe_84\" transform=\"translate(-312 4274)\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Gruppe_85\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Pfad_37\" fill=\"none\">
<path d=\"M25.1,0H190.031a24.853,24.853,0,0,1,25.1,24.6,24.853,24.853,0,0,1-25.1,24.6H25.1A24.853,24.853,0,0,1,0,24.6,24.853,24.853,0,0,1,25.1,0Z\" stroke=\"none\"/>
<path d=\"M 25.09840393066406 2 C 21.97430419921875 2 18.94509887695312 2.599117279052734 16.09489440917969 3.780704498291016 C 13.34346008300781 4.921352386474609 10.87266540527344 6.554058074951172 8.7510986328125 8.633499145507812 C 6.632339477539062 10.71017837524414 4.969451904296875 13.12705993652344 3.80865478515625 15.81700134277344 C 2.6085205078125 18.59811782836914 1.999984741210938 21.55314826965332 1.999984741210938 24.60000038146973 C 1.999984741210938 27.64685249328613 2.6085205078125 30.60188293457031 3.80865478515625 33.38299942016602 C 4.969451904296875 36.07294082641602 6.632339477539062 38.48982238769531 8.7510986328125 40.56650161743164 C 10.87266540527344 42.64594268798828 13.34346008300781 44.27864837646484 16.09489440917969 45.41929626464844 C 18.94509887695312 46.60088348388672 21.97430419921875 47.20000076293945 25.09840393066406 47.20000076293945 L 190.0306396484375 47.20000076293945 C 193.1547241210938 47.20000076293945 196.1839294433594 46.60088348388672 199.0341339111328 45.41929626464844 C 201.7855682373047 44.27864837646484 204.2563629150391 42.64594268798828 206.3779296875 40.56650161743164 C 208.4966888427734 38.48982238769531 210.1595458984375 36.07294082641602 211.3203430175781 33.38299942016602 C 212.5204772949219 30.60188293457031 213.1290130615234 27.64685249328613 213.1290130615234 24.60000038146973 C 213.1290130615234 21.55314826965332 212.5204772949219 18.59811782836914 211.3203430175781 15.81700134277344 C 210.1595458984375 13.12705993652344 208.4966888427734 10.71017837524414 206.3779296875 8.633499145507812 C 204.2563629150391 6.554058074951172 201.7855682373047 4.921352386474609 199.0341339111328 3.780704498291016 C 196.1839294433594 2.599117279052734 193.1547241210938 2 190.0306396484375 2 L 25.09840393066406 2 M 25.09840393066406 0 L 190.0306396484375 0 C 203.8921051025391 0 215.1290130615234 11.0137939453125 215.1290130615234 24.60000038146973 C 215.1290130615234 38.18620681762695 203.8921051025391 49.20000076293945 190.0306396484375 49.20000076293945 L 25.09840393066406 49.20000076293945 C 11.23692321777344 49.20000076293945 -1.52587890625e-05 38.18620681762695 -1.52587890625e-05 24.60000038146973 C -1.52587890625e-05 11.0137939453125 11.23692321777344 0 25.09840393066406 0 Z\" stroke=\"none\" fill=\"#000\"/>
</g>
<text id=\"_Zurück\" transform=\"translate(101.801 33.201)\" font-size=\"27\" font-family=\"LucidaGrande, Lucida Grande\"><tspan x=\"-60.818\" y=\"0\">←</tspan><tspan y=\"0\" xml:space=\"preserve\" font-family=\"MuseoSans-500, Museo Sans\" font-weight=\"500\"> Zurück</tspan></text>
</g>
</g>
</g>
</svg>
</a>
</form>
</div>
</div>
";
// line 76
echo " ";
if ((isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 76, $this->source); })())) {
// line 77
echo "
";
// line 78
echo $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "relations", "SnippetImages", ["types" => [0 => "object"], "title" => "Magazin Objekte Ablegen", "subtypes" => ["object" => [0 => "object"]], "classes" => [0 => "Magazin"]]);
// line 85
echo "
";
} elseif (( ! // line 87
(isset($context["editmode"]) || array_key_exists("editmode", $context) ? $context["editmode"] : (function () { throw new RuntimeError('Variable "editmode" does not exist.', 87, $this->source); })()) && !twig_get_attribute($this->env, $this->source, $this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "relations", "SnippetImages"), "isEmpty", [], "method", false, false, false, 87))) {
// line 88
echo "
<div class=\"images-container\">
<div class=\"images\">
";
// line 91
$context['_parent'] = $context;
$context['_seq'] = twig_ensure_traversable($this->extensions['Pimcore\Twig\Extension\DocumentEditableExtension']->renderEditable($context, "relations", "SnippetImages"));
$context['loop'] = [
'parent' => $context['_parent'],
'index0' => 0,
'index' => 1,
'first' => true,
];
if (is_array($context['_seq']) || (is_object($context['_seq']) && $context['_seq'] instanceof \Countable)) {
$length = count($context['_seq']);
$context['loop']['revindex0'] = $length - 1;
$context['loop']['revindex'] = $length;
$context['loop']['length'] = $length;
$context['loop']['last'] = 1 === $length;
}
foreach ($context['_seq'] as $context["_key"] => $context["img"]) {
// line 92
echo "
";
// line 94
echo " <a ";
if ((twig_get_attribute($this->env, $this->source, $context["img"], "getModal", [], "method", false, false, false, 94) != "true")) {
echo " ";
if (twig_get_attribute($this->env, $this->source, $context["img"], "getLink", [], "method", false, false, false, 94)) {
echo "href=\"";
echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["img"], "getLink", [], "method", false, false, false, 94), "getHref", [], "method", false, false, false, 94), "html", null, true);
echo "\"";
}
echo " target=\"";
echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["img"], "getLink", [], "method", false, false, false, 94), "getTarget", [], "method", false, false, false, 94), "html", null, true);
echo "\" ";
}
echo ">
<div class=\"";
// line 95
if (twig_get_attribute($this->env, $this->source, $context["img"], "video", [], "any", false, false, false, 95)) {
echo "teaser-video";
} else {
echo "teaser";
}
echo " ";
echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, (isset($context["document"]) || array_key_exists("document", $context) ? $context["document"] : (function () { throw new RuntimeError('Variable "document" does not exist.', 95, $this->source); })()), "getProperty", [0 => "Name"], "method", false, false, false, 95), "html", null, true);
echo "\">
<div class=\"image-container\">
";
// line 99
echo twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["img"], "getImage", [], "method", false, false, false, 99), "thumbnail", [0 => "SnippetTeaser"], "method", false, false, false, 99), "html", [], "method", false, false, false, 99);
echo "
";
// line 101
if (twig_get_attribute($this->env, $this->source, $context["img"], "video", [], "any", false, false, false, 101)) {
// line 102
echo " ";
echo twig_include($this->env, $context, "svg/play.html.twig");
echo "
";
}
// line 104
echo "
</div>
";
// line 108
echo " ";
if ((twig_get_attribute($this->env, $this->source, $context["img"], "getModal", [], "method", false, false, false, 108) == "true")) {
// line 109
echo "
";
// line 111
echo " ";
if (twig_get_attribute($this->env, $this->source, $context["img"], "video", [], "any", false, false, false, 111)) {
// line 112
echo " <div class=\"modal-video\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
<div class=\"video\">
<video controls>
<source src=\"";
// line 126
echo twig_escape_filter($this->env, twig_get_attribute($this->env, $this->source, $context["img"], "video", [], "any", false, false, false, 126), "html", null, true);
echo "\">
</video>
</div>
</div>
";
} else {
// line 132
echo " <div class=\"modal-image\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
";
// line 144
echo twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, twig_get_attribute($this->env, $this->source, $context["img"], "getImage", [], "method", false, false, false, 144), "thumbnail", [0 => "ModalImage"], "method", false, false, false, 144), "html", [], "method", false, false, false, 144);
echo "
</div>
";
}
// line 148
echo " ";
}
// line 149
echo "
</div>
</a>
";
++$context['loop']['index0'];
++$context['loop']['index'];
$context['loop']['first'] = false;
if (isset($context['loop']['length'])) {
--$context['loop']['revindex0'];
--$context['loop']['revindex'];
$context['loop']['last'] = 0 === $context['loop']['revindex0'];
}
}
$_parent = $context['_parent'];
unset($context['_seq'], $context['_iterated'], $context['_key'], $context['img'], $context['_parent'], $context['loop']);
$context = array_intersect_key($context, $_parent) + $_parent;
// line 154
echo " </div>
</div>
";
// line 158
echo " <form class=\"back-btn-form\">
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"215.129\" height=\"49.2\" viewBox=\"0 0 215.129 49.2\">
<g id=\"Gruppe_138\" transform=\"translate(312 -4274)\" style=\"isolation: isolate\">
<g id=\"Gruppe_84\" transform=\"translate(-312 4274)\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Gruppe_85\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Pfad_37\" fill=\"none\">
<path d=\"M25.1,0H190.031a24.853,24.853,0,0,1,25.1,24.6,24.853,24.853,0,0,1-25.1,24.6H25.1A24.853,24.853,0,0,1,0,24.6,24.853,24.853,0,0,1,25.1,0Z\" stroke=\"none\"/>
<path d=\"M 25.09840393066406 2 C 21.97430419921875 2 18.94509887695312 2.599117279052734 16.09489440917969 3.780704498291016 C 13.34346008300781 4.921352386474609 10.87266540527344 6.554058074951172 8.7510986328125 8.633499145507812 C 6.632339477539062 10.71017837524414 4.969451904296875 13.12705993652344 3.80865478515625 15.81700134277344 C 2.6085205078125 18.59811782836914 1.999984741210938 21.55314826965332 1.999984741210938 24.60000038146973 C 1.999984741210938 27.64685249328613 2.6085205078125 30.60188293457031 3.80865478515625 33.38299942016602 C 4.969451904296875 36.07294082641602 6.632339477539062 38.48982238769531 8.7510986328125 40.56650161743164 C 10.87266540527344 42.64594268798828 13.34346008300781 44.27864837646484 16.09489440917969 45.41929626464844 C 18.94509887695312 46.60088348388672 21.97430419921875 47.20000076293945 25.09840393066406 47.20000076293945 L 190.0306396484375 47.20000076293945 C 193.1547241210938 47.20000076293945 196.1839294433594 46.60088348388672 199.0341339111328 45.41929626464844 C 201.7855682373047 44.27864837646484 204.2563629150391 42.64594268798828 206.3779296875 40.56650161743164 C 208.4966888427734 38.48982238769531 210.1595458984375 36.07294082641602 211.3203430175781 33.38299942016602 C 212.5204772949219 30.60188293457031 213.1290130615234 27.64685249328613 213.1290130615234 24.60000038146973 C 213.1290130615234 21.55314826965332 212.5204772949219 18.59811782836914 211.3203430175781 15.81700134277344 C 210.1595458984375 13.12705993652344 208.4966888427734 10.71017837524414 206.3779296875 8.633499145507812 C 204.2563629150391 6.554058074951172 201.7855682373047 4.921352386474609 199.0341339111328 3.780704498291016 C 196.1839294433594 2.599117279052734 193.1547241210938 2 190.0306396484375 2 L 25.09840393066406 2 M 25.09840393066406 0 L 190.0306396484375 0 C 203.8921051025391 0 215.1290130615234 11.0137939453125 215.1290130615234 24.60000038146973 C 215.1290130615234 38.18620681762695 203.8921051025391 49.20000076293945 190.0306396484375 49.20000076293945 L 25.09840393066406 49.20000076293945 C 11.23692321777344 49.20000076293945 -1.52587890625e-05 38.18620681762695 -1.52587890625e-05 24.60000038146973 C -1.52587890625e-05 11.0137939453125 11.23692321777344 0 25.09840393066406 0 Z\" stroke=\"none\" fill=\"#000\"/>
</g>
<text id=\"_Zurück\" transform=\"translate(101.801 33.201)\" font-size=\"27\" font-family=\"LucidaGrande, Lucida Grande\"><tspan x=\"-60.818\" y=\"0\">←</tspan><tspan y=\"0\" xml:space=\"preserve\" font-family=\"MuseoSans-500, Museo Sans\" font-weight=\"500\"> Zurück</tspan></text>
</g>
</g>
</g>
</svg>
</form>
";
}
// line 179
echo " </div>
</section>
<script src=\"/assets/js/snippet.js\"></script>
<style>
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images {
width: 100%;
max-height: none;
overflow-x: hidden;
overflow-y: hidden;
scrollbar-width: auto;
}
}
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images-container {
height: calc(100vh - 200px);
max-height: none;
overflow-x: auto;
width: 60%;
}
}
@media (min-width: 992px) {
.snippet-wrapper .snippet-container .images a .teaser {
width: calc(50% - 10px);
max-width: none;
max-height: none;
}
}
.snippet-wrapper .snippet-container .images a .teaser-video img {
object-fit: contain !important;
height: 100%;
width: 100%;
display: block;
}
.video {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
}
@media (min-width: 992px) {
.video {
margin-top: 0;
}
}
.video video {
height: 100%;
max-height: 80%;
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container {
position: relative;
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container svg {
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
width: 80px;
height: auto;
transform: translate(-50%, -50%);
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container svg path {
fill: white;
}
.snippet-wrapper .snippet-container .images .modal-image {
z-index: 2;
}
.snippet-wrapper .snippet-container .images .modal-image.active {
display: block;
right: 0vw;
position: fixed;
top: 0;
height: calc(100vh);
width: calc(100vw - 15px);
padding: 10px;
}
.snippet-wrapper .snippet-container .images .modal-image.active svg {
top: 3%;
}
.snippet-wrapper .snippet-container .images .modal-video.active svg {
top: 3%;
position: absolute;
right: 50%;
transform: translateX(50%);
cursor: pointer;
}
.snippet-wrapper .snippet-container .images a .teaser-video {
height: fit-content;
cursor: pointer;
}
@media (min-width: 992px) {
.snippet-wrapper .snippet-container .images a .teaser-video {
width: calc(33% - 12px);
max-width: none;
max-height: none;
}
}
.snippet-wrapper .snippet-container .images .modal-video {
z-index: 2;
}
.snippet-wrapper .snippet-container .images .modal-video {
position: absolute;
top: 5%;
width: 99vw;
height: 95vh;
background-color: #F7F6F5;
display: none;
}
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images .modal-video {
right: 0vw;
}
}
.snippet-wrapper .snippet-container .images .modal-video.active {
display: block;
right: 0vw;
position: fixed;
top: 0;
height: 100vh;
width: 100vw;
padding: 10px;
}
</style>
";
$__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
$__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
}
public function getTemplateName()
{
return "includes/detailSnippet.html.twig";
}
public function isTraitable()
{
return false;
}
public function getDebugInfo()
{
return array ( 351 => 179, 328 => 158, 323 => 154, 305 => 149, 302 => 148, 295 => 144, 281 => 132, 272 => 126, 256 => 112, 253 => 111, 250 => 109, 247 => 108, 242 => 104, 236 => 102, 234 => 101, 229 => 99, 216 => 95, 201 => 94, 198 => 92, 181 => 91, 176 => 88, 174 => 87, 170 => 85, 168 => 78, 165 => 77, 162 => 76, 135 => 50, 132 => 48, 126 => 46, 124 => 45, 121 => 44, 118 => 37, 116 => 36, 113 => 35, 107 => 33, 105 => 32, 100 => 31, 98 => 30, 93 => 27, 73 => 8, 68 => 4, 58 => 3, 35 => 1,);
}
public function getSourceContext()
{
return new Source("{% extends 'layout/layout-snippet.html.twig' %}
{% block content %}
<section class=\"snippet-wrapper\">
<div class=\"snippet-container\">
{# mobile close button #}
<a class=\"x-btn\">
<form>
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
</form>
</a>
{# title, text, back button #}
<div class=\"text\">
<div class=\"container\">
{% if editmode %}
<h1>{{ pimcore_input('headline',{'placeholder':'Fachzeitschriften'}) }}</h1>
{% elseif not editmode and not pimcore_input('headline').isEmpty() %}
<h1>{{ pimcore_input('headline').getData() }}</h1>
{% endif %}
{% if editmode %}
{{ pimcore_wysiwyg(\"snippetContent\", {
\"height\": 200,
\"toolbarGroups\": [
{
\"name\": 'basicstyles',
\"groups\": [ 'basicstyles', 'list', \"links\"]
}
]}) }}
{% elseif not editmode and not pimcore_wysiwyg(\"snippetContent\").isEmpty() %}
{{ pimcore_wysiwyg(\"snippetContent\").getData() | raw }}
{% endif %}
{# back button #}
<form>
<a class=\"btn-snippet\">
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"215.129\" height=\"49.2\" viewBox=\"0 0 215.129 49.2\">
<g id=\"Gruppe_138\" transform=\"translate(312 -4274)\" style=\"isolation: isolate\">
<g id=\"Gruppe_84\" transform=\"translate(-312 4274)\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Gruppe_85\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Pfad_37\" fill=\"none\">
<path d=\"M25.1,0H190.031a24.853,24.853,0,0,1,25.1,24.6,24.853,24.853,0,0,1-25.1,24.6H25.1A24.853,24.853,0,0,1,0,24.6,24.853,24.853,0,0,1,25.1,0Z\" stroke=\"none\"/>
<path d=\"M 25.09840393066406 2 C 21.97430419921875 2 18.94509887695312 2.599117279052734 16.09489440917969 3.780704498291016 C 13.34346008300781 4.921352386474609 10.87266540527344 6.554058074951172 8.7510986328125 8.633499145507812 C 6.632339477539062 10.71017837524414 4.969451904296875 13.12705993652344 3.80865478515625 15.81700134277344 C 2.6085205078125 18.59811782836914 1.999984741210938 21.55314826965332 1.999984741210938 24.60000038146973 C 1.999984741210938 27.64685249328613 2.6085205078125 30.60188293457031 3.80865478515625 33.38299942016602 C 4.969451904296875 36.07294082641602 6.632339477539062 38.48982238769531 8.7510986328125 40.56650161743164 C 10.87266540527344 42.64594268798828 13.34346008300781 44.27864837646484 16.09489440917969 45.41929626464844 C 18.94509887695312 46.60088348388672 21.97430419921875 47.20000076293945 25.09840393066406 47.20000076293945 L 190.0306396484375 47.20000076293945 C 193.1547241210938 47.20000076293945 196.1839294433594 46.60088348388672 199.0341339111328 45.41929626464844 C 201.7855682373047 44.27864837646484 204.2563629150391 42.64594268798828 206.3779296875 40.56650161743164 C 208.4966888427734 38.48982238769531 210.1595458984375 36.07294082641602 211.3203430175781 33.38299942016602 C 212.5204772949219 30.60188293457031 213.1290130615234 27.64685249328613 213.1290130615234 24.60000038146973 C 213.1290130615234 21.55314826965332 212.5204772949219 18.59811782836914 211.3203430175781 15.81700134277344 C 210.1595458984375 13.12705993652344 208.4966888427734 10.71017837524414 206.3779296875 8.633499145507812 C 204.2563629150391 6.554058074951172 201.7855682373047 4.921352386474609 199.0341339111328 3.780704498291016 C 196.1839294433594 2.599117279052734 193.1547241210938 2 190.0306396484375 2 L 25.09840393066406 2 M 25.09840393066406 0 L 190.0306396484375 0 C 203.8921051025391 0 215.1290130615234 11.0137939453125 215.1290130615234 24.60000038146973 C 215.1290130615234 38.18620681762695 203.8921051025391 49.20000076293945 190.0306396484375 49.20000076293945 L 25.09840393066406 49.20000076293945 C 11.23692321777344 49.20000076293945 -1.52587890625e-05 38.18620681762695 -1.52587890625e-05 24.60000038146973 C -1.52587890625e-05 11.0137939453125 11.23692321777344 0 25.09840393066406 0 Z\" stroke=\"none\" fill=\"#000\"/>
</g>
<text id=\"_Zurück\" transform=\"translate(101.801 33.201)\" font-size=\"27\" font-family=\"LucidaGrande, Lucida Grande\"><tspan x=\"-60.818\" y=\"0\">←</tspan><tspan y=\"0\" xml:space=\"preserve\" font-family=\"MuseoSans-500, Museo Sans\" font-weight=\"500\"> Zurück</tspan></text>
</g>
</g>
</g>
</svg>
</a>
</form>
</div>
</div>
{# images or videos #}
{% if editmode %}
{{ pimcore_relations(\"SnippetImages\", {
\"types\": [\"object\"],
\"title\": \"Magazin Objekte Ablegen\",
\"subtypes\": {
\"object\": [\"object\"]
},
\"classes\": [\"Magazin\"]
}) }}
{% elseif not editmode and not pimcore_relations(\"SnippetImages\").isEmpty() %}
<div class=\"images-container\">
<div class=\"images\">
{% for img in pimcore_relations(\"SnippetImages\") %}
{# Magazin objects #}
<a {% if img.getModal() != \"true\" %} {% if img.getLink() %}href=\"{{ img.getLink().getHref() }}\"{% endif %} target=\"{{ img.getLink().getTarget() }}\" {% endif %}>
<div class=\"{% if img.video %}teaser-video{% else %}teaser{% endif %} {{ document.getProperty('Name') }}\">
<div class=\"image-container\">
{{ img.getImage().thumbnail('SnippetTeaser').html() | raw }}
{% if img.video %}
{{ include('svg/play.html.twig') }}
{% endif %}
</div>
{# modal #}
{% if img.getModal() == \"true\" %}
{# video or image #}
{% if img.video %}
<div class=\"modal-video\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
<div class=\"video\">
<video controls>
<source src=\"{{ img.video }}\">
</video>
</div>
</div>
{% else %}
<div class=\"modal-image\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\">
<g transform=\"translate(-103.765 0.235)\" style=\"isolation: isolate\">
<g transform=\"translate(103.765 -0.235)\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\">
<rect width=\"42\" height=\"42\" rx=\"21\" stroke=\"none\"/>
<rect x=\"1\" y=\"1\" width=\"40\" height=\"40\" rx=\"20\" fill=\"none\"/>
</g>
<text transform=\"translate(124.765 28.765)\" font-size=\"25\" font-family=\"ZapfDingbatsITC, Zapf Dingbats\"><tspan x=\"-9.528\" y=\"0\">✕</tspan></text>
</g>
</svg>
{{ img.getImage().thumbnail('ModalImage').html() | raw }}
</div>
{% endif %}
{% endif %}
</div>
</a>
{% endfor %}
</div>
</div>
{# back button #}
<form class=\"back-btn-form\">
<input type=\"button\" onclick=\"history.back()\">
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"215.129\" height=\"49.2\" viewBox=\"0 0 215.129 49.2\">
<g id=\"Gruppe_138\" transform=\"translate(312 -4274)\" style=\"isolation: isolate\">
<g id=\"Gruppe_84\" transform=\"translate(-312 4274)\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Gruppe_85\" style=\"mix-blend-mode: screen;isolation: isolate\">
<g id=\"Pfad_37\" fill=\"none\">
<path d=\"M25.1,0H190.031a24.853,24.853,0,0,1,25.1,24.6,24.853,24.853,0,0,1-25.1,24.6H25.1A24.853,24.853,0,0,1,0,24.6,24.853,24.853,0,0,1,25.1,0Z\" stroke=\"none\"/>
<path d=\"M 25.09840393066406 2 C 21.97430419921875 2 18.94509887695312 2.599117279052734 16.09489440917969 3.780704498291016 C 13.34346008300781 4.921352386474609 10.87266540527344 6.554058074951172 8.7510986328125 8.633499145507812 C 6.632339477539062 10.71017837524414 4.969451904296875 13.12705993652344 3.80865478515625 15.81700134277344 C 2.6085205078125 18.59811782836914 1.999984741210938 21.55314826965332 1.999984741210938 24.60000038146973 C 1.999984741210938 27.64685249328613 2.6085205078125 30.60188293457031 3.80865478515625 33.38299942016602 C 4.969451904296875 36.07294082641602 6.632339477539062 38.48982238769531 8.7510986328125 40.56650161743164 C 10.87266540527344 42.64594268798828 13.34346008300781 44.27864837646484 16.09489440917969 45.41929626464844 C 18.94509887695312 46.60088348388672 21.97430419921875 47.20000076293945 25.09840393066406 47.20000076293945 L 190.0306396484375 47.20000076293945 C 193.1547241210938 47.20000076293945 196.1839294433594 46.60088348388672 199.0341339111328 45.41929626464844 C 201.7855682373047 44.27864837646484 204.2563629150391 42.64594268798828 206.3779296875 40.56650161743164 C 208.4966888427734 38.48982238769531 210.1595458984375 36.07294082641602 211.3203430175781 33.38299942016602 C 212.5204772949219 30.60188293457031 213.1290130615234 27.64685249328613 213.1290130615234 24.60000038146973 C 213.1290130615234 21.55314826965332 212.5204772949219 18.59811782836914 211.3203430175781 15.81700134277344 C 210.1595458984375 13.12705993652344 208.4966888427734 10.71017837524414 206.3779296875 8.633499145507812 C 204.2563629150391 6.554058074951172 201.7855682373047 4.921352386474609 199.0341339111328 3.780704498291016 C 196.1839294433594 2.599117279052734 193.1547241210938 2 190.0306396484375 2 L 25.09840393066406 2 M 25.09840393066406 0 L 190.0306396484375 0 C 203.8921051025391 0 215.1290130615234 11.0137939453125 215.1290130615234 24.60000038146973 C 215.1290130615234 38.18620681762695 203.8921051025391 49.20000076293945 190.0306396484375 49.20000076293945 L 25.09840393066406 49.20000076293945 C 11.23692321777344 49.20000076293945 -1.52587890625e-05 38.18620681762695 -1.52587890625e-05 24.60000038146973 C -1.52587890625e-05 11.0137939453125 11.23692321777344 0 25.09840393066406 0 Z\" stroke=\"none\" fill=\"#000\"/>
</g>
<text id=\"_Zurück\" transform=\"translate(101.801 33.201)\" font-size=\"27\" font-family=\"LucidaGrande, Lucida Grande\"><tspan x=\"-60.818\" y=\"0\">←</tspan><tspan y=\"0\" xml:space=\"preserve\" font-family=\"MuseoSans-500, Museo Sans\" font-weight=\"500\"> Zurück</tspan></text>
</g>
</g>
</g>
</svg>
</form>
{% endif %}
</div>
</section>
<script src=\"/assets/js/snippet.js\"></script>
<style>
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images {
width: 100%;
max-height: none;
overflow-x: hidden;
overflow-y: hidden;
scrollbar-width: auto;
}
}
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images-container {
height: calc(100vh - 200px);
max-height: none;
overflow-x: auto;
width: 60%;
}
}
@media (min-width: 992px) {
.snippet-wrapper .snippet-container .images a .teaser {
width: calc(50% - 10px);
max-width: none;
max-height: none;
}
}
.snippet-wrapper .snippet-container .images a .teaser-video img {
object-fit: contain !important;
height: 100%;
width: 100%;
display: block;
}
.video {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
}
@media (min-width: 992px) {
.video {
margin-top: 0;
}
}
.video video {
height: 100%;
max-height: 80%;
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container {
position: relative;
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container svg {
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
width: 80px;
height: auto;
transform: translate(-50%, -50%);
}
.snippet-wrapper .snippet-container .images a .teaser-video .image-container svg path {
fill: white;
}
.snippet-wrapper .snippet-container .images .modal-image {
z-index: 2;
}
.snippet-wrapper .snippet-container .images .modal-image.active {
display: block;
right: 0vw;
position: fixed;
top: 0;
height: calc(100vh);
width: calc(100vw - 15px);
padding: 10px;
}
.snippet-wrapper .snippet-container .images .modal-image.active svg {
top: 3%;
}
.snippet-wrapper .snippet-container .images .modal-video.active svg {
top: 3%;
position: absolute;
right: 50%;
transform: translateX(50%);
cursor: pointer;
}
.snippet-wrapper .snippet-container .images a .teaser-video {
height: fit-content;
cursor: pointer;
}
@media (min-width: 992px) {
.snippet-wrapper .snippet-container .images a .teaser-video {
width: calc(33% - 12px);
max-width: none;
max-height: none;
}
}
.snippet-wrapper .snippet-container .images .modal-video {
z-index: 2;
}
.snippet-wrapper .snippet-container .images .modal-video {
position: absolute;
top: 5%;
width: 99vw;
height: 95vh;
background-color: #F7F6F5;
display: none;
}
@media (min-width: 1440px) {
.snippet-wrapper .snippet-container .images .modal-video {
right: 0vw;
}
}
.snippet-wrapper .snippet-container .images .modal-video.active {
display: block;
right: 0vw;
position: fixed;
top: 0;
height: 100vh;
width: 100vw;
padding: 10px;
}
</style>
{% endblock %}", "includes/detailSnippet.html.twig", "/home/httpd/vhosts/a4interactive.ch/httpdocs/apimedia.a4interactive.ch/apimedia/templates/includes/detailSnippet.html.twig");
}
}