{% extends "base.html" %}
{% block content %} 
<div class="container">
  <h1>Lemmy servers</h1>
  <p>Choose and join a server from the approved servers below.</p>

  <div class="row">

    <div class="card col-6">
      <header>
        <div class="row">
          <h4 class="col">dev.lemmy.ml</h4>
          <h4 class="col text-right"><i>5.9k users</i></h4>
        </div>
      </header>
      <div class="is-center">
        <img class="join-banner" src="/images/lemmy.svg" />
      </div>
      <br />
      <p class="join-desc">The main instance of lemmy.</p>
      <footer>
        <a class="button primary" href="https://dev.lemmy.ml">Join</a>
      </footer>
    </div>

    <div class="card col-6">
      <header>
        <div class="row">
          <h4 class="col">lemmygrad.ml</h4>
          <h4 class="col text-right"><i>2.3k users</i></h4>
        </div>
      </header>
      <div class="is-center">
        <img class="join-banner" src="https://lemmygrad.ml/pictrs/image/YI2XNWaVUv.png?format=webp" />
      </div>
      <br />
      <p class="join-desc">A collection of leftist communities, for memes, learning, news, discussion, media, or anything you like.</p>
      <footer>
        <a class="button primary" href="https://lemmygrad.ml">Join</a>
      </footer>
    </div>

    <div class="card col-6">
      <header>
        <div class="row">
          <h4 class="col">lemmy.161.social</h4>
          <h4 class="col text-right"><i>50 users</i></h4>
        </div>
      </header>
      <div class="is-center">
        <img class="join-banner" src="https://lemmy.161.social/pictrs/image/n3Stw3I1g0.png?format=webp" />
      </div>
      <br />
      <p class="join-desc">An anti-authoritarian and emancipatory space for german speaking anti-fascists.</p>
      <footer>
        <a class="button primary" href="https://lemmy.161.social">Join</a>
      </footer>
    </div>

  </div>

</div>
{% endblock content %}