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

Open in your IDE?
  1. <style>
  2.     #item-list-db #search_settings {
  3.         display: flex;
  4.         background-color: #f2f2f2;
  5.         border-top: none;
  6.         border-bottom: none;
  7.         letter-spacing: .1em;
  8.         margin-bottom: 5px;
  9.         padding: 14px 10px;
  10.     }
  11.     #item-list-db #search_settings .search-settings-box > * {
  12.         vertical-align: middle;
  13.     }
  15.     #item-list-db #search_settings .search-settings-box > span {
  16.         color: #333;
  17.         font-size: 14px;
  18.         line-height: 24px;
  19.     }
  20.     #item-list-db #search_settings .search-settings-box-left {
  21.         width: 40%;
  22.     }
  23.     #item-list-db #search_settings .search-settings-box-right {
  24.         width: 60%;
  25.         text-align: right;
  26.     }
  27.     #item-list-db #search_settings .search-settings-box-right > span {
  28.         margin-left: 2em;
  29.     }
  30.     #item-list-db #search_settings .search-settings-box-right select {
  31.         -webkit-appearance: none;
  32.         border-radius: 0;
  33.         font-size: 14px;
  34.         width: 130px;
  35.         padding-left: 2px;
  36.         height: 24px;
  37.     }
  38.     #item-list-db #search_settings .search-settings-box-right .search-settings-box-select-wrap {
  39.         display: inline-block;
  40.         position: relative;
  41.     }
  42.     #item-list-db #search_settings .search-settings-box-right .search-settings-box-select-wrap:after {
  43.         position: absolute;
  44.         content: '';
  45.         width: 4px;
  46.         height: 4px;
  47.         border: 2px solid;
  48.         border-color: #565656 #565656 transparent transparent;
  49.         transform: rotate(135deg);
  50.         top: 5px;
  51.         right: 6px;
  52.     }
  53.     #item-list-db .item-list-pagination .item-list-pagination-prev-next:before {
  54.         width: 10px;
  55.         height: 10px;
  56.     }
  57.     #item-list-db #glist  {
  58.         width: 100%;
  59.     }
  60. </style>
  61. <div id="item-list-db">
  62.     {% set list_anchor_id = 'list_mark' %}
  63.     {% set category_name_p = '' %}
  64.     {% set category_name = data.main_category_name %}
  66.     {% if isMainCategory is defined and isMainCategory %}
  67.         {% if main_h3 is defined and main_h3 != '' %}
  68.             {% set category_name = main_h3 %}
  69.         {% elseif main_breadcrumb is defined and main_breadcrumb != '' %}
  70.             {% set category_name = main_breadcrumb %}
  71.         {% endif %}
  72.         {% set category_name_p = category_name %}
  73.     {% else %}
  74.         {% if category_h3 is defined and category_h3 != '' %}
  75.             {% set category_name = category_h3 %}
  76.             {% set category_name_p = category_name %}
  77.         {% elseif category_h1 is defined and category_h1 != '' %}
  78.             {% set category_name = category_h1 %}
  79.             {% set category_name_p = category_name %}
  80.         {% else %}
  81.             {% set category_name = seoKeywordTDK %}
  82.             {% set category_name_p = php_str_replace(" 全商品", "", category_name) %}
  83.         {% endif %}
  84.     {% endif %}
  86.     <!-- 並び順、ページングのさいは、商品DBにアンカーする -->
  87.     <script>
  88.         $( function(){
  89.             $('#search_settings option').each( function(){
  90.                 var $option = $(this);
  91.                 $option.val( $option.val() + '#{{ list_anchor_id }}');
  92.             });
  93.             $('.item-list-pagination .item-list-pagination-page > a').each( function(){
  94.                 var $a = $(this);
  95.                 $a.attr('href', $a.attr('href')+'#{{ list_anchor_id }}');
  96.             });
  98.             // 固定ヘッダー分のスクロールを調整
  99.             if( location.href.match(/#{{ list_anchor_id }}/) ){
  100.                 // spはheader-navがないが、固定ヘッダー自体ないのでreturn falseで抜ける＝そのままアンカーされればよい
  101.                 var $fixedHeader = $('#header-nav');
  102.                 if( $fixedHeader.length === 0 ) return false;
  104.                 var $anchor = $('#{{ list_anchor_id }}');
  105.                 setTimeout( function(){
  106.                     $(window).scrollTop( $anchor.offset().top - $fixedHeader.outerHeight());    // 10は微調整
  107.                 }, 800 );
  108.             }
  109.         });
  110.     </script>
  112.     <a id="{{ list_anchor_id }}"></a>
  113.     <div id="item-list-header" class="item-all">
  114.         <h2 id="heading-item-list">{{ category.titleForItemList }}商品一覧</h2>
  115.         <div id="search_settings">
  116.             <div class="search-settings-box search-settings-box-left">
  117.                 <span>対象商品 {{ detailData.item_count }}件</span>
  118.             </div>
  120.             <div class="search-settings-box search-settings-box-right">
  121.                 {% include 'Common/DisplayOrderPulldown.twig' %}
  122.                 {% include 'Common/DisplayItemPulldown.twig' %}
  123.             </div>
  124.         </div>
  125.         {% if not app.request.query.get('no') %}
  126.             <p>{{ category.titleForItemList }}を販売するユニフォームの通販。常時20万点以上の豊富な品揃え。プリント・刺繍加工も対応中！</p>
  127.         {% endif %}
  128.     </div>
  131.     <!-- 検索結果が0件の場合 -->
  132.     {% if detailData is defined and detailData.item_count is defined and detailData.item_count == 0 %}
  133.         <div class="item-not-found">該当する条件の商品は見つかりませんでした。</div>
  134.     {% else %}
  135.         {% set col_count = detailData.col_count %}
  136.         {{ include('Block/product_item_list_common.twig') }}
  137.     {% endif %}
  138. </div>