devel #193

Merged
inhji merged 9 commits from devel into main 2023-07-07 13:55:59 +02:00
8 changed files with 144 additions and 133 deletions

View file

@ -72,9 +72,7 @@
</header> </header>
<main class="mx-3 md:mx-0"> <main class="mx-3 md:mx-0">
<section class="mx-auto max-w-2xl"> <%= @inner_content %>
<%= @inner_content %>
</section>
</main> </main>
<footer class="max-w-full mt-8 p-8 text-theme-base/75 bg-theme-background1"> <footer class="max-w-full mt-8 p-8 text-theme-base/75 bg-theme-background1">

View file

@ -66,12 +66,13 @@ defmodule ChiyaWeb.PublicComponents do
end end
attr :note, :map, required: true attr :note, :map, required: true
attr :class_tag, :string, default: ""
def tags(assigns) do def tags(assigns) do
~H""" ~H"""
<span class="inline-flex flex-row gap-1"> <span class="inline-flex flex-row gap-1">
<%= for tag <- @note.tags do %> <%= for tag <- @note.tags do %>
<a href={~p"/tagged-with/#{tag.slug}"} class="underline-link font-semibold | p-category"> <a href={~p"/tagged-with/#{tag.slug}"} class={["p-category", @class_tag]}>
<%= tag.name %> <%= tag.name %>
</a> </a>
<% end %> <% end %>

View file

@ -1,24 +1,26 @@
<article class="h-card hcard"> <section class="max-w-2xl mx-auto">
<section class="p-10 bg-theme-background1 flex gap-3 items-start"> <article class="h-card hcard">
<div> <section class="p-10 bg-theme-background1 flex gap-3 items-start">
<img <div>
class="rounded-lg w-28 | u-photo" <img
src={ChiyaWeb.Uploaders.UserImage.url({@user.user_image, @current_user}, :thumb)} class="rounded-lg w-28 | u-photo"
/> src={ChiyaWeb.Uploaders.UserImage.url({@user.user_image, @current_user}, :thumb)}
</div> />
<div> </div>
<h1 class="text-3xl font-extrabold leading-10 tracking-tight text-theme-primary | p-name"> <div>
<%= @user.name %> <h1 class="text-3xl font-extrabold leading-10 tracking-tight text-theme-primary | p-name">
</h1> <%= @user.name %>
<section class="mx-auto mt-8 prose prose-gruvbox | p-note"> </h1>
<%= Markdown.render(@user.bio) |> raw() %> <section class="mx-auto mt-8 prose prose-gruvbox | p-note">
</section> <%= Markdown.render(@user.bio) |> raw() %>
</div> </section>
</section> </div>
<%= if @note do %>
<section class="mx-auto mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
<%= Markdown.render(@note.content) |> raw %>
</section> </section>
<% end %>
</article> <%= if @note do %>
<section class="mx-auto mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
<%= Markdown.render(@note.content) |> raw %>
</section>
<% end %>
</article>
</section>

View file

@ -1,8 +1,10 @@
<.header> <section class="max-w-2xl mx-auto">
<:title><%= @channel.name %></:title> <.header>
<:subtitle><%= @channel.content %></:subtitle> <:title><%= @channel.name %></:title>
</.header> <:subtitle><%= @channel.content %></:subtitle>
</.header>
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5"> <div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
<.note_list notes={@channel.notes} layout={@channel.layout} /> <.note_list notes={@channel.notes} layout={@channel.layout} />
</div> </div>
</section>

View file

@ -1,33 +1,35 @@
<.header class_title="text-theme-primary p-name" class_subtitle="p-summary"> <section class="max-w-2xl mx-auto">
<:title><%= @settings.title %></:title> <.header class_title="text-theme-primary p-name" class_subtitle="p-summary">
<:subtitle><%= @settings.subtitle %></:subtitle> <:title><%= @settings.title %></:title>
</.header> <:subtitle><%= @settings.subtitle %></:subtitle>
</.header>
<section class="text-sm my-8"> <section class="text-sm my-8">
<ul class="flex flex-wrap gap-3"> <ul class="flex flex-wrap gap-3">
<li>
<a
href="#"
class="inline-block text-theme-base px-3 py-2.5 border border-theme-background1 hover:bg-theme-background1 rounded transition font-semibold"
>
<.icon name="hero-megaphone" />
</a>
</li>
<%= for channel <- @channels do %>
<li> <li>
<a <a
href={~p"/channel/#{channel.slug}"} href="#"
class="inline-block text-theme-base px-3 py-2.5 border border-theme-background1 hover:bg-theme-background1 rounded transition font-semibold" class="inline-block text-theme-base px-3 py-2.5 border border-theme-background1 hover:bg-theme-background1 rounded transition font-semibold"
> >
<%= channel.name %> <.icon name="hero-megaphone" />
</a> </a>
</li> </li>
<% end %> <%= for channel <- @channels do %>
</ul> <li>
</section> <a
href={~p"/channel/#{channel.slug}"}
<%= if @channel do %> class="inline-block text-theme-base px-3 py-2.5 border border-theme-background1 hover:bg-theme-background1 rounded transition font-semibold"
<section class="mt-8"> >
<.note_list notes={@channel.notes} layout={@channel.layout} /> <%= channel.name %>
</a>
</li>
<% end %>
</ul>
</section> </section>
<% end %>
<%= if @channel do %>
<section class="mt-8">
<.note_list notes={@channel.notes} layout={@channel.layout} />
</section>
<% end %>
</section>

