butter-kanglam-ui/index.html

---
layout: default
---

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

<section class="content-area">
  <div class="container">
    <div class="content-area-topper">
      <img class="topper-img" src="{{site.baseurl}}{{ page_data.page_logo }}" alt="{% t page_logo_alt %}" />
      <h1 class="content-title mb-2 mt-2">{% t title %}</h1>
    </div>
    <div class="content-area-wrapper">
      <p class="content-subtitle text-black ls-40 mb-2">{% t apps_subtitle %}</p>
      <p class="content-text text-black ls-40 mb-2">{% t apps_text %}</p>
      <a class="btn-main btn-modal btn-split" href="#" data-micromodal-trigger="product-modal">
        <div class="btn-split">
          <div class="btn-logo">
            <img class="btn-android" src="/assets/images/btr-android.svg">
          </div>
          <div class="btn-text">
            <span class="button-main-text">{% t fdroid_button_text %}</span><br/>
            <span class="button-sub-text">{% t fdroid_button_subtext %}</span>  
          </div>  
        </div>
      </a>
      <input id="apps-expander" class="toggle" type="checkbox">
      <label for="apps-expander" class="lbl-toggle content-expander">{% t apps_expander_text %}</label>

      <div class="content-expanded">
        <p class="mb-2">{% t apps_expanded_text %}</p>
        <div class="content-img">
          <img src="{{site.baseurl}}{{ page_data.app_tiles_image }}" alt="{% t app_tiles_image_alt %}" />
        </div>
      </div>
    </div>
    {% if site.data.deployment.show_chat %}
    <div class="content-area-wrapper">
      <div class="split-content">
        <div class="left-content">
          <p class="content-subtitle text-black ls-40 mb-2">{% t chat_subtitle %}</p>
          <p class="content-text text-black ls-40 mb-2">{% t chat_text %}</p>
          <a class="btn-main uppercase" href="/chat">{% t chat_button_text %}</a>
        </div>
        <div class="right-bleed">
          <img src="/assets/images/btr-convene.png" alt="{% t page_logo_alt %}" />
        </div>
      </div>
      <a href="/chat/"><div class="content-expander">{% t chat_secondary_cta %}</div></a>
    </div>
    {% endif %}
  </div>
</section>

{% include modal.html %}