templates/areas/apk-banner-text-absolute/view.html.twig line 1

Open in your IDE?
  1. {% if editmode %}
  3. <div class="uk-container apk-container-1400">
  4.     <div uk-alert>
  5.         <h1 class="uk-h1">APK BANNER TEXT ABSOLUTE</h1>
  6.     </div>
  7.     
  8.     <div class="uk-margin-large-bottom">
  9.         
  10.         <div>Slideshow</div>
  12.         {% for i in pimcore_block('contentblock').iterator %}
  13.             <div uk-alert>
  14.                 <div class="uk-text-bold">Image Desktop (Obligatoire)</div>
  15.                 {{ pimcore_image('banner-image', {width: 400, height: 400}) }}
  17.                 <div class="uk-text-bold">Image Mobile</div>
  18.                 {{ pimcore_image('banner-image-mobile', {width: 400, height: 400}) }}
  20.                 <div class="uk-text-bold">Lien</div>
  21.                 {{ pimcore_link("banner-link", {"class" : "uk-button"}) }}
  22.             </div>
  23.         {% endfor %}
  25.         {#
  27.         <p>{{ pimcore_textarea("absolute-subtitle",{"nl2br" : true}) }}</p>
  28.         {{ pimcore_link("absolute-link") }}
  29.         {{ pimcore_link("absolute-btn", {"class" : "uk-button"}) }}
  30.         #}<hr>
  31.         
  32.         <div class="uk-alert uk-alert-default" uk-alert>
  33.             <div>Contenu en absolute</div>
  34.             <h2>{{ pimcore_textarea("absolute-title",{"nl2br" : true, "placeholder" : "Titre de la box"}) }}</h2>
  35.             <p>{{ pimcore_textarea("absolute-content-top",{"nl2br" : true, "placeholder" : "Sous-titre de la box"}) }}</p>
  36.             <hr/>
  37.             <p>{{ pimcore_textarea("absolute-subtitle-deux",{"nl2br" : true, "placeholder" : "Titre en dessous"}) }}</p>
  38.             {% if document.property('companyPhone') %}
  39.             <div class="apk-phone">
  40.                 <a href="tel:{{ convert_phone_to_url(document.getProperty('companyPhone')) }}">
  41.                     <span>{{ document.property('companyPhone') }}</span>
  42.                 </a>
  43.             </div>
  44.             {% endif %}
  45.         </div>
  46.         
  48.     </div>
  50. </div>
  51. {% else %}
  53. <div class="apk-banner-text-absolute-container uk-position-relative">
  55.     <div class="apk-container-slideshow">
  56.         <div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1" uk-slideshow="animation: push; autoplay: true; finite: false; autoplay-interval: 6000;">
  58.             <div class="uk-slideshow-items">
  59.                 {% for i in pimcore_block('contentblock').iterator %}
  60.                 <div>
  61.                     <div class="uk-visible@m">
  62.                         {% if not pimcore_link("banner-link").isEmpty() %}
  63.                             <a href="{{ pimcore_link("banner-link").getHref() }}" target="{{ pimcore_link("banner-link").getTarget() }}">{{ pimcore_image('banner-image').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}</a>
  64.                         {% else %}
  65.                             {{ pimcore_image('banner-image').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}
  66.                         {% endif %}
  67.                     </div>
  69.                     <div class="uk-hidden@m">
  70.                         {% if not pimcore_link("banner-link").isEmpty() %}
  71.                             <a href="{{ pimcore_link("banner-link").getHref() }}" target="{{ pimcore_link("banner-link").getTarget() }}">
  72.                             {% if not pimcore_image("banner-image-mobile").isEmpty() %}
  73.                                 {{ pimcore_image('banner-image-mobile').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}
  74.                             {% else %}
  75.                                 {{ pimcore_image('banner-image').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}
  76.                             {% endif %}
  77.                             </a>
  78.                         {% else %}
  79.                             {% if not pimcore_image("banner-image-mobile").isEmpty() %}
  80.                                 {{ pimcore_image('banner-image-mobile').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}
  81.                             {% else %}
  82.                                 {{ pimcore_image('banner-image').thumbnail('full-background').html({'imgAttributes' : {'uk-cover' : null}})|raw }}
  83.                             {% endif %}
  84.                         {% endif %}
  85.                     </div>
  86.                 </div>
  87.                 {% endfor %}
  88.             </div>
  89.             
  90.             <div class="uk-visible@s">
  91.                 <a class="uk-position-center-left uk-position-small" href uk-slidenav-previous uk-slideshow-item="previous"></a>
  92.                 <a class="uk-position-center-right uk-position-small" href uk-slidenav-next uk-slideshow-item="next"></a>
  93.             </div>
  94.             <div class="uk-hidden@s">
  95.                 <a class="uk-position-bottom-left uk-position-small" href uk-slidenav-previous uk-slideshow-item="previous"></a>
  96.                 <a class="uk-position-bottom-right uk-position-small" href uk-slidenav-next uk-slideshow-item="next"></a>
  97.             </div>
  99.         </div>
  100.     </div>
  102.     <div class="uk-container apk-container-1400 uk-position-relative">
  103.         <div class="uk-grid-large uk-position-relative" uk-grid>
  104.             <div class="uk-width-2-5@s">
  105.                 <div class="uk-text-center apk-content-absolute">
  107.                     
  108.                     {% if not pimcore_textarea("absolute-title").isEmpty %}
  109.                         <h2>{{ pimcore_textarea("absolute-title",{"nl2br" : true}) }}</h2>    
  110.                     {% endif %}
  112.                     {% if not pimcore_textarea("absolute-content-top").isEmpty %}
  113.                         <p class="uk-margin-remove-bottom">{{ pimcore_textarea("absolute-content-top",{"nl2br" : true}) }}</p>
  114.                     {% endif %}
  115.                     
  117.                     {% if false %}
  118.                     {#% if pimcore_website_config('akimediaActivate') %#}
  119.                             
  120.                         <form method="get" action="{{ path("searchPlasma") }}">
  122.                             <input style="display: none;" type="checkbox" id="plasma-checkbox" name="plasma" checked>
  123.                             <div class="section-form-don-question">
  124.                                 <label class="uk-form-label" for="form-stacked-text">{{ "Entrez votre code postal :"|trans }}</label>
  125.                                 <div class="uk-margin">
  126.                                     <input class="uk-input" type="text" id="cp" name="cp"
  127.                                         placeholder="{{ "1000…"|trans }}">
  128.                                 </div>
  129.                             </div>
  131.                             <label class="uk-form-label"
  132.                                 for="form-stacked-text">{{ "Entrez vos disponibilités :"|trans }}</label>
  133.                             <div class="uk-margin">
  134.                                 <div class="uk-grid-small" uk-grid>
  135.                                     <div class="uk-width-auto date-to-date">
  136.                                         <span>{{ "Du"|trans }}</span>
  137.                                     </div>
  138.                                     <div class="uk-width-expand">
  139.                                         <div class="uk-inline">
  140.                                         <span class="uk-form-icon uk-form-icon-flip triggerDatepicker" id="triggerDatepickerDu"><img
  141.                                                 src="/static/img/icons/calendar-icon.svg" alt=""/></span>
  142.                                             <input class="uk-input" id="du" name="du"
  143.                                                 value="{{ "now"|date("d/m/Y") }}"
  144.                                                 placeholder="{{ "jj/mm/aaaa"|trans }}"
  145.                                             data-toggle="datepicker" data-trigger="#triggerDatepickerDu" autocomplete="false">
  146.                                         </div>
  147.                                     </div>
  148.                                 </div>
  149.                             </div>
  150.                             <div class="uk-margin">
  151.                                 <div class="uk-grid-small" uk-grid>
  152.                                     <div class="uk-width-auto date-to-date">
  153.                                         <span>{{ "Au"|trans }}</span>
  154.                                     </div>
  155.                                     <div class="uk-width-expand">
  156.                                         <div class="uk-inline">
  157.                                         <span class="uk-form-icon uk-form-icon-flip triggerDatepicker" id="triggerDatepickerAu"><img
  158.                                                 src="/static/img/icons/calendar-icon.svg" alt=""/></span>
  159.                                             {% set minCanc = pimcore_website_config('nbjours', 1) %}
  160.                                             {% set nowDateStart = "now"|date_modify('+' ~ minCanc ~ 'day')|date('d/m/Y') %}
  161.                                             <input class="uk-input" id="au" name="au"
  162.                                                 value="{{ nowDateStart }}"
  163.                                                 placeholder="{{ "jj/mm/aaaa"|trans }}"
  164.                                             data-toggle="datepicker" data-trigger="#triggerDatepickerAu" autocomplete="false">
  165.                                         </div>
  166.                                     </div>
  167.                                 </div>
  168.                             </div>
  171.                             <div class="uk-margin-remove-bottom" uk-grid>
  172.                                 <div class="uk-margin-remove-bottom uk-align-center">
  173.                                     <input class="uk-button" value="{{ "Rechercher"|trans }}"
  174.                                     type="submit">
  175.                                 </div>
  176.                             </div>
  177.                         </form>
  179.                         {% else %}
  180.                             <div class="uk-margin-medium-bottom {{ not pimcore_textarea("absolute-title").isEmpty or not pimcore_textarea("absolute-content-top").isEmpty ? "uk-margin-medium-top" : "" }}">
  181.                                 <a class="uk-button" href="{{ document.property('listeCentresPlasma') }}">
  182.                                     {{ "Je prends rendez-vous"|trans }}
  183.                                 </a>
  184.                             </div>
  185.                         {% endif %}
  186.                         
  188.                     {#
  190.                     <hr>
  192.                     <p class="uk-margin-remove-bottom">{{ pimcore_textarea("absolute-subtitle",{"nl2br" : true}) }}</p>
  194.                     {{ pimcore_link("absolute-link", {"class" : "apk-link"}) }}
  196.                     <div class="uk-margin-small-top">
  197.                         {{ pimcore_link("absolute-btn", {"class" : "uk-button"}) }}
  198.                     </div>
  199.                     #}
  201.                     <hr>
  203.                     <p>{{ pimcore_textarea("absolute-subtitle-deux",{"nl2br" : true}) }}</p>
  205.                     {% if document.property('companyPhone') %}
  206.                     <div class="apk-phone">
  207.                         <a href="tel:{{ convert_phone_to_url(document.getProperty('companyPhone')) }}">
  208.                             <span>{{ document.property('companyPhone') }}</span>
  209.                         </a>
  210.                     </div>
  211.                     {% endif %}
  212.                 </div>
  213.             </div>
  214.             <div class="uk-width-3-5@s uk-flex-first@s">
  215.                 <div class="apk-content">
  216.                     <div class="uk-grid-large" uk-grid>
  217.                         <div class="uk-width-expand@s">
  218.                             <div class="apk-text-barometre">
  219.                                 <h2>{{"Baromètre Plasma"|trans}}</h2>
  220.                                 <p>{{"Il reste"|trans}} <span id="plasma-plages" class="is-big"></span> {{"plages de rendez-vous possibles sur les 14 prochains jours."|trans}}</p>
  222.                                 <p>{{"Vous voulez nous aider et donner votre plasma,"|trans}}</br> {{"prenez_rendez-vous_plasma"|trans|raw}} {{"dans le site de collecte près de chez vous."|trans}}</p>
  223.                             </div>
  224.                         </div>
  225.                         <div class="uk-width-auto@s apk-image uk-text-center">
  226.                             <div style="display: none;" id="goutte-tres-critique">
  227.                                 <img src="/static/img/barometre/goutte-plasma-vide-new.svg">
  228.                             </div>
  229.                             <div style="display: none;" id="goutte-critique">
  230.                                 <img src="/static/img/barometre/goutte-plasma-presque-vide.svg">
  231.                             </div>
  232.                             <div style="display: none;" id="goutte-tres-fragile">
  233.                                 <img src="/static/img/barometre/goutte-plasma-moitie-pleine.svg">
  234.                             </div>
  235.                             <div style="display: none;" id="goutte-fragile">
  236.                                 <img src="/static/img/barometre/goutte-plasma-presque-pleine.svg">
  237.                             </div>
  238.                             <div style="display: none;" id="goutte-stable">
  239.                                 <img src="/static/img/barometre/goutte-plasma-pleine.svg">
  240.                             </div>
  242.                             <h4 class="uk-margin-small-top uk-text-center" id="meteo-type-goutte"></h4>
  243.                         </div>
  244.                     </div>
  245.                 </div>
  246.             </div>
  247.         </div>
  248.     </div>
  249. </div>
  251. {% endif %}