blocks/AlertBlock/block.html.twig line 1

Open in your IDE?
  1. {% if data.activado|default == true %}
  2.     <section id="{{ id }}"
  3.              class="{{ className }}{% if className == 'AlertBlock alignfull' %} my-10 md:my-16 {% endif %} relative not-prose {% if data.background|default == "primary" %} bg-primary {% elseif data.background|default == "secondary" %} bg-secondary {% elseif data.background|default == "black" %} bg-[#000000] {% elseif data.background|default == "white" %} bg-white {% endif %} border-b border-gray-200/50">
  4.         <div class="relative max-w-screen-2xl mx-auto px-5 lg:px-20 pt-4 pb-2 lg:py-2 flex flex-col lg:flex-row lg:items-center {% if data.text_align|default == "left" %} justify-between {% elseif data.text_align|default == "center" %} justify-center {% endif %} gap-0 lg:gap-8 w-full">
  5.             <div class="flex flex-col lg:grid lg:grid-cols-[auto_auto_auto] {% if data.text_align|default == "center" %} items-center {% else %} items-start lg:items-center {% endif %} gap-2 lg:gap-8">
  6.                 {% if data.titulo|default %}
  7.                     <span class="block w-full {% if data.text_align|default == "left" %} text-start {% elseif data.text_align|default == "center" %} text-center {% endif %} text-white text-xl md:text-2xl font-title uppercase font-bold !leading-none">{{ data.titulo|raw }}</span>
  8.                 {% endif %}
  9.                 {% if data.icono|default %}
  10.                     <img {{ wordpress_image_attrs(data.icono, 'blocks', 'presentation') }}
  11.                             loading="lazy" class="w-full h-auto !max-w-[40px]">
  12.                 {% endif %}
  13.                 {% if data.texto|default %}
  14.                     <span class="text-xs lg:text-sm font-title font-bold w-full !text-wrap {% if data.background|default == "white" %} text-black {% else %} text-white {% endif %} !leading-snug {% if data.text_align|default == "left" %} text-start {% elseif data.text_align|default == "center" %} !text-center lg:text-start {% endif %}">{{ data.texto|raw }}</span>
  15.                 {% endif %}
  16.             </div>
  17.             <div class="flex flex-row items-center mt-2 lg:mt-0 {% if data.text_align|default == "left" %} justify-start lg:justify-between {% elseif data.text_align|default == "center" %} justify-center {% endif %} gap-4 leading-none">
  18.                 {% if data.fecha|default %}
  19.                     <div id="cuentaRegresiva" data-fecha="{{ data.fecha|raw }}"
  20.                          class="text-white text-nowrap"></div>
  21.                 {% endif %}
  22.                 {% if data.boton.title|default %}
  23.                     <a href="{{ data.boton.url }}"
  24.                        target="{{ data.boton.target }}"
  25.                        class="{% if data.color_boton|default == "primary" %} !bg-primary {% elseif data.color_boton|default == "secondary" %} !bg-secondary {% elseif data.color_boton|default == "black" %} !bg-black {% elseif data.color_boton|default == "white" %} !bg-white !text-black {% endif %} text-white no-underline text-sm px-3 py-1 w-fit text-nowrap">{{ data.boton.title }}</a>
  26.                 {% elseif data.boton.url|default %}
  27.                     <a href="{{ data.boton.url }}"
  28.                        target="{{ data.boton.target }}"
  29.                        class="absolute inset-0 w-full h-full"></a>
  30.                 {% endif %}
  31.             </div>
  32.         </div>
  33.         {% if style|default %}
  34.             <style>
  35.                 {{ style|raw }}
  36.             </style>
  37.         {% endif %}
  38.     </section>
  39. {% endif %}