yeah
This commit is contained in:
parent
347b37b3be
commit
fa495b68e9
5 changed files with 132 additions and 100 deletions
|
|
@ -73,7 +73,7 @@
|
|||
/* === PAGE HEADER === */
|
||||
|
||||
header.page-header {
|
||||
@apply border-b border-slate-300;
|
||||
@apply border-b border-slate-300 mb-6;
|
||||
}
|
||||
|
||||
header.page-header h1 {
|
||||
|
|
@ -83,6 +83,20 @@
|
|||
header.page-header p {
|
||||
@apply mb-3;
|
||||
}
|
||||
|
||||
/* === PAGE GRID === */
|
||||
|
||||
section.page-grid {
|
||||
@apply grid grid-cols-1 md:grid-cols-3 gap-3;
|
||||
|
||||
> section {
|
||||
@apply col-span-1 md:col-span-2;
|
||||
}
|
||||
|
||||
> aside {
|
||||
@apply print:hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
|
|||
|
|
@ -2,13 +2,13 @@
|
|||
<h1><%= Enum.count(@notes) %> Bookmarks</h1>
|
||||
</header>
|
||||
|
||||
<section class="mt-6 grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<section class="col-span-1 md:col-span-2">
|
||||
<section class="page-grid">
|
||||
<section>
|
||||
<.note_list notes={@notes} layout={@channel.layout} />
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<aside>
|
||||
<.tag_list notes={@notes} />
|
||||
</section>
|
||||
</aside>
|
||||
</section>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,12 @@
|
|||
<p><%= Markdown.render(@channel.content) |> raw %></p>
|
||||
</header>
|
||||
|
||||
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
|
||||
<.note_list notes={@channel.notes}/>
|
||||
</div>
|
||||
<section class="page-grid">
|
||||
<section>
|
||||
<.note_list notes={@channel.notes} layout={@channel.layout} />
|
||||
</section>
|
||||
|
||||
<aside>
|
||||
<.tag_list notes={@channel.notes} />
|
||||
</aside>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -1,99 +1,111 @@
|
|||
<article class="h-entry hentry | stack container">
|
||||
<header>
|
||||
<h1 class="p-name | text-3xl leading-10 font-bold text-theme-base1">
|
||||
<%= @note.name %>
|
||||
</h1>
|
||||
</header>
|
||||
<section class="page-grid">
|
||||
<section>
|
||||
<article class="h-entry hentry | stack container">
|
||||
<header>
|
||||
<h1 class="p-name | text-3xl leading-10 font-bold text-theme-base1">
|
||||
<%= @note.name %>
|
||||
</h1>
|
||||
</header>
|
||||
|
||||
<section class="print:hidden">
|
||||
<ul class="flex gap-3">
|
||||
<li>
|
||||
<a href={~p"/admin/notes/#{@note}/edit"} class="button">
|
||||
Edit
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={~p"/admin/notes/#{@note}"} class="button">
|
||||
Show in Admin
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<aside>
|
||||
<.featured_images note={@note} />
|
||||
</aside>
|
||||
|
||||
<aside>
|
||||
<.featured_images note={@note} />
|
||||
</aside>
|
||||
<section class="p-summary e-content | prose max-w-none">
|
||||
<%= Markdown.render(@note.content) |> raw %>
|
||||
</section>
|
||||
|
||||
<%= if has_outline?(@note) do %>
|
||||
<aside class="prose max-w-none print:hidden">
|
||||
<div class="bg-theme-background1 rounded p-2">
|
||||
<%= raw(render_outline(@note)) %>
|
||||
</div>
|
||||
</aside>
|
||||
<% end %>
|
||||
<%= if not Enum.empty?(@note.links_to) do %>
|
||||
<section class="prose ">
|
||||
Notes linking here:
|
||||
<ul>
|
||||
<%= for link <- @note.links_to do %>
|
||||
<li><a href={~p"/note/#{link.slug}"}><%= link.name %></a></li>
|
||||
<% end %>
|
||||
</ul>
|
||||
</section>
|
||||
<% end %>
|
||||
|
||||
<section class="p-summary e-content | prose max-w-none">
|
||||
<%= Markdown.render(@note.content) |> raw %>
|
||||
</section>
|
||||
<%= if String.length(@note.url || "") > 0 do %>
|
||||
<section class="text-center">
|
||||
<.icon name="hero-link" /> <a href={@note.url}><%= @note.url %></a>
|
||||
</section>
|
||||
<% end %>
|
||||
|
||||
<%= if not Enum.empty?(@note.links_to) do %>
|
||||
<section class="prose ">
|
||||
Notes linking here:
|
||||
<ul>
|
||||
<%= for link <- @note.links_to do %>
|
||||
<li><a href={~p"/note/#{link.slug}"}><%= link.name %></a></li>
|
||||
<footer>
|
||||
<dl>
|
||||
<dt>
|
||||
<%= if @note.published_at do %>
|
||||
<span>Published</span>
|
||||
<% else %>
|
||||
<span>Unpublished</span>
|
||||
<% end %>
|
||||
</dt>
|
||||
<dd><time class="dt-published"><%= pretty_date(@note.published_at) %></time></dd>
|
||||
<dt>Last updated</dt>
|
||||
<dd>
|
||||
<time class="dt-published"><%= pretty_date(@note.published_at) %></time>
|
||||
</dd>
|
||||
<dt>Tags</dt>
|
||||
<dd><.tags note={@note} /></dd>
|
||||
<dt>Kind</dt>
|
||||
<dd><%= @note.kind %></dd>
|
||||
</dl>
|
||||
|
||||
<a href={~p"/"} class="hidden | h-card u-author">Inhji</a>
|
||||
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
||||
</footer>
|
||||
|
||||
<section>
|
||||
<%= if !Enum.empty?(@note.images) do %>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<%= for image <- @note.images do %>
|
||||
<a
|
||||
href={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :full_dithered)}
|
||||
class="lightbox | w-28"
|
||||
data-gallery="note"
|
||||
data-description={ChiyaWeb.Markdown.render(image.content)}
|
||||
>
|
||||
<img
|
||||
src={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :thumb_dithered)}
|
||||
class="rounded"
|
||||
/>
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
</section>
|
||||
|
||||
<aside class="prose max-w-none">
|
||||
<h3>Admin</h3>
|
||||
|
||||
<section>
|
||||
<ul>
|
||||
<li>
|
||||
<a href={~p"/admin/notes/#{@note}/edit"} class="button">
|
||||
Edit
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href={~p"/admin/notes/#{@note}"} class="button">
|
||||
Show in Admin
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<% end %>
|
||||
|
||||
<%= if String.length(@note.url || "") > 0 do %>
|
||||
<section class="text-center">
|
||||
<.icon name="hero-link" /> <a href={@note.url}><%= @note.url %></a>
|
||||
</section>
|
||||
<% end %>
|
||||
<h3>Outline</h3>
|
||||
|
||||
<footer>
|
||||
<dl>
|
||||
<dt>
|
||||
<%= if @note.published_at do %>
|
||||
<span>Published</span>
|
||||
<% else %>
|
||||
<span>Unpublished</span>
|
||||
<% end %>
|
||||
</dt>
|
||||
<dd><time class="dt-published"><%= pretty_date(@note.published_at) %></time></dd>
|
||||
<dt>Last updated</dt>
|
||||
<dd>
|
||||
<time class="dt-published"><%= pretty_date(@note.published_at) %></time>
|
||||
</dd>
|
||||
<dt>Tags</dt>
|
||||
<dd><.tags note={@note} /></dd>
|
||||
<dt>Kind</dt>
|
||||
<dd><%= @note.kind %></dd>
|
||||
</dl>
|
||||
|
||||
<a href={~p"/"} class="hidden | h-card u-author">Inhji</a>
|
||||
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
||||
</footer>
|
||||
|
||||
<section>
|
||||
<%= if !Enum.empty?(@note.images) do %>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<%= for image <- @note.images do %>
|
||||
<a
|
||||
href={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :full_dithered)}
|
||||
class="lightbox | w-28"
|
||||
data-gallery="note"
|
||||
data-description={ChiyaWeb.Markdown.render(image.content)}
|
||||
>
|
||||
<img
|
||||
src={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :thumb_dithered)}
|
||||
class="rounded"
|
||||
/>
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
<%= if has_outline?(@note) do %>
|
||||
<aside>
|
||||
<div class="bg-theme-background1 rounded p-2">
|
||||
<%= raw(render_outline(@note)) %>
|
||||
</div>
|
||||
</aside>
|
||||
<% end %>
|
||||
</section>
|
||||
</article>
|
||||
</aside>
|
||||
</section>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,12 +3,12 @@
|
|||
<p><%= Markdown.render(@channel.content) |> raw %></p>
|
||||
</header>
|
||||
|
||||
<section class="mt-6 grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<section class="col-span-1 md:col-span-2">
|
||||
<section class="page-grid">
|
||||
<section>
|
||||
<.note_list notes={@notes} />
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<aside>
|
||||
<.tag_list notes={@notes} />
|
||||
</section>
|
||||
</aside>
|
||||
</section>
|
||||
Loading…
Reference in a new issue