View file

@ -1,57 +1,59 @@
<article class="h-entry hentry"> <section class="max-w-2xl mx-auto">
<.header class_title="p-name"> <article class="h-entry hentry">
<:title><%= @note.name %></:title> <.header class_title="p-name">
</.header> <:title><%= @note.name %></:title>
</.header>
<section class="mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content"> <section class="mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
<%= Markdown.render(@note.content) |> raw %> <%= Markdown.render(@note.content) |> raw %>
</section> </section>
<footer class="mt-8 text-theme-base"> <footer class="mt-8 text-theme-base">
<%= if @note.published_at do %> <%= if @note.published_at do %>
<span>Published</span> <span>Published</span>
<% else %> <% else %>
<span>Unpublished</span> <span>Unpublished</span>
<% end %> <% end %>
<time class="font-semibold | dt-published"><%= pretty_date(@note.published_at) %></time> <time class="font-semibold | dt-published"><%= pretty_date(@note.published_at) %></time>
<.dot />
<span>Last Updated</span>
<time class="font-semibold" datetime={datetime(@note.updated_at)}>
<%= pretty_date(@note.updated_at) %>
</time>
<%= if not Enum.empty?(@note.tags) do %>
<.dot /> <.dot />
<span>Tags</span> <span>Last Updated</span>
<.tags note={@note} /> <time class="font-semibold" datetime={datetime(@note.updated_at)}>
<% end %> <%= pretty_date(@note.updated_at) %>
<%= if @current_user do %> </time>
<.dot /> <%= if not Enum.empty?(@note.tags) do %>
<a href={~p"/admin/notes/#{@note}"} class="underline-link font-semibold">Show in Admin</a> <.dot />
<% end %> <span>Tags</span>
<.tags note={@note} />
<% end %>
<%= if @current_user do %>
<.dot />
<a href={~p"/admin/notes/#{@note}"} class="underline-link font-semibold">Show in Admin</a>
<% end %>
<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>
<section class="mt-8"> <section class="mt-8">
<%= if !Enum.empty?(@note.images) do %> <%= if !Enum.empty?(@note.images) do %>
<.line /> <.line />
<div class="flex flex-wrap gap-3"> <div class="flex flex-wrap gap-3">
<%= for image <- @note.images do %> <%= for image <- @note.images do %>
<a <a
href={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :full_dithered)} href={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :full_dithered)}
class="lightbox | w-28" class="lightbox | w-28"
data-gallery="note" data-gallery="note"
data-description={ChiyaWeb.Markdown.render(image.content)} data-description={ChiyaWeb.Markdown.render(image.content)}
> >
<img <img
src={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :thumb_dithered)} src={ChiyaWeb.Uploaders.NoteImage.url({image.path, image}, :thumb_dithered)}
class="rounded" class="rounded"
/> />
</a> </a>
<% end %> <% end %>
</div> </div>
<% end %> <% end %>
</section> </section>
</article> </article>
</section>

View file

@ -1,8 +1,10 @@
<.header> <section class="max-w-2xl mx-auto">
<:title>Tagged with &ldquo;<%= @tag.name %>&rdquo;</:title> <.header>
<:subtitle><%= @tag.content %></:subtitle> <:title>Tagged with &ldquo;<%= @tag.name %>&rdquo;</:title>
</.header> <:subtitle><%= @tag.content %></:subtitle>
</.header>
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5"> <div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
<.note_list notes={@tag.notes} /> <.note_list notes={@tag.notes} />
</div> </div>
</section>

View file

@ -1,19 +1,21 @@
<.header> <section class="w-full px-3">
<:title>Wiki</:title> <.header>
</.header> <:title>Wiki</:title>
</.header>
<section class="prose prose-gruvbox"> <section class="prose prose-gruvbox">
<%= Markdown.render(@channel.content) |> raw %> <%= Markdown.render(@channel.content) |> raw %>
</section> </section>
<%= if @channel do %> <%= if @channel do %>
<section class="flex flex-col md:col-row"> <section class="flex flex-col md:flex-row">
<div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5"> <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
<.note_list notes={@notes_updated} layout={@channel.layout} /> <.note_list notes={@notes_updated} layout={@channel.layout} />
</div> </div>
<div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5"> <div class="w-full mt-6 sm:w-auto flex flex-1 flex-col gap-1.5">
<.note_list notes={@notes_published} layout={@channel.layout} /> <.note_list notes={@notes_published} layout={@channel.layout} />
</div> </div>
</section> </section>
<% end %> <% end %>
</section>