devel #304
12 changed files with 81 additions and 89 deletions
|
@ -104,7 +104,11 @@
|
||||||
*/
|
*/
|
||||||
@layer components {
|
@layer components {
|
||||||
.divider {
|
.divider {
|
||||||
@apply flex items-center my-8 before:flex-1 after:flex-1 before:content-[''] after:content-[''] before:p-[0.5px] after:p-[0.5px] w-full mx-auto last:hidden;
|
@apply flex items-center my-8 before:flex-1 after:flex-1 before:content-[''] after:content-[''] before:p-[0.5px] after:p-[0.5px] w-full mx-auto last:hidden before:bg-slate-500/25 after:bg-slate-500/25 before:mr-2 after:ml-2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot {
|
||||||
|
@apply before:content-['·']
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -35,16 +35,6 @@ defmodule ChiyaWeb.PublicComponents do
|
||||||
"""
|
"""
|
||||||
end
|
end
|
||||||
|
|
||||||
@doc """
|
|
||||||
Renders a middot as divider
|
|
||||||
"""
|
|
||||||
attr :class, :string, default: "text-theme-primary"
|
|
||||||
|
|
||||||
def dot(assigns),
|
|
||||||
do: ~H"""
|
|
||||||
<span class={["font-bold", @class]}>·</span>
|
|
||||||
"""
|
|
||||||
|
|
||||||
@doc """
|
@doc """
|
||||||
Renders a horizontal line
|
Renders a horizontal line
|
||||||
"""
|
"""
|
||||||
|
@ -52,29 +42,6 @@ defmodule ChiyaWeb.PublicComponents do
|
||||||
do: ~H"""
|
do: ~H"""
|
||||||
<hr class="my-6 border-theme-base/20" />
|
<hr class="my-6 border-theme-base/20" />
|
||||||
"""
|
"""
|
||||||
|
|
||||||
attr :note, :map, required: true
|
|
||||||
attr :class_tag, :string, default: ""
|
|
||||||
attr :linked, :boolean, default: true
|
|
||||||
|
|
||||||
def tags(assigns) do
|
|
||||||
~H"""
|
|
||||||
<span class="inline-flex flex-row gap-1">
|
|
||||||
<%= for tag <- @note.tags do %>
|
|
||||||
<%= if assigns.linked do %>
|
|
||||||
<a class={["p-category", @class_tag]} href={~p"/tagged-with/#{tag.slug}"}>
|
|
||||||
<%= tag.name %>
|
|
||||||
</a>
|
|
||||||
<% else %>
|
|
||||||
<span class={["p-category", @class_tag]}>
|
|
||||||
<%= tag.name %>
|
|
||||||
</span>
|
|
||||||
<% end %>
|
|
||||||
<.dot class="last:hidden" />
|
|
||||||
<% end %>
|
|
||||||
</span>
|
|
||||||
"""
|
|
||||||
end
|
|
||||||
|
|
||||||
@doc """
|
@doc """
|
||||||
Renders a note-header with title.
|
Renders a note-header with title.
|
||||||
|
|
|
@ -22,8 +22,9 @@ defmodule ChiyaWeb.PageHTML do
|
||||||
attr :show_content, :boolean, default: true
|
attr :show_content, :boolean, default: true
|
||||||
def note_list_gallery(assigns)
|
def note_list_gallery(assigns)
|
||||||
|
|
||||||
def tag_list([]), do: "No Tags"
|
attr :note, :map, required: true
|
||||||
def tag_list(tags), do: Enum.map_join(tags, ", ", fn t -> t.name end)
|
attr :linked, :boolean, default: true
|
||||||
|
def tag_list(assigns)
|
||||||
|
|
||||||
def render_outline(note) do
|
def render_outline(note) do
|
||||||
note.content
|
note.content
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<aside>
|
<aside>
|
||||||
<.tag_list notes={@notes} />
|
<.tag_bar notes={@notes} />
|
||||||
</aside>
|
</aside>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
|
@ -9,6 +9,6 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<aside>
|
<aside>
|
||||||
<.tag_list notes={@channel.notes} />
|
<.tag_bar notes={@channel.notes} />
|
||||||
</aside>
|
</aside>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -33,25 +33,6 @@
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
<footer>
|
<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"/"} class="hidden | h-card u-author">Inhji</a>
|
||||||
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
||||||
</footer>
|
</footer>
|
||||||
|
@ -80,6 +61,33 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<aside class="prose max-w-none">
|
<aside class="prose max-w-none">
|
||||||
|
<h3>Outline</h3>
|
||||||
|
|
||||||
|
<%= if has_outline?(@note) do %>
|
||||||
|
<section>
|
||||||
|
<%= raw(render_outline(@note)) %>
|
||||||
|
</section>
|
||||||
|
<% end %>
|
||||||
|
|
||||||
|
<h3>Properties</h3>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<%= if @note.published_at do %>
|
||||||
|
<strong>Published</strong>
|
||||||
|
<% else %>
|
||||||
|
<strong>Unpublished</strong>
|
||||||
|
<% end %> <time class="dt-published"><%= pretty_date(@note.published_at) %></time>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<strong>Last updated</strong> <time class="dt-published"><%= pretty_date(@note.published_at) %></time>
|
||||||
|
</li>
|
||||||
|
<li><strong>Tags</strong> <.tag_list note={@note} /></li>
|
||||||
|
<li><strong>Kind</strong> <%= @note.kind %></li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
|
||||||
<h3>Admin</h3>
|
<h3>Admin</h3>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
|
@ -96,16 +104,6 @@
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<h3>Outline</h3>
|
|
||||||
|
|
||||||
<%= if has_outline?(@note) do %>
|
|
||||||
<aside>
|
|
||||||
<div class="bg-theme-background1 rounded p-2">
|
|
||||||
<%= raw(render_outline(@note)) %>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
<% end %>
|
|
||||||
</aside>
|
</aside>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
|
|
||||||
<%= if not Enum.empty?(note.tags) do %>
|
<%= if not Enum.empty?(note.tags) do %>
|
||||||
<span class="inline-block">
|
<span class="inline-block">
|
||||||
<.tags note={note} linked={false} />
|
<.tag_list note={note} linked={false} />
|
||||||
</span>
|
</span>
|
||||||
<% end %>
|
<% end %>
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -13,17 +13,19 @@
|
||||||
<%= raw(Markdown.render(note.content)) %>
|
<%= raw(Markdown.render(note.content)) %>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer class="text-slate-700">
|
||||||
<a href={~p"/note/#{note.slug}"}>
|
<a href={~p"/note/#{note.slug}"}>
|
||||||
<time>
|
<time>
|
||||||
<%= pretty_datetime(note.published_at) %>
|
<%= pretty_datetime(note.published_at) %>
|
||||||
</time>
|
</time>
|
||||||
</a>
|
</a>
|
||||||
<%= if not Enum.empty?(note.tags) do %>
|
<%= if not Enum.empty?(note.tags) do %>
|
||||||
<.dot />
|
<span class="dot" />
|
||||||
<.tags note={note} />
|
<.tag_list note={note} />
|
||||||
<% end %>
|
<% end %>
|
||||||
</footer>
|
</footer>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
<div class="divider">⌘</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -9,6 +9,6 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<.tag_list notes={@tag.notes} />
|
<.tag_bar notes={@tag.notes} />
|
||||||
</section>
|
</section>
|
||||||
</section>
|
</section>
|
18
lib/chiya_web/controllers/page_html/tag_bar.html.heex
Normal file
18
lib/chiya_web/controllers/page_html/tag_bar.html.heex
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
<ul>
|
||||||
|
<%= for {letter, tag_group} <- group_tags(@notes) do %>
|
||||||
|
<li class="mb-2">
|
||||||
|
<span class="capitalize text-theme-primary border border-theme-background1 rounded font-sm px-2 py-1 inline-block mb-2">
|
||||||
|
<%= letter %>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<%= for tag <- tag_group do %>
|
||||||
|
<a
|
||||||
|
href={~p"/tagged-with/#{tag.slug}"}
|
||||||
|
class="border border-theme-background1 rounded font-sm px-2 py-1 inline-block mb-2 hover:bg-theme-background1 transition"
|
||||||
|
>
|
||||||
|
<%= tag.name %> <span class="text-theme-base text-xs font-mono bg-theme-primary/25 rounded-full py-0.5 px-1 align-middle"><%= Enum.count(tag.notes) %></span>
|
||||||
|
</a>
|
||||||
|
<% end %>
|
||||||
|
</li>
|
||||||
|
<% end %>
|
||||||
|
</ul>
|
|
@ -1,18 +1,20 @@
|
||||||
<ul>
|
<span class="tags | inline-flex flex-row gap-1 whitespace-normal">
|
||||||
<%= for {letter, tag_group} <- group_tags(@notes) do %>
|
<%= for tag <- @note.tags do %>
|
||||||
<li class="mb-2">
|
<%= if @linked do %>
|
||||||
<span class="capitalize text-theme-primary border border-theme-background1 rounded font-sm px-2 py-1 inline-block mb-2">
|
<a class="tag | flex gap-0" href={~p"/tagged-with/#{tag.slug}"}>
|
||||||
<%= letter %>
|
<span>#</span>
|
||||||
|
<span class="p-category" >
|
||||||
|
<%= tag.name %>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
<% else %>
|
||||||
|
<span class="tag | flex gap-0">
|
||||||
|
<span>#</span>
|
||||||
|
<span class="p-category">
|
||||||
|
<%= tag.name %>
|
||||||
|
</span>
|
||||||
</span>
|
</span>
|
||||||
|
<% end %>
|
||||||
<%= for tag <- tag_group do %>
|
<span class="dot last:hidden" />
|
||||||
<a
|
|
||||||
href={~p"/tagged-with/#{tag.slug}"}
|
|
||||||
class="border border-theme-background1 rounded font-sm px-2 py-1 inline-block mb-2 hover:bg-theme-background1 transition"
|
|
||||||
>
|
|
||||||
<%= tag.name %> <span class="text-theme-base text-xs font-mono bg-theme-primary/25 rounded-full py-0.5 px-1 align-middle"><%= Enum.count(tag.notes) %></span>
|
|
||||||
</a>
|
|
||||||
<% end %>
|
|
||||||
</li>
|
|
||||||
<% end %>
|
<% end %>
|
||||||
</ul>
|
</span>
|
|
@ -9,6 +9,6 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<aside>
|
<aside>
|
||||||
<.tag_list notes={@notes} />
|
<.tag_bar notes={@notes} />
|
||||||
</aside>
|
</aside>
|
||||||
</section>
|
</section>
|
Loading…
Reference in a new issue