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

Open in your IDE?
  1. {#
  2. Copyright(c) 2024 SYSTEM FRIEND INC.
  3. #}
  4. {% set new_products = get_new_product_list() %}
  6. <!-- ▼new_item_list▼ -->
  7. {% if new_products is not empty %}
  8.     <div class="ec-role">
  9.         <div class="ec-newProductRole">
  10.             <div class="ec-secHeading">
  11.                 <span class="ec-secHeading__en">{{ 'new_product42.block_title_en'|trans }}</span>
  12.                 <span class="ec-secHeading__line"></span>
  13.                 <span class="ec-secHeading__ja">{{ 'new_product42.block_title_ja'|trans }}</span>
  14.             </div>
  15.             <div class="ec-newItemRole__list">
  16.                 <ul class="ec-shelfGrid">
  17.                     {% for Product in new_products %}
  18.                         <li class="ec-shelfGrid__item">
  19.                             <a href="{{ url('product_detail', {'id': Product.id}) }}">
  20.                                 <div class="list_item_image_area">
  21.                                     <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}">
  22.                                 </div>
  23.                                 <p class="ec-newProductRole__listItemTitle">{{ Product.name }}</p>
  24.                             </a>
  25.                             <div class="product_item_inc_price">
  26.                                 {% if Product.hasProductClass %}
  27.                                     {% if Product.getPrice02Min == Product.getPrice02Max %}
  28.                                         {{ Product.getPrice02IncTaxMin|price }}
  29.                                     {% else %}
  30.                                         {{ Product.getPrice02IncTaxMin|price }} ～ {{ Product.getPrice02IncTaxMax|price }}
  31.                                     {% endif %}
  32.                                 {% else %}
  33.                                     {{ Product.getPrice02IncTaxMin|price }}
  34.                                 {% endif %}
  35.                             </div>
  36.                         </li>
  37.                     {% endfor %}
  38.                 </ul>
  39.             </div>
  40.             <div>
  41.                 <a style="margin-left: auto; margin-right: auto; margin-bottom: 30px;" class="ec-blockBtn--top" href="products/list?category_id=1">{{ 'もっと見る'|trans }}</a>
  42.             </div>
  43.         </div>
  44.     </div>
  45. {% endif %}
  46. <!-- ▲new_item_list▲ -->
  48. <style>
  50.     .ec-newProductRole{
  51.         padding: 60px 0 0;}
  53.     .ec-checkProductItemRole__list {
  54.         display: -ms-flexbox;
  55.         display: flex;
  56.         -ms-flex-wrap: wrap;
  57.         flex-wrap: wrap; }
  58.     .ec-newProductRole__listItem{
  59.         margin-bottom: 4%;
  60.         width: 48%;
  61.         height: auto; }
  62.     .ec-newProductRole__listItem:nth-child(odd) {
  63.         margin-right: 4%; }
  64.     .ec-newProductRole__listItemTitle {
  65.         margin: 20px 0 10px;
  66.         font-size: 14px;
  67.         font-weight: bold;
  68.     }
  70.     .ec-newProductRole{
  71.         padding: 60px 0;
  72.     }
  74.     .ec-checkProductItemRole__list{
  75.         -ms-flex-wrap: nowrap;
  76.         flex-wrap: nowrap;
  77.     }
  79.     .ec-newProductRole__listItem{
  80.         margin-bottom: 15px;
  81.         width: calc(100% / 4);
  82.     }
  84.     .ec-newProductRole__listItem:not(:last-of-type){
  85.         margin-right: 30px;
  86.     }
  88.     .ec-newProductRole__listItemTitle:nth-child(odd){
  89.         margin-right: 30px;
  90.     }
  91. </style>