templates/components/mobile_search.html.twig line 1

Open in your IDE?
  1. <section class="mobile-search-layer" id="mobileSearch" role="dialog" aria-modal="true" aria-label="Мобильный поиск" aria-hidden="true" inert>
  2.   <div class="mobile-search-page">
  3.     <header class="mobile-search-topbar">
  4.       <button class="mobile-search-back" id="mobileSearchBack" type="button" aria-label="Назад">
  5.         <svg viewBox="0 0 24 24" fill="none" aria-hidden="true">
  6.           <path d="M19 12H5m6-6-6 6 6 6" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" />
  7.         </svg>
  8.       </button>
  9.       <form class="mobile-search-form" role="search">
  10.         <svg viewBox="0 0 24 24" fill="none" aria-hidden="true">
  11.           <circle cx="10.8" cy="10.8" r="6.8" stroke="currentColor" stroke-width="2" />
  12.           <path d="m16 16 4.2 4.2" stroke="currentColor" stroke-width="2" stroke-linecap="round" />
  13.         </svg>
  14.         <input type="search" name="mobile-query" placeholder="Найти товар" aria-label="Найти товар" autocomplete="off" />
  15.       </form>
  16.     </header>
  18.     <section class="mobile-search-section mobile-search-services-section">
  19.       <h2>Игры и игровые сервисы</h2>
  20.       <div class="mobile-search-cards" aria-label="Игры и игровые сервисы">
  21.         <a class="mobile-search-card" href="#"><img src="/assets/service-steam.png" alt="" /><strong>Steam</strong></a>
  22.         <a class="mobile-search-card" href="#"><img src="/assets/service-telegram.png" alt="" /><strong>Telegram</strong></a>
  23.         <a class="mobile-search-card" href="#"><img src="/assets/service-roblox.png" alt="" /><strong>Roblox</strong></a>
  24.         <a class="mobile-search-card" href="#"><img src="/assets/service-brawl.png" alt="" /><strong>Brawl...</strong></a>
  25.         <a class="mobile-search-card mobile-search-more" href="#">
  26.           <span><img src="/assets/more-service.svg" alt="" /></span>
  27.           <strong>еще 841</strong>
  28.         </a>
  29.       </div>
  30.     </section>
  32.     <section class="mobile-search-section mobile-search-new-section">
  33.       <h2>Новинки и предзаказы</h2>
  34.       <div class="mobile-search-cards mobile-search-game-cards" aria-label="Новинки и предзаказы">
  35.         <a class="mobile-search-card" href="#"><img src="/assets/article-paradise.png" alt="" /><span>Gothic 1<br />Remake</span></a>
  36.         <a class="mobile-search-card" href="#"><img src="/assets/article-sale.png" alt="" /><span>Forza<br />Horizon 6</span></a>
  37.         <a class="mobile-search-card" href="#"><img src="/assets/product-pubg.png" alt="" /><span>Assassin's<br />Creed:...</span></a>
  38.         <a class="mobile-search-card" href="#"><img src="/assets/article-mobile.png" alt="" /><span>007 First<br />Light</span></a>
  39.         <a class="mobile-search-card" href="#"><img src="/assets/article-sale.png" alt="" /><span>Call of Duty:<br />Modern...</span></a>
  40.       </div>
  41.     </section>
  43.     <nav class="mobile-search-platforms" aria-label="Разделы каталога">
  44.       <a href="#"><span>Steam</span><span aria-hidden="true">›</span></a>
  45.       <a href="#"><span>PlayStation</span><span aria-hidden="true">›</span></a>
  46.       <a href="#"><span>Xbox</span><span aria-hidden="true">›</span></a>
  47.       <a href="#"><span>Nintendo</span><span aria-hidden="true">›</span></a>
  48.       <a href="#"><span>Battle.net</span><span aria-hidden="true">›</span></a>
  49.       <a href="#"><span>Подборки</span><span aria-hidden="true">›</span></a>
  50.     </nav>
  51.   </div>
  52. </section>