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

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  6. http://www.ec-cube.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. {% set totalQuantity = get_carts_total_quantity() %}
  13. <div class="">
  14.     <div class="header">
  15.     <div class="header__inner">
  16.         <div class="header__title">木こりがいない時代だからこそ、テクノロジーで森を守る。植林が未来の町を守り、地域を豊かにする。</div>
  17.         <button class="header__action" onclick="window.location.href='{{ url('help_about') }}'" aria-label="運営について">
  18.             <span class="header__action-text">運営について</span>
  19.             <img class="header__action-icon" src="{{ asset('assets/img/default/icons/icon-header-action.svg') }}" alt="" width="24" height="24" />
  20.         </button>
  21.     </div>
  22.     </div>
  24.     <!-- menu -->
  25.     <div class="header__menu header__menu-only">
  26.     <div class="header__menu-inner">
  27.         <div class="header__brand">
  28.             <a href="{{ url('homepage') }}">
  29.                 <img class="header__brand-logo" src="{{ asset('assets/img/default/icons/logo.svg') }}" alt="WoodTech" width="209" height="32" />
  30.             </a>
  31.             <span class="header__brand-caption">炭から始まる明るい未来</span>
  32.             <div class="header__brand-caption-line">
  33.             </div>
  34.         </div>
  37.         <div class="header__utility">
  38.         <nav class="header__nav" aria-label="グローバルナビ">
  39.             <ul class="header__nav-list">
  40.             <li class="header__nav-item"><a class="header__nav-link {% if app.request.uri == url('homepage') %}is-active{% endif %}" href="{{ url('homepage') }}">トップ</a></li>
  41.             <li class="header__nav-item"><a class="header__nav-link {% if app.request.uri == url('product_list') %}is-active{% endif %}" href="{{ url('product_list') }}">備長炭一覧</a></li>
  42.             <li class="header__nav-item"><a class="header__nav-link {% if app.request.uri == url('news_list') %}is-active{% endif %}" href="{{ url('news_list') }}">お知らせ</a></li>
  43.             <li class="header__nav-item"><a class="header__nav-link {% if app.request.uri == url('contact') %}is-active{% endif %}" href="{{ url('contact') }}">お問い合わせ</a></li>
  44.             </ul>
  45.         </nav>
  46.         <a class="header__utility-item" href="{{ url('mypage') }}">
  47.             <img class="header__utility-icon" src="{{ asset('assets/img/default/icons/icon-user.svg') }}" alt="" width="32" height="32" />
  48.             <span class="header__utility-label">マイページ</span>
  49.         </a>
  50.         <span class="header__utility-sep" aria-hidden="true"></span>
  51.         <a class="header__utility-item relative" href="{{ url('cart') }}">
  52.             <div class="cart-badge">
  53.                 <span class="cart-badge-text">{{ totalQuantity }}</span>
  54.             </div>
  55.             <img class="header__utility-icon" src="{{ asset('assets/img/default/icons/icon-cart.svg') }}" alt="" width="32" height="32" />
  56.             <span class="header__utility-label">カート</span>
  57.         </a>
  58.         <a class="header__utility-item header__utility-item-menu" href="#" onclick="javascript:void(0);" id="mobile-menu-button">
  59.             <img class="header__utility-icon header__utility-icon-menu" src="{{ asset('assets/img/default/icons/icon-menu.svg') }}" alt="" width="32" height="32" />
  60.             <svg class="header__utility-icon header__utility-icon-close" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" style="display: none;">
  61.             <path d="M8 8L24 24M24 8L8 24" stroke="#FFFFFF" stroke-width="2" stroke-linecap="round"/>
  62.             </svg>
  63.             <span class="header__utility-label text-white">メニュー</span>
  64.         </a>
  65.         </div>
  66.     </div>
  67.     </div>
  68.     <!-- menu mobile only -->
  69.     <div class="mobile-only-1200">
  70.     <div class="header__menu-mobile" id="mobile-menu">
  71.         <div class="header__menu-mobile-inner">
  72.         <div class="header__menu-mobile-nav">
  73.             <a class="header__menu-mobile-item" href="{{ url('homepage') }}">
  74.             <span class="header__menu-mobile-text">ホーム</span>
  75.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  76.             </a>
  77.             <a class="header__menu-mobile-item" href="{{ url('product_list') }}">
  78.             <span class="header__menu-mobile-text">備長炭一覧</span>
  79.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  80.             </a>
  81.             <a class="header__menu-mobile-item" href="{{ url('news_list') }}">
  82.             <span class="header__menu-mobile-text">お知らせ</span>
  83.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  84.             </a>
  85.             <a class="header__menu-mobile-item" href="{{ url('contact') }}">
  86.             <span class="header__menu-mobile-text">お問い合わせ</span>
  87.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  88.             </a>
  89.             <a class="header__menu-mobile-item" href="{{ url('help_faq') }}">
  90.             <span class="header__menu-mobile-text">よくある質問</span>
  91.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  92.             </a>
  93.             <a class="header__menu-mobile-item" href="{{ url('help_guide') }}">
  94.             <span class="header__menu-mobile-text">ご利用ガイド</span>
  95.             <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  96.             </a>
  97.             {% if is_granted('ROLE_USER') %}
  98.                 <a class="header__menu-mobile-item" href="{{ url('mypage') }}">
  99.                 <span class="header__menu-mobile-text">ご注文履歴</span>
  100.                 <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  101.                 </a>
  102.                 <a class="header__menu-mobile-item" href="{{ url('logout') }}">
  103.                 <span class="header__menu-mobile-text">ログアウト</span>
  104.                 <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  105.                 </a>
  106.             {% else %}
  107.                 <a class="header__menu-mobile-item" href="{{ url('entry') }}">
  108.                 <span class="header__menu-mobile-text">会員登録</span>
  109.                 <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  110.                 </a>
  111.                 <a class="header__menu-mobile-item" href="{{ url('mypage_login') }}">
  112.                 <span class="header__menu-mobile-text">ログイン</span>
  113.                 <img class="header__menu-mobile-arrow" src="{{ asset('assets/img/default/icons/icon-arrow-nav.svg') }}" alt="" width="24" height="24" />
  114.                 </a>
  115.             {% endif %}
  116.         </div>
  117.         <div class="header__menu-mobile-legal">
  118.             <a class="header__menu-mobile-legal-item" href="{{ url('help_about') }}">
  119.             <img class="header__menu-mobile-legal-icon" src="{{ asset('assets/img/default/icons/icon-arrow-legal.svg') }}" alt="" width="12" height="12" />
  120.             <span class="header__menu-mobile-legal-text">利用規約</span>
  121.             </a>
  122.             <a class="header__menu-mobile-legal-item" href="{{ url('help_privacy') }}">
  123.             <img class="header__menu-mobile-legal-icon" src="{{ asset('assets/img/default/icons/icon-arrow-legal.svg') }}" alt="" width="12" height="12" />
  124.             <span class="header__menu-mobile-legal-text">プライバシーポリシー</span>
  125.             </a>
  126.             <a class="header__menu-mobile-legal-item" href="{{ url('help_tradelaw') }}">
  127.             <img class="header__menu-mobile-legal-icon" src="{{ asset('assets/img/default/icons/icon-arrow-legal.svg') }}" alt="" width="12" height="12" />
  128.             <span class="header__menu-mobile-legal-text">特定商取引法に基づく表記</span>
  129.             </a>
  130.         </div>
  131.         </div>
  132.     </div>
  133.     </div>
  135.     <!-- button floating -->
  136.     <div class="button-floating button-floating-desktop">
  137.     <a class="button-floating__item button-floating__item--reorder" href="{{ url('product_list') }}">
  138.         <img class="button-floating__icon" src="{{ asset('assets/img/default/icons/icon-box-filled.svg') }}" alt="" width="32" height="32" />
  139.         <span class="button-floating__text">らくらく再注文</span>
  140.     </a>
  141.     <a class="button-floating__item button-floating__item--contact" href="{{ url('contact') }}">
  142.         <img class="button-floating__icon" src="{{ asset('assets/img/default/icons/icon-mail-outline.svg') }}" alt="" width="32" height="32" />
  143.         <span class="button-floating__text">お問い合わせ</span>
  144.     </a>
  145.     </div>
  147.     <div class="button-floating-mobile">
  148.     <a class="button-floating-mobile__reorder" href="{{ url('product_list') }}">
  149.         <img class="button-floating-mobile__icon" src="{{ asset('assets/img/default/icons/icon-box-filled.svg') }}" alt="" width="24" height="24" />
  150.         <span class="button-floating-mobile__text">らくらく再注文</span>
  151.     </a>
  152.     <a class="button-floating-mobile__contact" href="{{ url('contact') }}" aria-label="お問い合わせ">
  153.         <img class="button-floating-mobile__icon" src="{{ asset('assets/img/default/icons/icon-mail-outline.svg') }}" alt="" width="24" height="24" />
  154.     </a>
  155.     </div>
  156. </div>