Skip to main content

examples/basic/layouts/default.html 

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title><%= @page.title || "Astral Basic" %></title>
    <script type="module" src="<%= Astral.asset_path(@site, "app.ts") %>"></script>
  </head>
  <body>
    <header class="site-header">
      <a class="brand" href="/">Astral Basic</a>
      <nav aria-label="Main navigation">
        <a href="/about/">About</a>
        <a href="/blog/hello-astral/">Blog</a>
        <a href="/landing/">Landing</a>
      </nav>
    </header>

    <main class="page" data-route="<%= @route %>">
      <%= @content %>

      <%= if @route == "/" do %>
        <section class="post-list" aria-labelledby="posts-heading">
          <h2 id="posts-heading">Posts collection</h2>
          <%= for post <- Map.get(@collections, :posts, []) do %>
            <article>
              <h3><a href="<%= post.route_path %>"><%= post.data.title %></a></h3>
              <p><%= post.data.description %></p>
              <small><%= post.data.date %></small>
            </article>
          <% end %>
        </section>
      <% end %>
    </main>

    <footer class="site-footer">
      Built with Astral and Volt.
    </footer>
  </body>
</html>