app/template/default/Block/check_product.twig line 1

Open in your IDE?
  1. {#
  2. /*
  3.  * This file is part of the CheckProduct plugin
  4.  *
  5.  * Copyright(c) 2019 SYSTEM FRIEND INC.
  6.  *
  7.  */
  8. #}
  9. {% if CheckProducts|length > 0 %}
  10.     <div class="ec-role custom_zuijin">
  11.       <div class="section-header section-header--with-link">
  12.             <div class="ec-secHeading">
  13.                 <span class="ec-secHeading__en">{{'CheckProduct4.front.block.check_products.title.en'|trans}}</span>
  14.                 <span class="ec-secHeading__line"></span>
  15.                 <span class="ec-secHeading__ja">{{'CheckProduct4.front.block.check_products.title.ja'|trans}}</span>
  16.             </div>
  17.             <div>
  18.                 <div class="ec-checkProductItemRole__list">
  19.                     {% for Product in CheckProducts %}
  20.                         <div class="ec-checkProductRole__listItem">
  21.                             <a href="{{ url('product_detail', {'id' : Product.id}) }}" class="item_photo">
  22.                                 <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}">
  23.                                 <p class="ec-checkProductRole__listItemTitle">{{ Product.name }}</p>
  24.                             </a>
  25.                         </div>
  26.                     {% endfor %}
  27.                 </div>
  28.             </div>
  29.         </div>
  30.     </div>
  31. {% endif %}
  33. {% block stylesheet %}
  34.     <style type="text/css">
  35.         .ec-checkProductRole{
  36.             padding: 60px 0 0;
  37.         }
  38.         .ec-checkProductItemRole__list {
  39.             display: -ms-flexbox;
  40.             display: flex;
  41.             -ms-flex-wrap: wrap;
  42.             flex-wrap: wrap; }
  43.         .ec-checkProductRole__listItem{
  44.             margin-bottom: 4%;
  45.             width: 48%;
  46.             height: auto; }
  47.         .ec-checkProductRole__listItem:nth-child(odd) {
  48.             margin-right: 4%; }
  49.         .ec-checkProductRole__listItemTitle {
  50.             margin: 8px 0;
  51.             font-size: 14px;
  52.             font-weight: bold;
  53.             color: black; }
  54.         .ec-checkProductRole{
  55.             padding: 60px 0;
  56.         }
  57.         .ec-checkProductItemRole__list{
  58.             -ms-flex-wrap: nowrap;
  59.             flex-wrap: nowrap;
  60.         }
  61.         .ec-checkProductRole__listItem{
  62.             margin-bottom: 15px;
  63.             width: calc(100% / 5);
  64.         }
  65.         .ec-checkProductRole__listItem:not(:last-of-type){
  66.             margin-right: 30px;
  67.         }
  68.         .ec-checkProductRole__listItemTitle:nth-child(odd){
  69.             margin-right: 30px;
  70.         }
  71.     </style>
  72. {% endblock %}