---
layout: layout
---

<%
  const fv = site.data.fediversei18n.article;
  const networks = site.data.common.list;
  const protocols = site.data.common.protocols;
  const langs = site.data.common.langs;
%>

<%- partial('_partial/heroheader') %>

<main class="contents">
  <div class="section">
    <h4>Fediverse</h4><span><%= fv.definition %></span>
  </div>

  <p><%= fv.preamble %></p>

  <div class="section">
    <h4><%- __('networks') %></h4>
    <ul class="section-list">
      <% for (item in networks) { %>
      <li class="u-inline">
        <a href="<%= networks[item].url %>"><%= networks[item].title %></a><span>,&nbsp;&nbsp;</span>
      </li>
      <% } %>
    </ul>
  </div>

  <div class="section">
    <h4><%- __('protocols') %></h4>
    <ul class="section-list">
      <% for (item in protocols) { %>
      <li class="u-inline">
        <a href="<%= protocols[item].url %>"><%= protocols[item].name %></a><span>,&nbsp;&nbsp;</span>
      </li>
      <% } %>
    </ul>
  </div>

  <div class="section">
    <h4><%- __('langs') %></h4>
    <ul class="article-list">
      <% for (item in langs) { %>
      <li><strong><%= langs[item].name %></strong>: <%= langs[item].networks %></li>
      <% } %>
    </ul>
  </div>

  <p><%= fv.info %></p>

  <div class="section">
    <h4><%- __('history') %></h4>
    <ul>
      <% for (item in fv.history) { %>
      <li><a href="<%= fv.history[item].url %>"><%= fv.history[item].title %></a></li>
      <% } %>
    </ul>
  </div>

  <div class="section">
    <h4><%- __('projects') %></h4>
    <ul>
      <% for (item in fv.projects) { %>
      <li><a href="<%= fv.projects[item].url %>"><%= fv.projects[item].title %></a></li>
      <% } %>
    </ul>
  </div>

  <div class="section">
    <h4><%- __('reading') %></h4>
    <ul>
      <% for (item in fv.reading) { %>
        <li><a href="<%= fv.reading[item].url %>"><%= fv.reading[item].title %></a></li>
      <% } %>
      <li><a href="<%= url_for(page.lang + '/post/FAQ-for-newcomers') %>"><%- __('faq4newbs') %></a></li>
      <li>
        <a href="<%= url_for(page.lang + '/post/Why-use-federated-networks') %>"><%- __('whyUseFediverse') %></a>
      </li>
    </ul>
  </div>

  <%- partial('_partial/buttons') %>
</main>