templates/themes/ismart/part/header.html.twig line 1

Open in your IDE?
  1. <header class="header">
  2.     <nav class="navbar navbar-expand-lg">
  3.         <div class="container-xxl d-flex justify-content-between">
  4.             <a class="navbar-brand" href="{{ forceSSL(url('frontend_site_default')) }}">
  5.                 {% set logo = getSettingValueByKey('header-logo') %}
  6.                <h1 class="m-0">
  7.                     <picture>
  8.                         {% if isMobile() %}
  9.                             <img
  10.                                     class="main-logo"
  11.     {#                                src="{{ getImageWebp(getImageBySize(logo, 'thumb')) }}"#}
  12.                                     src="{{ asset('themes/ismart') }}/img/logo_small_thumb.png"
  13.                                     alt="iSMART - Bứt phá giới hạn - Kiến tạo tương lai">
  14.                         {% else %}
  15.                             <img
  16.                                     class="main-logo"
  17.                                     {# src="{{ getImageWebp(logo) }}" #}
  18.                                     src="{{ asset('themes/ismart') }}/img/logo.png"
  19.                                     alt="iSMART - Bứt phá giới hạn - Kiến tạo tương lai">
  20.                         {% endif %}
  21.                     </picture>
  22.                 </h1>
  23.             </a>
  24.             <div class="d-flex gap-2 nav-icon">
  25.                 
  26.                 {% if isMobile() %}
  27.                    <button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
  28.                         aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
  29.                         <span class="menu">
  30.                             <svg height="20px" width="20px" id="Layer_1" style="fill:white;" version="1.1" viewBox="0 0 32 32" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M4,10h24c1.104,0,2-0.896,2-2s-0.896-2-2-2H4C2.896,6,2,6.896,2,8S2.896,10,4,10z M28,14H4c-1.104,0-2,0.896-2,2  s0.896,2,2,2h24c1.104,0,2-0.896,2-2S29.104,14,28,14z M28,22H4c-1.104,0-2,0.896-2,2s0.896,2,2,2h24c1.104,0,2-0.896,2-2  S29.104,22,28,22z"/></svg>
  31.                         </span>
  32.     {#                    <i class="zmdi zmdi-menu menu"></i>#}
  33.     {#                    <i class="zmdi zmdi-close close d-none"></i>#}
  34.                         <span class="close d-none">
  35.                             <svg height="20px" width="20px" style="fill:white;" version="1.1" viewBox="0 0 512 512" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M437.5,386.6L306.9,256l130.6-130.6c14.1-14.1,14.1-36.8,0-50.9c-14.1-14.1-36.8-14.1-50.9,0L256,205.1L125.4,74.5  c-14.1-14.1-36.8-14.1-50.9,0c-14.1,14.1-14.1,36.8,0,50.9L205.1,256L74.5,386.6c-14.1,14.1-14.1,36.8,0,50.9  c14.1,14.1,36.8,14.1,50.9,0L256,306.9l130.6,130.6c14.1,14.1,36.8,14.1,50.9,0C451.5,423.4,451.5,400.6,437.5,386.6z"/></svg>
  36.                         </span>
  37.                     </button>
  38.                 {% endif %}
  40.                 <div class="collapse navbar-collapse gap-0" id="navbarNav">
  42.                     {% set locale = app.request.get('_locale') %}
  43.                     {% set topMenu = getMenuByPosition('header', locale) %}
  44.                     
  45.                     {% if not isMobile() %}
  46.                         <ul class="top-navbar flex-row flex-wrap ms-md-auto">
  47.                             {% for item in topMenu.children %}
  48.                             <li class="nav-item">
  49.                                 <a class="nav-link" href="{{ item.url }}"
  50.                                                     target="_blank">{{ item.name }}</a>
  51.                             </li>
  52.                             {% endfor %}
  53.                             <li class="nav-item dropdown position-relative lang-switch"><a
  54.                                         class="nav-link dropdown-toggle d-flex align-items-center" type="button"
  55.                                         data-bs-toggle="dropdown" aria-expanded="false">
  56.                                     <img
  57.                                             width="16px" height="16px"
  58.                                             srcset="{{ asset('themes/ismart') }}/img/icon/vn_16.png"
  59.                                             src="{{ asset('themes/ismart') }}/img/icon/vn_16_small.webp"
  60.                                                                                             class="img-fluid" alt=""></a>
  61.                                 <div class="dropdown-menu">
  62.                                     <ul class="list-action">
  63.                                         <li>
  64.                                             <a class="dropdown-item" href="/vi">
  65.                                             <img
  66.                                                 width="16px" height="16px"
  67.                                                 srcset="{{ asset('themes/ismart') }}/img/icon/vn_16.png"
  68.                                                 src="{{ asset('themes/ismart') }}/img/icon/vn_16_small.webp"
  69.                                             class="img-fluid" alt="">Tiếng Việt
  70.                                             </a>
  71.                                         </li>
  72.                                         <li>
  73.                                             <a class="dropdown-item" href="/en">
  74.                                                 <img
  75.                                                     width="16px" height="16px"
  76.                                                     srcset="{{ asset('themes/ismart') }}/img/icon/en_16.png"
  77.                                                     src="{{ asset('themes/ismart') }}/img/icon/en_16_small.webp"
  78.                                                     class="img-fluid" alt="">English
  79.                                             </a>
  80.                                         </li>
  81.                                     </ul>
  82.                                 </div>
  83.                             </li>
  84.                         </ul>
  85.                     {% endif %}
  86.                     
  87.                     <ul class="navbar-nav flex-row flex-wrap ms-md-auto">
  88.                         {% set mainMenu = getMenuByPosition('main', locale) %}
  89.                         {% for itm in mainMenu.children %}
  90.                             {% set active = '' %}
  91.                             {% set path = path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) %}
  92.                             {% if path == itm.url %}
  93.                                 {% set active = 'active' %}
  94.                             {% endif %}
  95.                             {% if itm.children is empty %}
  96.                                 <li class="nav-item"><a class="nav-link {{ active }}" href="{{ itm.url }}">{{ itm.name }}</a></li>
  97.                             {% else %}
  98.                                 <li class="nav-item dropdown">
  99.                                     <a class="nav-link dropdown-toggle" href="{{ itm.url }}">{{ itm.name }}</a>
  100.                                     <div class="dropdown-menu">
  101.                                         <ul class="list-action">
  102.                                             {% set sub1s = itm.children %}
  103.                                             {% for itm1 in sub1s %}
  104.                                                 <li><a href="{{ itm1.url }}">{{ itm1.name }}</a></li>
  105.                                             {% endfor %}
  106.                                         </ul>
  107.                                     </div>
  108.                                 </li>
  109.                             {% endif %}
  110.                         {% endfor %}
  111.                         
  112.                         {% if isMobile() %}
  113.                             <li class="nav-item dropdown position-relative lang-switch d-block d-sm-none">
  114.                                 <a
  115.                                     class="nav-link dropdown-toggle d-flex align-items-center" type="button"
  116.                                     data-bs-toggle="dropdown" aria-expanded="false">
  117.                                     <img loading="lazy" src="{{ asset('themes/ismart') }}/img/icon/vn_16.png"
  118.                                                                                             class="img-fluid" alt="">
  119.                                 </a>
  120.                                 <div class="dropdown-menu">
  121.                                     <ul class="list-action">
  122.                                         <li>
  123.                                             <a class="dropdown-item" href="/vi">
  124.                                                 <img loading="lazy" src="{{ asset('themes/ismart') }}/img/icon/vn_16.png"
  125.                                                                                     class="img-fluid" alt="">Tiếng Việt</a>
  126.                                         </li>
  127.                                         <li>
  128.                                             <a class="dropdown-item" href="/en">
  129.                                                 <img loading="lazy" src="{{ asset('themes/ismart') }}/img/icon/en_16.png"
  130.                                                                                     class="img-fluid" alt="">English</a>
  131.                                         </li>
  132.                                     </ul>
  133.                                 </div>
  134.                             </li>
  135.                         {% endif %}
  136.                         
  137.                     </ul>
  138.                 </div>
  139.             </div>
  140.         </div>
  141.     </nav>
  142. </header>