Packages

sayfa

0.2.0
0.6.0 0.5.0 0.4.2 0.4.1 0.4.0 0.3.3 0.3.2 0.3.1 0.3.0 0.2.0 0.1.1 0.1.0

A simple, extensible static site generator built in Elixir

HexDocs

Current section

Files

Jump to
Readme
12 Versions
7 Dependencies
Dependants
Files
Activity
sayfa priv default_theme layouts list.html.eex
Raw

priv/default_theme/layouts/list.html.eex 

<section class="container-content page-wrapper">

  <h1 class="text-2xl sm:text-3xl font-bold text-slate-900 dark:text-slate-50 mb-10"><%= @page_title %></h1>

<%= if @contents == [] do %>

  <p class="text-slate-400 dark:text-slate-500 text-sm py-8"><%= @t.("no_content_yet") %></p>

<% else %>

<%= cond do %>

<% @content_type == "notes" -> %>

  <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">

<%= for item <- @contents do %>

    <a href="<%= Sayfa.Content.url(item) %>" class="group block rounded-lg border border-slate-200/70 dark:border-slate-800 bg-slate-50 dark:bg-slate-800/50 p-4 hover:border-primary/30 dark:hover:border-primary/30 transition-colors">

      <h2 class="text-sm font-medium text-slate-800 dark:text-slate-200 group-hover:text-primary dark:group-hover:text-primary-400"><%= item.title %></h2>

<%= if item.date do %>

      <div class="mt-2"><time datetime="<%= item.date %>" class="text-xs text-slate-400 dark:text-slate-500"><%= @format_date.(item.date) %></time></div>

<% end %>

    </a>

<% end %>

  </div>

<% @content_type == "projects" -> %>

  <div class="space-y-3">

<%= for item <- @contents do %>

    <a href="<%= Sayfa.Content.url(item) %>" class="group block rounded-lg border border-slate-200/70 dark:border-slate-800 bg-slate-50 dark:bg-slate-800/50 p-4 hover:border-primary/30 dark:hover:border-primary/30 transition-colors">

      <div class="flex items-center gap-2">

        <h2 class="text-sm font-medium text-slate-800 dark:text-slate-200 group-hover:text-primary dark:group-hover:text-primary-400"><%= item.title %></h2>

<%= if Map.get(item.meta, "status") do %>

        <span class="inline-flex items-center h-5 px-1.5 rounded text-xs font-medium bg-emerald-50 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400"><%= item.meta["status"] %></span>

<% end %>

      </div>

<%= if Map.get(item.meta, "excerpt") do %>

      <p class="mt-1.5 text-sm text-slate-500 dark:text-slate-400 leading-relaxed"><%= item.meta["excerpt"] %></p>

<% end %>

<%= if item.categories != [] do %>

      <div class="mt-2.5 flex flex-wrap items-center gap-2">

<%= for cat <- item.categories do %>

        <span class="inline-flex items-center gap-0.5 h-5 px-1.5 rounded text-xs font-medium bg-amber-50 text-amber-600 dark:bg-amber-900/20 dark:text-amber-400"><svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/></svg><%= cat %></span>

<% end %>

      </div>

<% end %>

<%= if item.tags != [] do %>

      <div class="mt-2.5 flex flex-wrap items-center gap-2">

<%= for tag <- item.tags do %>

        <span class="inline-flex items-center gap-0.5 h-5 px-1.5 rounded text-xs font-medium bg-slate-100 text-slate-500 dark:bg-slate-800 dark:text-slate-400"><svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><line x1="4" x2="20" y1="9" y2="9"/><line x1="4" x2="20" y1="15" y2="15"/><line x1="10" x2="8" y1="3" y2="21"/><line x1="16" x2="14" y1="3" y2="21"/></svg><%= tag %></span>

<% end %>

      </div>

<% end %>

    </a>

<% end %>

  </div>

<% true -> %>

  <div class="space-y-0">

<%= for item <- @contents do %>

    <a href="<%= Sayfa.Content.url(item) %>" class="list-accent group block py-5 border-b first:border-t border-slate-200/70 dark:border-slate-800">

      <h2 class="text-base font-medium text-slate-800 dark:text-slate-200 group-hover:text-primary dark:group-hover:text-primary-400"><%= item.title %></h2>

<%= if Map.get(item.meta, "excerpt") do %>

      <p class="mt-1.5 text-sm text-slate-500 dark:text-slate-400 leading-relaxed"><%= item.meta["excerpt"] %></p>

<% end %>

      <div class="mt-2.5 flex flex-wrap items-center gap-3">

<%= if item.date do %>

        <time datetime="<%= item.date %>" class="text-xs text-slate-400 dark:text-slate-500"><%= @format_date.(item.date) %></time>

<% end %>

<%= if item.categories != [] do %>

        <div class="flex flex-wrap gap-1.5">

<%= for cat <- item.categories do %>

          <span class="inline-flex items-center gap-0.5 h-5 px-1.5 rounded text-xs font-medium bg-amber-50 text-amber-600 dark:bg-amber-900/20 dark:text-amber-400"><svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/></svg><%= cat %></span>

<% end %>

        </div>

<% end %>

<%= if item.tags != [] do %>

        <div class="flex flex-wrap gap-1.5">

<%= for tag <- item.tags do %>

          <span class="inline-flex items-center gap-0.5 h-5 px-1.5 rounded text-xs font-medium bg-slate-100 text-slate-500 dark:bg-slate-800 dark:text-slate-400"><svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true"><line x1="4" x2="20" y1="9" y2="9"/><line x1="4" x2="20" y1="15" y2="15"/><line x1="10" x2="8" y1="3" y2="21"/><line x1="16" x2="14" y1="3" y2="21"/></svg><%= tag %></span>

<% end %>

        </div>

<% end %>

      </div>

    </a>

<% end %>

  </div>

<% end %>

<% end %>

<%= if assigns[:pagination] && @pagination do %>

  <nav class="mt-10 flex items-center justify-between" aria-label="Pagination">

<%= if @pagination.has_prev do %>

    <a href="<%= @pagination.prev_url %>" rel="prev" class="btn-primary text-sm">

      <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>

      <%= @t.("previous") %>

    </a>

<% else %>

    <span class="btn-primary text-sm opacity-50 cursor-not-allowed pointer-events-none" aria-disabled="true">

      <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>

      <%= @t.("previous") %>

    </span>

<% end %>

    <span class="text-sm text-slate-400 dark:text-slate-500"><%= @pagination.page_number %> / <%= @pagination.total_pages %></span>

<%= if @pagination.has_next do %>

    <a href="<%= @pagination.next_url %>" rel="next" class="btn-primary text-sm">

      <%= @t.("next") %>

      <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>

    </a>

<% else %>

    <span class="btn-primary text-sm opacity-50 cursor-not-allowed pointer-events-none" aria-disabled="true">

      <%= @t.("next") %>

      <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>

    </span>

<% end %>

  </nav>

<% end %>

</section>