{% extends "base.html" %}
{% block content %} 

<div class="bg-image"></div>
<div class="container">
  <div class="text-center">
    <h1 class="stylized">Lemmy</h1>
    <h4>{{ trans(key="link_aggregator_fediverse", lang=lang) }}</h4>
    <div class="row is-horizontal-align">
      <div class="col-2-lg">
        <a class="button primary" href="/join">{{ trans(key="join_a_server", lang=lang) }}</a>
      </div>
      <div class="col-2-lg">
        <a class="button primary" href="/docs/en/administration/administration.html">{{ trans(key="run_a_server", lang=lang) }}</a>
      </div>
    </div>
  </div>
</div>

<br />

<div class="container">
  <div class="text-center">
    <h2>{{ trans(key="follow_communities", lang=lang) }}</h2>
    <p><a href="https://github.com/LemmyNet">Lemmy</a> {{ trans(key="is_similar_to_sites", lang=lang) }} <a href="https://reddit.com">Reddit</a>, <a href="https://lobste.rs">Lobste.rs</a>, or <a href="https://news.ycombinator.com/">Hacker News</a>: {{ trans(key="you_subscribe_to_create", lang=lang) }} <b>{{ trans(key="a_single_frontpage", lang=lang) }}</b> {{ trans(key="of_favorite_memes", lang=lang) }} </p>
    <p><a class="button primary" href="/join">{{ trans(key="join_a_server", lang=lang) }}</a></p>
  </div>
</div>
<br />

<div class="bg-success">
  <br />

  <div class="container">
    <div class="row">
      <div class="col-4">
        <div>
          <header class="is-center">
            <img height=180 src="images/review_pic.webp">
          </header>
          <br />
          <h4 class="text-center">{{ trans(key="open_source", lang=lang) }}</h4>
          <p> {{ trans(key="lemmy_remain_free", lang=lang) }} <a href="https://github.com/LemmyNet">{{ trans(key="open_source", lang=lang) }}</a>  {{ trans(key="using_the_strong", lang=lang) }} <a href="https://en.wikipedia.org/wiki/Copyleft">{{ trans(key="copyleft", lang=lang) }}</a> <a href="https://github.com/LemmyNet/lemmy/blob/master/LICENSE">{{ trans(key="agpl_license", lang=lang) }}</a>.</p>
        </div>
      </div>
      <div class="col-4">
        <div>
          <header class="is-center">
            <img height=180 src="/images/code_pic.webp">
          </header>
          <br />
          <h4 class="text-center">{{ trans(key="blazing_fast", lang=lang) }}</h4>
          <p>{{ trans(key="made_using", lang=lang) }} <a href="https://www.rust-lang.org">Rust</a>, <a href="https://actix.rs/">Actix</a>, <a href="http://diesel.rs/">Diesel</a>, <a href="https://infernojs.org">Inferno</a>, {{ trans(key="and", lang=lang) }} <a href="https://www.typescriptlang.org/">Typescript</a>.</p>
        </div>
      </div>
      <div class="col-4">
        <div>
          <header class="is-center">
            <img height=180 src="/images/mod_pic.webp">
          </header>
          <br />
          <h4 class="text-center">{{ trans(key="powerful_mod_tools", lang=lang) }}</h4>
          <p>{{ trans(key="each_server_can", lang=lang) }}</p>
        </div>
      </div>
    </div>
  </div>

  <br />
  <br />

  <div class="container">
    <div class="text-center">
      <h2>{{ trans(key="create_platform", lang=lang) }}</h2>
      <p>{{ trans(key="with_lemmy", lang=lang) }} <a href="/docs/en/administration/administration.html">{{ trans(key="easily_host", lang=lang) }}</a>, {{ trans(key="and_all_these", lang=lang) }} <i>{{ trans(key="federated", lang=lang) }}</i> {{ trans(key="think_email", lang=lang) }} <a href="https://en.wikipedia.org/wiki/Fediverse">{{ trans(key="fediverse", lang=lang) }}</a>. {{ trans(key="for_a_link_aggregator", lang=lang) }}</p>
      <p>
      <a class="button primary" href="/docs/en/administration/administration.html">{{ trans(key="run_a_server", lang=lang) }}</a>
      </p>
    </div>
  </div>
  <br />
