www.aleph1.co.uk Git - yaffs-website/blob - web/modules/contrib/views_bootstrap/templates/views-bootstrap-grid.html.twig

   1 {#
   2 /**
   3  * @file views-bootstrap-grid.html.twig
   4  * Default simple view template to display Bootstrap Grids.
   5  *
   6  *
   7  * - columns: Contains rows grouped by columns.
   8  * - rows: Contains a nested array of rows. Each row contains an array of
   9  *   columns.
  10  * - column_type: Contains a number (default Bootstrap grid system column type).
  11  *
  12  * @ingroup views_templates
  13  */
  14 #}
  15 {%
  16   set classes = [
  17     'views-view-grid',
  18     options.alignment,
  19   ]
  20 %}
  21 <div id="{{ id }}" {{ attributes.addClass(classes) }}>
  22   {% if options.alignment  == 'horizontal' %}
  23     {% for row in items %}
  24       <div class="row">
  25         {% for column in row.content %}
  26           <div class="col {{ col_xs }} {{ col_sm }} {{ col_md }} {{ col_lg }} {{ options.row_class }}">
  27             {{ column.content }}
  28           </div>
  29         {% endfor %}
  30       </div>
  31     {% endfor %}
  32   {% else %}
  33     <div class="row">
  34       {% for column in items %}
  35         <div class="col {{ col_xs }} {{ col_sm }} {{ col_md }} {{ col_lg }} {{ options.row_class }}">
  36           {% for row in column.content %}
  37             {{ row.content }}
  38           {% endfor %}
  39         </div>
  40
  41         {% if loop.index is divisible by (sizes.xs) %}
  42           <div class="clearfix visible-xs-block"></div>
  43         {% endif %}
  44
  45         {% if loop.index is divisible by (sizes.sm) %}
  46           <div class="clearfix visible-sm-block"></div>
  47         {% endif %}
  48
  49         {% if loop.index is divisible by (sizes.md) %}
  50           <div class="clearfix visible-md-block"></div>
  51         {% endif %}
  52
  53         {% if loop.index is divisible by (sizes.lg) %}
  54           <div class="clearfix visible-lg-block"></div>
  55         {% endif %}
  56       {% endfor %}
  57     </div>
  58   {% endif %}
  59 </div>