Search bar @search-bar

Stable
<!-- Search bar -->
<div class="search-bar" data-source="/data/search-bar.json">
  <div class="search-bar__inner">
    <form class="search-bar__form" autocomplete="off" method="get" action="/suchergebnisse" _lpchecked="1"><label class="search-bar__input-label" for="search-term">Suchbegriff</label>
      <div class="search-bar__buttons-left"><button class="search-bar__close" value="Suche schlie├čen"><svg width="19" height="14" xmlns="http://www.w3.org/2000/svg">
            <path d="M6.716.589a.5.5 0 0 1 .638.057l.057.07a.5.5 0 0 1-.057.638L2.209 6.499 18 6.5a.5.5 0 0 1 .09.992L18 7.5 2.207 7.499l5.147 5.147.057.07a.5.5 0 0 1-.765.638L.293 7 6.646.646Z" fill="#000" fill-rule="nonzero" /></svg></button></div><input class="search-bar__input" autocomplete="off" type="text" placeholder="Suchbegriff" required="required" name="tx_solr[q]" />
      <div class="search-bar__buttons-right"><button class="search-bar__reset" type="reset" value="Zur├╝cksetzen" aria-hidden="true"></button><button class="search-bar__button" type="submit" value="Suchen"></button></div>
    </form>
    <div class="search-bar__suggestions" aria-hidden="true">
      <div class="search-bar__suggestions-inner">
        <div class="search-bar__list-title">Oft gesucht</div>
        <div class="search-bar__list"></div>
      </div>
    </div>
  </div>
</div>