---
layout: default
---

{% assign page_data = site.data.home %}

<div class="container">
  <div class="content">
    <img src="{{ site.baseurl }}/assets/images/btr-logo.svg" alt="Paddy, the Butter Box Mascot"
      class="drippy" />
    <h1 class="homepage-title">{% t butter_box_title %}</h1>
    <h1 class="homepage-subtitle">{% t butter_box_subtitle %}</h1>
    <!-- Defaults to display: none; revealed via JS depending on USB insertion. -->
    <div class="card-set">
      <div id="usb-butter-placeholder" class="card">
        {% t explore_missing %}
      </div>
      <a href="{{ site.usb_butter_url }}" id="usb-butter" style="display: none;" data-url="{{ site.usb_butter_url }}"
        class="card">
        <img src="{{ site.baseurl }}/assets/images/explore-icon.svg" alt="Explore Icon" class="card-icon">
        {% t explore %}
      </a>
      <a href="/chat/#/room/%23public%3A{{site.data.deployment.chat_server}}" class="card">
        <img src="{{ site.baseurl }}/assets/images/message-icon.svg" alt="Message Icon" class="card-icon">
        {% t message_board %}
      </a>
      <a href="{{ site.baseurl }}/apps" class="card">
        <img src="{{ site.baseurl }}/assets/images/appstore-icon.svg" alt="App Store Icon" class="card-icon">
        {% t app_store %}
      </a>
      <a href="{{ site.baseurl }}/maps" class="card">
        <img src="{{ site.baseurl }}/assets/images/maps-icon.svg" alt="Maps Icon" class="card-icon">
        {% t offline_maps %}
      </a>
    </div>
  </div>
</div>