memEx/lib/memex_web/live/home_live.html.heex

<div class="mx-auto flex flex-col justify-center items-stretch space-y-4 max-w-lg">
  <h1 class="title text-primary-400 text-xl">
    <%= gettext("memEx") %>
  </h1>

  <ul class="flex flex-col space-y-4">
    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("notes:") %>
      </b>
      <p>
        <%= gettext("document notes about individual items or concepts") %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("contexts:") %>
      </b>
      <p>
        <%= gettext("provide context around a single topic and hotlink to your notes") %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("pipelines:") %>
      </b>
      <p>
        <%= gettext("document your processes, attaching contexts to each step") %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center text-right space-y-2">
      <.link navigate={~p"/faq"} class="btn btn-primary">
        <%= gettext("read more on how to use memEx") %>
      </.link>
    </li>
  </ul>

  <hr class="hr" />

  <ul class="flex flex-col space-y-4">
    <h2 class="title text-primary-400 text-lg">
      <%= gettext("features") %>
    </h2>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("multi-user:") %>
      </b>
      <p>
        <%= gettext("built with sharing and collaboration in mind") %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("privacy:") %>
      </b>
      <p>
        <%= gettext("privacy controls on a per-note, context or pipeline basis") %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b class="whitespace-nowrap">
        <%= gettext("convenient:") %>
      </b>
      <p>
        <%= gettext("accessible from any internet-capable device") %>
      </p>
    </li>
  </ul>

  <hr class="hr" />

  <ul class="flex flex-col justify-center space-y-4">
    <h2 class="title text-primary-400 text-lg">
      <%= gettext("instance information") %>
    </h2>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b>
        <%= gettext("admins:") %>
      </b>
      <p class="flex flex-col justify-center items-center space-y-2">
        <%= if @admins |> Enum.empty?() do %>
          <.link href={~p"/users/register"} class="link">
            <%= dgettext("prompts", "register to setup memEx") %>
          </.link>
        <% else %>
          <.link :for={%{email: email} <- @admins} class="link" href={"mailto:#{email}"}>
            <%= email %>
          </.link>
        <% end %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b><%= gettext("registration:") %></b>
      <p>
        <%= case Accounts.registration_mode() do
          :public -> gettext("public signups")
          :invite_only -> gettext("invite only")
        end %>
      </p>
    </li>

    <li class="flex flex-col justify-center items-center space-y-2">
      <b><%= gettext("version:") %></b>
      <.link
        href="https://gitea.bubbletea.dev/shibao/memEx/src/branch/stable/changelog.md"
        class="flex flex-row justify-center items-center space-x-2 link"
        target="_blank"
        rel="noopener noreferrer"
      >
        <p><%= @version %></p>
        <i class="fas fa-md fa-info-circle"></i>
      </.link>
    </li>
  </ul>

  <hr class="hr" />

  <ul class="flex flex-col space-y-2">
    <h2 class="title text-primary-400 text-lg">
      <%= gettext("get involved") %>
    </h2>

    <li class="flex flex-col justify-center items-center space-y-2">
      <.link
        href="https://gitea.bubbletea.dev/shibao/memEx"
        class="flex flex-row justify-center items-center space-x-2 link"
        target="_blank"
        rel="noopener noreferrer"
      >
        <p><%= gettext("view the source code") %></p>
        <i class="fas fa-md fa-code"></i>
      </.link>
    </li>
    <li class="flex flex-col justify-center items-center space-y-2">
      <.link
        href="https://weblate.bubbletea.dev/engage/memEx"
        class="flex flex-row justify-center items-center space-x-2 link"
        target="_blank"
        rel="noopener noreferrer"
      >
        <p><%= gettext("help translate") %></p>
        <i class="fas fa-md fa-language"></i>
      </.link>
    </li>
    <li class="flex flex-col justify-center items-center space-y-2">
      <.link
        href="https://gitea.bubbletea.dev/shibao/memEx/issues/new"
        class="flex flex-row justify-center items-center space-x-2 link"
        target="_blank"
        rel="noopener noreferrer"
      >
        <p><%= gettext("report bugs or request features") %></p>
        <i class="fas fa-md fa-spider"></i>
      </.link>
    </li>
  </ul>
</div>