templates/themes/theme/templates/cmspage-about.html.twig line 1

Open in your IDE?
  1. {% extends '@theme/base.html.twig' %}
  2. {% block metatitle %}{{page.metatitle}}{% endblock %}
  3. {% block metadescription %}{{page.metadescription|striptags|slice(0, 160)}}{% endblock %}
  5. {% block body %}
  8. <div class="banner-block pb-6 lazyBackgroundImage" data-mobile="{{ imageCache('/userfiles/images/page/' ~ page.image, 'zoomCrop', 900, 405) }}" data-desktop="{{ imageCache('/userfiles/images/page/' ~ page.image, 'zoomCrop', 3200, 1440) }}">
  9.     <div class="container h-full">
  10.         <div class="flex items-end h-full">
  11.             <h1>{{ replaceIfComponentDataExists(pageComponents, "title", page.title) }}</h1>
  12.         </div>
  13.     </div>
  14. </div>
  16. <section class="page-content overflow-x-hidden">
  17.     <div class="container">
  18.         <div class="row">
  19.             <div class="lg:col-6 large-para pt-6 lg:pt-0 pb-6 lg:pb-0 xl:pr-12 lg:flex lg:items-center">
  20.                 {{ allowInlineEditor(page, 'content')|raw }}
  21.             </div>
  22.             <div class="lg:col-6 cms-area">
  23.                 <div class="bg-black black-full text-white lg:px-10 pt-10 pb-12">
  24.                     {{ allowInlineEditor(page, 'content2')|raw }}
  25.                 </div>
  26.             </div>
  27.         </div>
  28.     </div>
  29. </section>
  31. <section class="bg-primary pt-12 mb-12 text-white team-block">
  32.     <div class="container">
  33.         <div class="row">
  34.             <div class="col-12">
  35.                 {{ renderComponents('After Content', pageComponents)|raw }}
  36.             </div>
  37.         </div>
  38.     </div>
  39. </section>
  41. {{ renderHtmlBlock('Further Content', pageHtmlBlocks)|raw }}
  43. <section class="bg-grey pt-12 pb-6 lg:pb-12">
  44.     <div class="container">
  45.         <h3 class="text-center text-black mb-6">Why Choose Stable Scaffolding Ltd?</h3>
  46.         <div class="row">
  47.             <div class="lg:col-3 sm:col-6 text-center mb-6 lg:mb-0">
  48.                 <div class="text-5xl text-primary mb-6">{{ renderSetting(17, 'iconClass') }}</div>
  49.                 <h5 class="text-lg text-primary capitalize mb-0">{{ renderSetting(17, 'displayText') }}</h5>
  50.                 <p class="font-medium">{{ renderSetting(17, 'content') }}</p>
  51.             </div>
  52.             <div class="lg:col-3 sm:col-6 text-center mb-6 lg:mb-0">
  53.                 <div class="text-5xl text-primary mb-6">{{ renderSetting(18, 'iconClass') }}</div>
  54.                 <h5 class="text-lg text-primary capitalize mb-0">{{ renderSetting(18, 'displayText') }}</h5>
  55.                 <p class="font-medium">{{ renderSetting(18, 'content') }}</p>
  56.             </div>
  57.             <div class="lg:col-3 sm:col-6 text-center mb-6 lg:mb-0">
  58.                 <div class="text-5xl text-primary mb-6">{{ renderSetting(19, 'iconClass') }}</div>
  59.                 <h5 class="text-lg text-primary capitalize mb-0">{{ renderSetting(19, 'displayText') }}</h5>
  60.                 <p class="font-medium">{{ renderSetting(19, 'content') }}</p>
  61.             </div>
  62.             <div class="lg:col-3 sm:col-6 text-center mb-6 lg:mb-0">
  63.                 <div class="text-5xl text-primary mb-6">{{ renderSetting(20, 'iconClass') }}</div>
  64.                 <h5 class="text-lg text-primary capitalize mb-0">{{ renderSetting(20, 'displayText') }}</h5>
  65.                 <p class="font-medium">{{ renderSetting(20, 'content') }}</p>
  66.             </div>
  67.         </div>
  68.     </div>
  69. </section>
  71. {% if page.image2 %}
  72. <div class="container">
  73.     <div class="row">
  74.         <div class="col-12">
  75.             <picture>
  76.                 <source srcset="{{ imageCache('/userfiles/images/page/' ~ page.image2, 'zoomCrop', 900, 500) }}" media="(max-width: 767px)">
  77.                 <img class="max-w-full h-auto mt-12" src="{{ imageCache('/userfiles/images/page/' ~ page.image2, 'zoomCrop', 2560, 1200) }}" alt="{{ page.title }}" loading="lazy">
  78.             </picture>
  79.         </div>
  80.     </div>
  81. </div>
  82. {% endif %}
  84. {{ renderHtmlBlock('CTA', pageHtmlBlocks)|raw }}
  86. {{ renderComponents('Bottom 1', pageComponents)|raw }}
  88. {{ renderComponents('Bottom 2', pageComponents)|raw }}
  90. {% endblock %}
  92. {% block stylesheets %}
  93. {% endblock %}