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

<div class="flex flex-col justify-center items-center text-center space-y-4">
  <h1 class="title text-primary-400 text-2xl">
    <%= gettext("memex") %>
  </h1>

  <hr class="hr" />

  <ul class="flex flex-col space-y-4 text-center">
    <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>
  </ul>

  <hr class="hr" />

  <ul class="flex flex-col space-y-4 text-center">
    <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 space-y-4 text-center">
    <h2 class="title text-primary-400 text-lg">
      <%= gettext("Instance Information") %>
    </h2>

    <li class="flex flex-col justify-center space-x-2">
      <b>
        <%= gettext("Admins:") %>
      </b>
      <p>
        <%= if @admins |> Enum.empty?() do %>
          <.link
            href={Routes.user_registration_path(MemexWeb.Endpoint, :new)}
            class="hover:underline"
          >
            <%= dgettext("prompts", "Register to setup %{name}", name: "memex") %>
          </.link>
        <% else %>
          <div class="flex flex-wrap justify-center space-x-2">
            <%= for admin <- @admins do %>
              <a class="hover:underline" href={"mailto:#{admin.email}"}>
                <%= admin.email %>
              </a>
            <% end %>
          </div>
        <% end %>
      </p>
    </li>

    <li class="flex flex-row justify-center space-x-2">
      <b>Registration:</b>
      <p>
        <%= Application.get_env(:memex, MemexWeb.Endpoint)[:registration]
        |> case do
          "public" -> gettext("Public Signups")
          _ -> gettext("Invite Only")
        end %>
      </p>
    </li>

    <li class="flex flex-row justify-center items-center space-x-2">
      <b>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 hover:underline"
        target="_blank"
        rel="noopener noreferrer"
      >
        <p>0.1.0</p>
        <i class="fas fa-md fa-info-circle"></i>
      </.link>
    </li>
  </ul>

  <hr class="hr" />

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

    <li class="flex flex-col justify-center space-x-2">
      <.link
        href="https://gitea.bubbletea.dev/shibao/memex"
        class="flex flex-row justify-center items-center space-x-2 hover:underline"
        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 space-x-2">
      <.link
        href="https://weblate.bubbletea.dev/engage/memex"
        class="flex flex-row justify-center items-center space-x-2 hover:underline"
        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 space-x-2">
      <.link
        href="https://gitea.bubbletea.dev/shibao/memex/issues/new"
        class="flex flex-row justify-center items-center space-x-2 hover:underline"
        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>