{% extends "_base.html" %}
{% load i18n %}
{% block title %}Labelbase{% endblock %}
{% block nav_home %}active{% endblock %}

{% block content %}
  <style>
    .lb-header {
      max-width: 810px;
    }
  </style>
  <div class="p-3 pb-md-4 mx-auto text-center">
    <h1 style="padding-top: 1.6em; padding-bottom: 0.9em; text-transform: uppercase;font-weight:800;">L<span style="height:1.1em; width:1em" data-feather="tag" class="align-text-bottom"></span>belbase</h1>
    <h2 class="display-6 fw-normal" style="padding-bottom: 0.9em;">All your labels in one place.</h2>
    <p class="lb-header mx-auto text-center fs-5 text-muted">Labelbase is a label management service for Bitcoin transactions and addresses.</p>
    <p class="lb-header mx-auto text-center fs-5 text-muted">Labelbase provides features for adding labels, importing and exporting labels, and offers a public API for integration with wallets and existing workflows.<br>
      This ensures that you always have access to the most up-to-date information.</p>
    <p class="lb-header mx-auto text-center fs-5 text-muted"> Labelbase supports BIP-329, a format for unifying label data.</p>
  </div>




  <main class="lb-header mx-auto text-center">

      <div class="row row-cols-1 row-cols-md-3 mb-3 text-center">

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/utxo_source.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">Do you know where that coin came from? No?!</p><p><a href="https://en.bitcoin.it/wiki/Privacy">Learn more</a></p>
                <!-- Instead of "learn more" change to "why is this important?" -->
            </div>
          </div>
        </div>

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/API_who.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">Who sends data to Labelbase?<br>&nbsp;</p><p><a href="#">Supported wallets</a></p>
              <!--button type="button" class="w-100 btn btn-lg btn-outline-primary">Sign up for free</button-->
            </div>
          </div>
        </div>

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/Choices.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">Seamless interoperability based on BIP-329</p><p><a href="/interoperational">Learn more</a></p>

            </div>
          </div>
        </div>
      </div>

      <!--

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm border-primary">
            <img src="/static/Handshake.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em; padding-bottom: 1em;">
            <div class="card-body">
              <p>&nbsp;</p>
              <a href="{{ reg_url }}" type="button" class="w-100 btn btn-lg btn-primary">Get started</a>
            </div>
          </div>
        </div>
      </div>
      -->






    </main>
    <main class="lb-header mx-auto text-center">

      <div class="row row-cols-1 row-cols-md-3 mb-3 text-center">

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/Encryption.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">Your labels are encrypted.<br>&nbsp;</p><p><a href="/encryption">Learn more</a></p>

            </div>
          </div>
        </div>

        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/FAQ.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">Need more answers?<br>&nbsp;</p><p><a href="/faq">View the FAQ</a></p>
            </div>
          </div>
        </div>


        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <img src="/static/API_usage.png"
              class="card-img-top"
              alt="..."
              style="padding: 0.25em;">

            <div class="card-body">
              <p style="font-weight: 700;">How to send data to Labelbase?</p><p><a href="/api-reference/">API Reference</a></p>
            </div>
          </div>
        </div>

      </div>

      <footer class="text-center mt-5">
        <p class="lb-header mx-auto text-center fs-5 text-muted">
            Ready to take control of your Bitcoin labels?<br><br>
            <!--
             Sign up for Labelbase today and experience seamless label management, enhanced privacy, and simplified workflows.
             -->
            Get started with Labelbase today and experience seamless label management, enhanced privacy, and simplified workflows.
        </p>
        <a href="{{ reg_url }}" type="button" class="btn btn-lg btn-primary" style="margin-bottom:2rem;">Get started</a>

      </footer>

    </main>


    {#% include "footer.html" %#}
    {% comment %}

  {% url 'registration' as reg_url %}
  {% url 'two_factor:login' as login_url %}
  {% url 'two_factor:setup' as setup_url %}
  {% url 'logout' as logout_url %}
  {% url 'secret' as secret_url %}

  <h4>{% trans "Next steps:" %}</h4>
  <ol>
    <li>{% blocktrans trimmed %}Start by <a href="{{ reg_url }}">registering</a> an
      account.{% endblocktrans %}</li>
    <li>{% blocktrans trimmed %}<a href="{{ login_url }}">Login</a> to your account.
      {% endblocktrans %}</li>
    <li>{% blocktrans trimmed %}<a href="{{ setup_url }}">Enable</a> two-factor
      authentication.{% endblocktrans %}</li>
    <li>{% blocktrans trimmed %}Then, <a href="{{ logout_url }}">logout</a> and
      <a href="{{ login_url }}">login</a> once more to your account to see
      two-factor authentication at work.{% endblocktrans %}</li>
    <li>{% blocktrans trimmed %}At last, you've gained access to the
      <a href="{{ secret_url }}">secret page</a>! :-){% endblocktrans %}</li>
  </ol>


  {% endcomment %}
{% endblock %}