bundles/AppBundle/Resources/views/Areas/radiostatistik/view.html.twig line 1

Open in your IDE?
  1. {% set block = pimcore_block('stats') %}
  3. {% set bgColor = pimcore_select('bgColor').getValue() %}
  4. {% set bgColorHex = pimcore_input('bgColorHex').getValue() %}
  6. {% set paddingTop = pimcore_select('paddingTop').getValue() %}
  7. {% set paddingTop = paddingTop == '' ? '10' : paddingTop %}
  8. {% set paddingBottom = pimcore_select('paddingBottom').getValue() %}
  9. {% set paddingBottom = paddingBottom == '' ? '10' : paddingBottom %}
  11. {% set count = block.getCount() %}
  12. {% set cols = count > 4 ? 4 : (count > 0 ? count : 1) %}
  13. {% set mobileCols = 1 %}
  14. {% set delays = ['', 'delay-100', 'delay-200', 'delay-300'] %}
  16. <div class="module-container my-10 radiostatistik-module-container {% if not bgColorHex %} {{ bgColor }} {% endif %} {{ pimcore_input('classes').data }}" style="{% if bgColorHex %}background: {{ bgColorHex }};{% endif %}">
  17.     <section class="{{ editmode ? '' : 'module-section radiostatistik-module' }}">
  18.         {% if editmode %}
  19.             <div class="container">
  21.                 <div class="bg-white p-5 mb-10">
  22.                     <div class="mb-5">Intro Text</div>
  24.                     {{ pimcore_wysiwyg('intro') }}
  25.                 </div>
  27.                 <div class="bg-white shadow-lg my-10">
  28.                     <div class="px-5 py-2 bg-gray-800 text-white">
  29.                         {{ 'Modul - Radiostatistik' | trans }}
  30.                     </div>
  31.                     <div class="p-5 text-black">
  32.                         {% for j in pimcore_iterate_block(block) %}
  33.                             <div class="mb-5 p-3 bg-neutral-100">
  34.                                 <div class="grid grid-cols-3 gap-5">
  35.                                     <div>
  36.                                         <div class="text-xs">Title</div>
  37.                                         <div class="bg-gray-200">{{ pimcore_input('title') }}</div>
  38.                                     </div>
  39.                                     <div>
  40.                                         <div class="text-xs">Beschriftung (z.B. Bayerische Oberlandapp)</div>
  41.                                         <div class="bg-gray-200">{{ pimcore_input('label') }}</div>
  42.                                     </div>
  43.                                     <div>
  44.                                         <div class="text-xs">Wert Approximationen (z.B. über, etwa, nahezu)</div>
  45.                                         <div class="bg-gray-200">{{ pimcore_input('approx') }}</div>
  46.                                     </div>
  47.                                     <div>
  48.                                         <div class="text-xs">Wert (z.B. 120000)</div>
  49.                                         <div class="bg-gray-200">{{ pimcore_input('value') }}</div>
  50.                                     </div>
  51.                                     <div>
  52.                                         <div class="text-xs">Text (optional)</div>
  53.                                         <div class="bg-gray-200">{{ pimcore_wysiwyg('text') }}</div>
  54.                                     </div>
  55.                                 </div>
  56.                             </div>
  57.                         {% endfor %}
  58.                     </div>
  59.                 </div>
  61.                 <div class="bg-white p-5 mb-10 grid grid-cols-3 gap-5">
  62.                     <div class="col-span-2">
  64.                         <div class="mb-5">Outro Subtitle</div>
  65.                         <div class="mb-5">{{ pimcore_input('outroSubtitle') }}</div>
  67.                         <div class="mb-5">Outro Text</div>
  68.                         <div class="mb-5">{{ pimcore_wysiwyg('outro') }}</div>
  69.                     </div>
  70.                     <div>
  71.                         <div class="mb-5">{{ pimcore_image('outroBackground') }}</div>
  72.                         {{ pimcore_link('outroLink') }}
  73.                     </div>
  74.                 </div>
  75.             </div>
  76.         {% else %}
  77.             <div class="container px-5 pt-{{ paddingTop }} pb-{{ paddingBottom }}">
  79.                 {% set intro = pimcore_wysiwyg('intro') %}
  80.                 {% if intro %}
  81.                     <div class="prose colored text-balance text-sm mb-20 md:pt-10">{{ intro | raw }}</div>
  82.                 {% endif %}
  84.                 <div class="grid grid-cols-{{ mobileCols }} md:grid-cols-{{ cols }} gap-10 md:gap-16">
  85.                     {% for j in pimcore_iterate_block(block) %}
  86.                         {% set value = pimcore_input('value').getValue() %}
  87.                         {% set title = pimcore_input('title').getValue() %}
  88.                         {% set label = pimcore_input('label').getValue() %}
  89.                         {% set approx = pimcore_input('approx').getValue() %}
  90.                         {% set text = pimcore_wysiwyg('text').getValue() %}
  91.                         {% if value or label or text %}
  92.                             <div>
  93.                                 <div class="font-mont-heavy md:text-[18px]">{{ title }}</div>
  94.                                 {% if label %}
  95.                                     <div class="text-sm">{{ label }}</div>
  96.                                 {% endif %}
  97.                                 <div class="flex justify-between border-b-2 border-blue-light items-end mt-3 mb-2">
  98.                                     <div class="text-sm pb-4">{{ approx }}</div>
  99.                                     <div class="font-mont-heavy text-4xl md:text-5xl text-blue-light vue-app"><number :value="{{ value }}" :from="0" :duration="2.5"></number></div>
  100.                                 </div>
  101.                                 {% if text %}
  102.                                     <div class="prose colored text-balance text-sm pt-3">{{ text | raw }}</div>
  103.                                 {% endif %}
  104.                             </div>
  105.                         {% endif %}
  106.                     {% endfor %}
  107.                 </div>
  108.                 {% set outro = pimcore_wysiwyg('outro') %}
  109.                 {% set outroLink = pimcore_link('outroLink', { class: 'btn btn-blue' }) %}
  110.                 {% set outroSubtitle = pimcore_input('outroSubtitle') %}
  111.                 {% set outroImage = pimcore_image('outroBackground') %}
  112.                 {% if outro | length %}
  113.                     <div class="bg-white shadow-card mt-10 md:mt-20 p-5 md:p-10 lg:p-20 mb-5 md:mb-10 lg:mb-20 grid lg:grid-cols-2 gap-10"
  114.                          style="{% if outroImage and outroImage.image %}background-image: url('{{ outroImage.image.fullpath }}'); background-size: auto 100%; background-repeat: no-repeat; background-position: right;{% endif %}">
  115.                         <div>
  116.                             {% if outroSubtitle %}
  117.                                 <div class="font-mont-heavy mb-5 md:mb-10">{{ outroSubtitle | raw }}</div>
  118.                             {% endif %}
  119.                             <div class="prose colored text-balance">
  120.                                 {{ outro | raw }}
  121.                             </div>
  122.                         </div>
  123.                         {% if outroLink %}
  124.                             <div class="md:self-end text-center">
  125.                                 {{ outroLink | raw }}
  126.                             </div>
  127.                         {% endif %}
  128.                     </div>
  129.                 {% endif %}
  130.             </div>
  131.         {% endif %}
  132.     </section>
  133. </div>