<div class="store-selector-logo-container">
          <img class="store-selector-logo-img" src="img/header-banner.png">
      </div>

      <header>Header</header>

      <!-- TODO: take a look at sticky headers with categories -->


    <!-- change store button -->
    <a sticky-header
      class="item item-text-wrap change-store"
      ng-click="changeStore()"
      ng-if="company.isMultiLocation == true"
    >
      <h2>{{ order.location.Name }}</h2>
      <span class="badge badge-balanced">Change Store</span>
    </a>

    <div class="padding">
      <!-- search bar -->
      <label class="item item-input">
        <i class="icon ion-search placeholder-icon"></i>
        <input
          type="text"
          ng-model="search.Name"
          placeholder="Search Menu..."
        /> </label
      ><br />

      <!-- products list -->
      <div class="list">
        <div ng-repeat="category in products | orderBy:'sortOrder'">
          <div
            class="item item-divider order-item-divider"
            ng-if="filteredProducts.length > 0"
          >
            {{ category.Name }}
          </div>
          <a
            ng-repeat="item in category.products | orderBy: 'sortOrder' | filter:search as filteredProducts"
            class="item item-text-wrap"
            ng-click="openProductDetail(item)"
          >
            <h2>{{ item.Name }}</h2>
            <span class="menu-product-desc">{{ item.Description }}</span>
            <span class="badge badge-balanced">{{
              getDefaultCost(item.id) | currency
            }}</span>
          </a>
          <br ng-if="filteredProducts.length > 0" />
        </div>
      </div>
      <br />
    </div>