templates/blocks/framework_cards_mazda.html.twig line 1

Open in your IDE?
  1. {#
  2.     {
  3.         "key": "framework_cards_mazda",
  4.         "category": "mazda",
  5.         "label": "clickable Cards mazda",
  6.         "description": "Toont een dynamisch aantal kaarten naast elkaar waar op je kan drukken",
  7.         "allowMove": true,
  8.         "blocks": [
  9.             {
  10.                 "key": "block-0",
  11.                 "size": 4,
  12.                 "buttons": true,
  13.                 "multiple": true,
  14.                 "minimum": 3,
  15.                 "required": "media",
  16.                 "fields": [
  17.                     {
  18.                         "key": "title",
  19.                         "type": "text",
  20.                         "label": "Card title"
  21.                     },
  22.                     {
  23.                         "key": "content",
  24.                         "type": "textarea",
  25.                         "label": "Tekst"
  26.                     }
  27.                 ]
  28.             }
  29.         ]
  30.     }
  31. #}
  33. <section id="{{wrapper.cssId is defined ? wrapper.cssId : ''}}" class="cards {{wrapper.cssClass is defined ? wrapper.cssClass : ''}}">
  34.   <div class="container">
  36.     {% if wrapper.label or wrapper.intro is not empty %}
  37.       <div class="introblock">
  38.         {% if wrapper.label is not empty %}
  39.           <div class="introtitle">
  40.             {{wrapper.label|raw}}
  41.           </div>
  42.         {% endif %}
  43.         {% if wrapper.intro is not empty %}
  44.           <div class="introtext">
  45.             {{wrapper.intro|raw}}
  46.           </div>
  47.         {% endif %}
  48.       </div>
  49.     {% endif %}
  50.     <div class="row blocks">
  51.       {% for b in wrapper.blocks %}
  52.         <div class="col-sm-12 col-md-6 col-lg-{{wrapper.gridSize > 0 ? 12 / wrapper.gridSize : 4}}"
  53.         {% if b.config.link is not empty %}onclick="location.href='{{ b.config.link }}';" style="cursor: pointer;"{% endif %}>
  54.           <div class="card">
  55.         <div class="container overflow">
  56.             {% if b.media is not empty %}
  57.             <div class="image-wrapper">
  58.               <div class="image" style="background: url('/{{b.media.getWebPath() }}') no-repeat center; background-size: cover;">
  59.               </div>
  60.             </div>
  61.             {% endif %}
  62.         </div>
  63.             <div class="card-body card-content">
  64.               <h3 class="card-title">{{b.config.title}}</h3>
  65.               <p>
  66.                 {{b.config.content|raw}}
  67.               </p>
  69.               {% if b.config.buttons is defined %}
  70.                 <div class="btns">
  71.                   {% for button in b.config.buttons %}
  72.                     <a href="{{button.url}}" {% if button.target is defined and button.target != "null" %} target="{{button.target}}" {% endif %} class="btn {{button.class}}">
  73.                       {{button.label}}
  74.                       <i class="fa fa-angle-right"></i>
  75.                     </a>
  76.                   {% endfor %}
  77.                 </div>
  78.               {% endif %}
  79.             </div>
  80.           </div>
  81.         </div>
  82.       {% endfor %}
  83.     </div>
  84.   </div>
  85. </section>