app/template/ss4002/Block/category.twig line 1

Open in your IDE?
  1. {#
  2.     This file is part of EC-CUBE
  3.     
  4.     Copyright(c) LOCKON CO.,LTD. All Rights Reserved.
  5.     
  6.     http://www.lockon.co.jp/
  7.     
  8.     For the full copyright and license information, please view the LICENSE
  9.     file that was distributed with this source code.
  10.     #}
  11.     
  12.     <section class="b-category">
  13.         <h2 class="b-category__title c-animation-fade js-animation-fade">
  14.             <span class="b-category__title--main">{{ 'Categories'|trans }}</span>
  15.             {#<span class="b-category__title--sub">{{ ''|trans }}</span>#}
  16.         </h2>
  17.         <div class="b-category__contents c-animation-fade js-animation-fade">
  18.             <div class="b-category__slide" id="js-category__slide">
  19.                 <div class="b-category__slide-contents swiper-wrapper">
  20.                     <div class="b-category__item swiper-slide">
  21.                         <a class="b-category__item-link" href="/products/list?category_id=13">
  22.                             <figure class="b-category__item-image">
  23.                                 <picture>
  24.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/13.png">
  25.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/13.png" alt="{{ 'PORTRUNKS'|trans }}">
  26.                                 </picture>
  27.                             </figure>
  28.                             <p class="b-category__item-name">
  29.                                 <span class="b-category__item-name--ja">{{ 'PORTRUNKS'|trans }}</span>
  30.                                 {#<span class="b-category__item-name--en">{{ 'トップス'|trans|raw }}</span>#}
  31.                             </p>
  32.                         </a>
  33.                     </div>
  34.                     <div class="b-category__item swiper-slide">
  35.                         <a class="b-category__item-link" href="/products/list?category_id=7">
  36.                             <figure class="b-category__item-image">
  37.                                 <picture>
  38.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/7.png">
  39.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/7.png" alt="{{ 'WEAR トップス'|trans }}">
  40.                                 </picture>
  41.                             </figure>
  42.                             <p class="b-category__item-name">
  43.                                 <span class="b-category__item-name--ja">{{ 'WEAR'|trans }}</span>
  44.                                 <span class="b-category__item-name--en">{{ 'トップス'|trans|raw }}</span>
  45.                             </p>
  46.                         </a>
  47.                     </div>
  48.                     <div class="b-category__item swiper-slide">
  49.                         <a class="b-category__item-link" href="/products/list?category_id=8">
  50.                             <figure class="b-category__item-image">
  51.                                 <picture>
  52.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/8.png">
  53.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/8.png" alt="{{ 'WEAR ボトムス'|trans }}">
  54.                                 </picture>
  55.                             </figure>
  56.                             <p class="b-category__item-name">
  57.                                 <span class="b-category__item-name--ja">{{ 'WEAR'|trans }}</span>
  58.                                 <span class="b-category__item-name--en">{{ 'ボトムス'|trans|raw }}</span>
  59.                             </p>
  60.                         </a>
  61.                     </div>
  62.                     <div class="b-category__item swiper-slide">
  63.                         <a class="b-category__item-link" href="/products/list?category_id=9">
  64.                             <figure class="b-category__item-image">
  65.                                 <picture>
  66.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/9.png">
  67.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/9.png" alt="{{ 'WEAR ワンピース'|trans }}">
  68.                                 </picture>
  69.                             </figure>
  70.                             <p class="b-category__item-name">
  71.                                 <span class="b-category__item-name--ja">{{ 'WEAR'|trans }}</span>
  72.                                 <span class="b-category__item-name--en">{{ 'ワンピース'|trans|raw }}</span>
  73.                             </p>
  74.                         </a>
  75.                     </div>
  76.                     <div class="b-category__item swiper-slide">
  77.                         <a class="b-category__item-link" href="/products/list?category_id=10">
  78.                             <figure class="b-category__item-image">
  79.                                 <picture>
  80.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/10.png">
  81.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/10.png" alt="{{ 'WEAR その他'|trans }}">
  82.                                 </picture>
  83.                             </figure>
  84.                             <p class="b-category__item-name">
  85.                                 <span class="b-category__item-name--ja">{{ 'WEAR'|trans }}</span>
  86.                                 <span class="b-category__item-name--en">{{ 'その他'|trans|raw }}</span>
  87.                             </p>
  88.                         </a>
  89.                     </div>
  90.                     <div class="b-category__item swiper-slide">
  91.                         <a class="b-category__item-link" href="/products/list?category_id=11">
  92.                             <figure class="b-category__item-image">
  93.                                 <picture>
  94.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/11.png">
  95.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/11.png" alt="{{ 'GOODS バッグ'|trans }}">
  96.                                 </picture>
  97.                             </figure>
  98.                             <p class="b-category__item-name">
  99.                                 <span class="b-category__item-name--ja">{{ 'GOODS'|trans }}</span>
  100.                                 <span class="b-category__item-name--en">{{ 'バッグ'|trans|raw }}</span>
  101.                             </p>
  102.                         </a>
  103.                     </div>
  104.                     <div class="b-category__item swiper-slide">
  105.                         <a class="b-category__item-link" href="/products/list?category_id=12">
  106.                             <figure class="b-category__item-image">
  107.                                 <picture>
  108.                                     <source media="(max-width: 839px)" srcset="/html/user_data/assets/img/category/12.png">
  109.                                     <img class="b-category__item-image-pic" src="/html/user_data/assets/img/category/12.png" alt="{{ 'GOODS その他'|trans }}">
  110.                                 </picture>
  111.                             </figure>
  112.                             <p class="b-category__item-name">
  113.                                 <span class="b-category__item-name--ja">{{ 'GOODS'|trans }}</span>
  114.                                 <span class="b-category__item-name--en">{{ 'その他'|trans|raw }}</span>
  115.                             </p>
  116.                         </a>
  117.                     </div>
  118.                 </div>
  119.                 <div class="b-category__slide-scrollbar swiper-scrollbar" id="js-category__slide-scrollbar"></div>
  120.             </div>
  121.         </div>
  122.     </section>
  123.     
  124.     {# scrollのjavascriptはindex.twigに記載 #}
  125.     {# 背景画像のCSSはindex.twigに記載 #}