</div>

<br />

<div class="container">
  <div class="row">
    <div class="col-6">
      <h4>{{ trans(key="live_updates", lang=lang) }}</h4>
      <p>{{ trans(key="new_comments", lang=lang) }}</p>
    </div>
    <div class="col-6 is-center">
      <video height=325 autoplay loop>
        <source src="images/reply_vid.webm">
      </video>
    </div>
  </div>
</div>

<br />
<br />

<div class="container">
  <div class="row">
    <div class="col-6 is-center">
      <img height=325 src="/images/mobile_pic.webp">
    </div>
    <div class="col-6">
      <h4 class="is-marginless">{{ trans(key="more_features", lang=lang) }}</h4>
      <ul class="is-marginless">
        <li>{{ trans(key="self_hostable", lang=lang) }} <a href="/docs/en/administration/install_docker.html">Docker</a>, {{ trans(key="or", lang=lang) }} <a href="/docs/en/administration/install_ansible.html">Ansible</a>.
        </li>
        <li>{{ trans(key="clean_interface", lang=lang) }}</li>
        <li>{{ trans(key="avatar_support", lang=lang) }}</li>
        <li>{{ trans(key="full_vote", lang=lang) }} <code>(+/-)</code> {{ trans(key="like_old_reddit", lang=lang) }}.</li>
        <li>{{ trans(key="themes_including", lang=lang) }}</li>
        <li>{{ trans(key="emojis_with", lang=lang) }} <code>:</code></li>
        <li>{{ trans(key="user_tagging", lang=lang) }} <code>@</code>, {{ trans(key="community_tagging", lang=lang) }} <code>!</code>.</li>
        <li>{{ trans(key="image_uploading", lang=lang) }}</li>
        <li>{{ trans(key="notifications_including", lang=lang) }}</li>
        <li><a href="https://weblate.yerbamate.ml/projects/lemmy/lemmy/">{{ trans(key="i18n_support", lang=lang) }}</a></li>
        <li>{{ trans(key="rss_feeds", lang=lang) }} <code>{{ trans(key="all", lang=lang) }}</code>, <code>{{ trans(key="subscribed", lang=lang) }}</code>, <code>{{ trans(key="inbox", lang=lang) }}</code>, <code>{{ trans(key="user", lang=lang) }}</code>, {{ trans(key="and", lang=lang) }} <code>{{ trans(key="community", lang=lang) }}</code>.</li>
        <li>{{ trans(key="can_fully_erase", lang=lang) }}</li>
        <li>{{ trans(key="nsfw_support", lang=lang) }}</li>
      </ul>
      </p>
    </div>
  </div>
</div>

<br />
<div class="bg-success">
  <br />
  <div class="container">
    <div class="text-center">
      <h2><a href="/sponsors">{{ trans(key="support_donate", lang=lang) }}</a></h2>
      <p>{{ trans(key="lemmy_is_free", lang=lang) }}</p>
      <div class="row is-horizontal-align">
        <div class="col-3">
          <a class="button primary" href="https://liberapay.com/Lemmy">{{ trans(key="support_liberapay", lang=lang) }}</a>
        </div>
        <div class="col-3">
          <a class="button primary" href="https://www.patreon.com/dessalines">{{ trans(key="support_patreon", lang=lang) }}</a>
        </div>
        <div class="col-3">
          <a class="col button primary" href="https://opencollective.com/lemmy">{{ trans(key="support_opencollective", lang=lang) }}</a>
        </div>
      </div>
    </div>
  </div>
  <br />
</div>

{% endblock content %}