app/template/meldiastore/Block/new_item.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) LOCKON CO.,LTD. All Rights Reserved.
  6. http://www.lockon.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  11. <style>
  12.     .b-new-item__body {
  13.     background-image: linear-gradient(#F0F0EB,#F0F0EB);
  14.     }
  15.     .b-new-item__title--main {
  16.     color: #000;
  17.     }
  18.     .b-new-item__title--sub {
  19.     color: #000;
  20.     }
  21.     .c-button--unelevated.is-secondary {
  22.     background-color: #807245;
  23.     }
  24.     .b-new-item__title--main {
  25.     font-weight: 600;
  26. }
  27.     .c-new-item__product-name {
  28.     font-size: 14px;
  29.     margin-top: 10px;
  30.     margin-bottom: 10px;
  31.     font-weight: 400;
  32.     color: #000;
  33.     
  34.     }
  35.     .b-new-item__product-link {
  36.     text-decoration: none;
  37.     }
  38.     .c-new-item__product-price {
  39.     font-size: 16px;
  40.     line-height: 1.75;
  41.     margin-top: 10px;
  42.     margin-bottom: 10px;
  43.     color: #F00;
  44.     font-weight: 700;
  45.     }
  47. </style>
  48. <section class="b-new-item">
  49.     <div class="b-new-item__body">
  50.         <h2 class="b-new-item__title c-animation-fade js-animation-fade">
  51.             <span class="b-new-item__title--main">{{ 'Reccomend Item'|trans }}</span>
  52.             <span class="b-new-item__title--sub">{{ 'おすすめ商品'|trans }}</span>
  53.         </h2>
  54.         <div class="b-new-item__contents c-animation-fade js-animation-fade">
  55.             <ul class="b-new-item__list">
  56.                 <li class="b-new-item__list-item">
  57.                     <section class="b-new-item__product">
  58.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '695'}) }}">
  59.                             <figure class="b-new-item__product-image">
  60.                                 <picture>
  61.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/mirablezero.jpg') }}">
  62.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/mirablezero.jpg') }}" alt="{{ 'ミラブルZERO'|trans }}">
  63.                                 </picture>
  64.                             </figure>
  65.                             <div class="c-new-item__product-contents">
  66.                                 <h3 class="c-new-item__product-name">{{ 'ミラブルZERO'|trans }}</h3>
  67.                                 <p class="c-new-item__product-price">
  68.                                     {{ '￥28,050'|trans }}
  69.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  70.                                 </p>
  71.                             </div>
  72.                         </a>
  73.                     </section>
  74.                 </li>
  75.                 <li class="b-new-item__list-item">
  76.                     <section class="b-new-item__product">
  77.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '615'}) }}">
  78.                             <figure class="b-new-item__product-image">
  79.                                 <picture>
  80.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/mirableplus2.jpg') }}">
  81.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/mirableplus2.jpg') }}" alt="{{ 'ミラブルplus'|trans }}">
  82.                                 </picture>
  83.                             </figure>
  84.                             <div class="c-new-item__product-contents">
  85.                                 <h3 class="c-new-item__product-name">{{ 'ミラブルplus'|trans }}</h3>
  86.                                 <p class="c-new-item__product-price">
  87.                                     {{ '￥23,000'|trans }}
  88.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  89.                                 </p>
  90.                             </div>
  91.                         </a>
  92.                     </section>
  93.                 </li>
  94.                  <li class="b-new-item__list-item">
  95.                     <section class="b-new-item__product">
  96.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '757'}) }}">
  97.                             <figure class="b-new-item__product-image">
  98.                                 <picture>
  99.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/FINEBUBBLEPURE.png') }}">
  100.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/FINEBUBBLEPURE.png') }}" alt="{{ 'ミラブルplus'|trans }}">
  101.                                 </picture>
  102.                             </figure>
  103.                             <div class="c-new-item__product-contents">
  104.                                 <h3 class="c-new-item__product-name">{{ 'ReFa FINE BUBBLE PURE(リファファインバブルピュア)'|trans }}</h3>
  105.                                 <p class="c-new-item__product-price">
  106.                                     {{ '￥26,400'|trans }}
  107.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  108.                                 </p>
  109.                             </div>
  110.                         </a>
  111.                     </section>
  112.                 </li>
  113.                 <li class="b-new-item__list-item">
  114.                     <section class="b-new-item__product">
  115.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '680'}) }}">
  116.                             <figure class="b-new-item__product-image">
  117.                                 <picture>
  118.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/refa.jpg') }}">
  119.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/refa.jpg') }}" alt="{{ 'ReFa FINE BUBBLE S（リファ ファインバブルS）'|trans }}">
  120.                                 </picture>
  121.                             </figure>
  122.                             <div class="c-new-item__product-contents">
  123.                                 <h3 class="c-new-item__product-name">{{ 'ReFa FINE BUBBLE S（リファ ファインバブルS）'|trans }}</h3>
  124.                                 <p class="c-new-item__product-price">
  125.                                     {{ '￥22,000'|trans }}
  126.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  127.                                 </p>
  128.                             </div>
  129.                         </a>
  130.                     </section>
  131.                 </li>
  132.                 <li class="b-new-item__list-item">
  133.                     <section class="b-new-item__product">
  134.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '682'}) }}">
  135.                             <figure class="b-new-item__product-image">
  136.                                 <picture>
  137.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/SMARTDRYER.png') }}">
  138.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/SMARTDRYER.png') }}" alt="{{ 'ReFa BEAUTECH DRYER（リファビューテック ドライヤー）'|trans }}">
  139.                                 </picture>
  140.                             </figure>
  141.                             <div class="c-new-item__product-contents">
  142.                                 <h3 class="c-new-item__product-name">{{ 'ReFa SMART DRYER（リファスマート ドライヤー）'|trans }}</h3>
  143.                                 <p class="c-new-item__product-price">
  144.                                     {{ '￥26,400'|trans }}
  145.                                     <span class="c-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  146.                                 </p>
  147.                             </div>
  148.                         </a>
  149.                     </section>
  150.                 </li>
  151.                 <li class="b-new-item__list-item">
  152.                     <section class="b-new-item__product">
  153.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '751'}) }}">
  154.                             <figure class="b-new-item__product-image">
  155.                                 <picture>
  156.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/nihondenko100mm.jpg') }}">
  157.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/nihondenko100mm.jpg') }}" alt="{{ '日本電興給気口フィルターΦ100'|trans }}">
  158.                                 </picture>
  159.                             </figure>
  160.                             <div class="c-new-item__product-contents">
  161.                                 <h3 class="c-new-item__product-name">{{ '日本電興給気口フィルターΦ100 10枚セット'|trans }}</h3>
  162.                                 <p class="c-new-item__product-price">
  163.                                     {{ '￥3,960'|trans }}
  164.                                     <span class="c-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  165.                                 </p>
  166.                             </div>
  167.                         </a>
  168.                     </section>
  169.                 </li>
  170.                 <li class="b-new-item__list-item">
  171.                     <section class="b-new-item__product">
  172.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '750'}) }}">
  173.                             <figure class="b-new-item__product-image">
  174.                                 <picture>
  175.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/nihondenko150mm.jpg') }}">
  176.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/nihondenko150mm.jpg') }}" alt="{{ '日本電興給気口フィルターΦ100'|trans }}">
  177.                                 </picture>
  178.                             </figure>
  179.                             <div class="c-new-item__product-contents">
  180.                                 <h3 class="c-new-item__product-name">{{ '日本電興給気口フィルターΦ150 6枚セット'|trans }}</h3>
  181.                                 <p class="c-new-item__product-price">
  182.                                     {{ '￥3,960'|trans }}
  183.                                     <span class="c-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  184.                                 </p>
  185.                             </div>
  186.                         </a>
  187.                     </section>
  188.                 </li>
  189.                 <li class="b-new-item__list-item">
  190.                     <section class="b-new-item__product">
  191.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '566'}) }}">
  192.                             <figure class="b-new-item__product-image">
  193.                                 <picture>
  194.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/slippa.jpg') }}">
  195.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/slippa.jpg') }}" alt="{{ '天板付きスリッパラック タワー ブラック'|trans }}">
  196.                                 </picture>
  197.                             </figure>
  198.                             <div class="c-new-item__product-contents">
  199.                                 <h3 class="c-new-item__product-name">{{ '天板付きスリッパラック タワー ブラック'|trans }}</h3>
  200.                                 <p class="c-new-item__product-price">
  201.                                     {{ '￥3,168'|trans }}
  202.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  203.                                 </p>
  204.                             </div>
  205.                         </a>
  206.                     </section>
  207.                 </li>
  208.                 <li class="b-new-item__list-item">
  209.                     <section class="b-new-item__product">
  210.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '257'}) }}">
  211.                             <figure class="b-new-item__product-image">
  212.                                 <picture>
  213.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/fumidai.jpg') }}">
  214.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/fumidai.jpg') }}" alt="{{ '踏み台'|trans }}">
  215.                                 </picture>
  216.                             </figure>
  217.                             <div class="c-new-item__product-contents">
  218.                                 <h3 class="c-new-item__product-name">{{ '踏み台'|trans }}</h3>
  219.                                 <p class="c-new-item__product-price">
  220.                                     {{ '￥4,950'|trans }}
  221.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  222.                                 </p>
  223.                             </div>
  224.                         </a>
  225.                     </section>
  226.                 </li>
  227.                 <li class="b-new-item__list-item">
  228.                     <section class="b-new-item__product">
  229.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '687'}) }}">
  230.                             <figure class="b-new-item__product-image">
  231.                                 <picture>
  232.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/footfit2.jpg') }}">
  233.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/footfit2.jpg') }}" alt="{{ 'EMSトレーニングギア SIXPAD Foot Fit 2(シックスパッド フット フィット 2)'|trans }}">
  234.                                 </picture>
  235.                             </figure>
  236.                             <div class="c-new-item__product-contents">
  237.                                 <h3 class="c-new-item__product-name">{{ 'EMSトレーニングギア SIXPAD Foot Fit 2(シックスパッド フット フィット 2)'|trans }}</h3>
  238.                                 <p class="c-new-item__product-price">
  239.                                     {{ '￥32,450'|trans }}
  240.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  241.                                 </p>
  242.                             </div>
  243.                         </a>
  244.                     </section>
  245.                 </li>
  247.                 
  249.                 <li class="b-new-item__list-item">
  250.                     <section class="b-new-item__product">
  251.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '4'}) }}">
  252.                             <figure class="b-new-item__product-image">
  253.                                 <picture>
  254.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/sarashina100.jpg') }}">
  255.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/sarashina100.jpg') }}" alt="{{ '更科製作所Φ100 LPR給気レジスター用 交換フィルター5枚セット (水洗い可）'|trans }}">
  256.                                 </picture>
  257.                             </figure>
  258.                             <div class="c-new-item__product-contents">
  259.                                 <h3 class="c-new-item__product-name">{{ '更科製作所Φ100 LPR給気レジスター用 交換フィルター5枚セット '|trans }}</h3>
  260.                                 <p class="c-new-item__product-price">
  261.                                     {{ '￥3,685'|trans }}
  262.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  263.                                 </p>
  264.                             </div>
  265.                         </a>
  266.                     </section>
  267.                 </li>
  268.                 <li class="b-new-item__list-item">
  269.                     <section class="b-new-item__product">
  270.                         <a class="b-new-item__product-link" href="{{ url('product_detail', {'id': '6'}) }}">
  271.                             <figure class="b-new-item__product-image">
  272.                                 <picture>
  273.                                     <source media="(max-width: 839px)" srcset="{{ asset('/html/user_data/assets/reccomend/sarashina150.jpg') }}">
  274.                                     <img class="b-new-item__product-image-pic" src="{{ asset('/html/user_data/assets/reccomend/sarashina150.jpg') }}" alt="{{ '交換フィルター【SPR-150FC用】F-150SPR'|trans }}">
  275.                                 </picture>
  276.                             </figure>
  277.                             <div class="c-new-item__product-contents">
  278.                                 <h3 class="c-new-item__product-name">{{ '更科製作所Φ150 SPR給気レジスター用 交換フィルター5枚セット'|trans }}</h3>
  279.                                 <p class="c-new-item__product-price">
  280.                                     {{ '￥4,400'|trans }}
  281.                                     <span class="b-new-item__product-price--unit">{{ '(税込)'|trans }}</span>
  282.                                 </p>
  283.                             </div>
  284.                         </a>
  285.                     </section>
  286.                 </li>
  289.                 
  290.                 
  291.             </ul>
  292.             <div class="b-new-item__actions">
  293.                 <div class="b-new-item__actions-item">
  294.                     <a class="c-button is-secondary c-button--unelevated mdc-button mdc-button--unelevated" href="{{ url('product_list') }}">
  295.                         <span class="c-button__label mdc-button__label">{{ 'All Product'|trans }}</span>
  296.                     </a>
  297.                 </div>
  298.             </div>
  299.         </div>
  300.     </div>
  301. </section>
  303. {# スライダーに必要なscriptはindex.twigに記載 #}